# Deep creation of object...

**URL:** <https://es.discourse.group/t/deep-creation-of-object/230>\
**Category:** 💡 Ideas\
**Tags:** proposal\
**Created:** [February 22, 2020, 1:37am UTC](https://es.discourse.group/t/deep-creation-of-object/230 "2020-02-22T01:37:40Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![mnini](https://yyz2.discourse-cdn.com/free1/user_avatar/es.discourse.group/mnini/32/253_2.png) [@mnini](https://es.discourse.group/u/mnini)\
**Post date:** [February 22, 2020, 1:37am UTC](https://es.discourse.group/t/deep-creation-of-object/230/1 "2020-02-22T01:37:40Z")

</div>

var x.chrome.tab = true  
Binding variable like this could actually set it up as nested object, instead of giving error that it cannot access it from certain point.

---

<div class="post-metadata">

**Author:** ![bergus](https://yyz2.discourse-cdn.com/free1/user_avatar/es.discourse.group/bergus/32/152_2.png) [@bergus](https://es.discourse.group/u/bergus)\
**Post date:** [February 22, 2020, 5:43pm UTC](https://es.discourse.group/t/deep-creation-of-object/230/2 "2020-02-22T17:43:20Z")

</div>

What's the point? Just write what you mean to do:

```javascript
var x = {chrome: {tab: true}};

```

I don't see the problem that this is trying to solve.

---

<div class="post-metadata">

**Author:** ![mnini](https://yyz2.discourse-cdn.com/free1/user_avatar/es.discourse.group/mnini/32/253_2.png) [@mnini](https://es.discourse.group/u/mnini)\
**Post date:** [February 24, 2020, 7:34am UTC](https://es.discourse.group/t/deep-creation-of-object/230/3 "2020-02-24T07:34:49Z")

</div>

Because then in nested structures you have to overwrite whole objects, or use Object.Assign... Both of which are unnecessary crap standing in million lines of finished code every day.

---

<div class="post-metadata">

**Author:** ![simonkcleung](https://yyz2.discourse-cdn.com/free1/user_avatar/es.discourse.group/simonkcleung/32/785_2.png) [@simonkcleung](https://es.discourse.group/u/simonkcleung)\
**Post date:** [July 28, 2020, 4:32pm UTC](https://es.discourse.group/t/deep-creation-of-object/230/4 "2020-07-28T16:32:03Z")

</div>

A quick solution is using camel-case. i.e.  
var xChromeTab = true;

To achieve this idea, I think that we need a feature that group/nest some properties, instead of using an object.

Take element.style.borderBottomColor in DOM/CSSOM as an example:

A feature that allows writing element.style.border.bottom.color without nesting objects  
and it represents as a flatten internal property, say "styleBorderBottomColor" of element object.

---

<div class="post-metadata">

**Author:** ![aclaymore](https://yyz2.discourse-cdn.com/free1/user_avatar/es.discourse.group/aclaymore/32/501_2.png) [@aclaymore](https://es.discourse.group/u/aclaymore)\
**Post date:** [November 15, 2020, 6:51pm UTC](https://es.discourse.group/t/deep-creation-of-object/230/6 "2020-11-15T18:51:31Z")

</div>

I agree that writing or trying to read a nested Object.assign is no fun.

```javascript
// var x.chrome.tab = true
Object.assign(
  x, { chrome: Object.assign(x.chrome ?? {},
    { tab: true }
  )}
)

```

One alternative is to use [lodash - set](https://lodash.com/docs/4.17.15#set)

```javascript
import set from 'lodash/set';

set(x, 'chrome.tab', true);
// or
set(x, ['chrome', 'tab'], true);

```