Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

# ECMAScript proposal: Path traversal access to object parent properties (implementation). #5

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

shallowones
Copy link

@shallowones shallowones commented May 22, 2019

ECMAScript proposal: Path traversal access to object parent properties (implementation).

Motivation

All JavaScript's objects can't remember their own parent objects. Here is one solution to this problem.

I was inspired by the bstuff's
idea and wrote a small implementation
(specially for HolyJS Piter 2019).

High-level API

First you need to create some objects like:

const someObject = {
  propA: 'A1',
  propB: {
      propB1: 'B1',
      propB2: 'B2',
    }
}

const someSecondObject = someObject.propB

And after that you can access any properties of the parent object using the arrays syntax:

console.log(someSecondObject['./']) // = { propB1: 'B1', propB2: 'B2' }
console.log(someSecondObject['../']) // = { propA: 'A1', propB: { propB1: 'B1', propB2: 'B2' } }
console.log(someSecondObject['../propA']) // = 'A1'
console.log(someSecondObject['../propB/propB2']) // = 'B2'

How it works?

Assembly

Gulp was used as an assembly tool, as it is simple and easy to use.

You can look at the configuration in the gulpfile.js.

Plugin

In order to add objects "memory" about their parent objects, I wrote a plugin that parsed javascript code
and wrapped all objects by some functions. You can see the plugin implementation in the
src/plugin/objectBindingPlugin.js.

Parsing

For parsing code was selected the package falafel.

How I parsed code you can see in src/plugin/parse.js.

Wrapping

Your simple javascript code:

const alex = {
  name: 'Alex',
  dateOfBirth: {
    day: '04',
    month: '03',
    year: '1996'
  },
}

const alexsDateOfBirth = alex.dateOfBirth

console.log(alexsDateOfBirth['../name'])

After building your code we will see the following in the bundle file:

const createObject = () => { /* ... */ }
const getFromObject = () => { /* ... */ }

const person = createObject({
  name: 'Alex',
  dateOfBirth: {
    day: '04',
    month: '03',
    year: '1996'
  },
})

const alexsDateOfBirth = alex.dateOfBirth

console.log(getFromObject(alexsDateOfBirth, '../name'))

Function createObject returns modified object in which each object remembers its parent
(implementation: src/plugin/service/createObject.js).

Function getFromObject returns requested property from an object
(implementation: src/plugin/service/getFromObject.js).

FAQ

  1. How can I test this solution? — Just clone the repository and run the command
    npm i && npm run start.
  2. Can I test this solution with my initial data? — Sure. You should go to src/data
    and either create a new javascript file or modify existing files.
  3. Don't you think that this solution is an anti-pattern? — Yes, I think so. But when I had free
    time, it became very interesting for me to implement something like this.
  4. Will this solution be compatible with other libraries? — I don't know, this solution is
    only to demonstrate the bstuff's idea in action :)

@shallowones shallowones changed the title Initial commit # ECMAScript proposal: Path traversal access to object parent properties (implementation). May 22, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant