对象的对象的访问属性[重复]答案

【问题标题】：Access property of an object of an object [duplicate]对象的对象的访问属性[重复]
【发布时间】：2019-02-04 10:15:20
【问题描述】：

拥有这种形式的对象：

myObj = {
    id: 1,
    values: {
        internal: {
                myProp1: true
                myProp2: true
            },
        external: {
                myProp1: true
                myProp2: true
            }

    }
};

我希望当我选择一个选项时，internal 或 external 能够仅针对我选择的一个选项将 myProp1 设置为 false。

在这种情况下，如果我选择internal，对象应该如下所示：

myObj = {
    id: 1,
    values: {
        internal: {
                myProp1: false
                myProp2: true
            },
        external: {
                myProp1: true
                myProp2: true
            }

    }
};

我试图这样做，但我做错了：

    Object.keys(myObj).forEach(element => {
        if(element === "values") {
            element.forEach(innerElement => {
                if(innerElement === "internal") {
                    innerElement.myProp1= false;
                }
            });
        }
    });

有什么建议吗？

【问题讨论】：

你可以像访问对象道具myObj.values.internal.myProp1 = false一样访问子对象
如果您想使用字符串作为属性名称，您可以使用[...] 表示法，这是一个示例：myObj.values[innerElement].myProp1 = false。您可以找到更多详细信息HERE

标签： javascript object ecmascript-6 key

【解决方案1】：

你可以像访问对象属性一样访问子对象

myObj.values.internal.myProp1 = false

注意它会抛出一个错误，它至少有一个链的元素（myProp1 除外）未定义

就像@titus 在评论中所说，您也可以使用[...] 表示法

myObj = {
  id: 1,
  values: {
    internal: {
      myProp1: false,
      myProp2: true
    },
    external: {
      myProp1: true,
      myProp2: true
    }
  }
};

// using basic notation
console.log(myObj.values.internal.myProp1)

// using [...] notation to access prop by name
console.log(myObj["values"]["internal"]["myProp1"])

// the [...] notation is generally used when the prop name is in a variable
let propName = "internal"
console.log(myObj["values"][propName]["myProp1"])

// can be mixed
console.log(myObj["values"].internal["myProp1"])
console.log(myObj.values[propName].myProp1)

【讨论】：

【解决方案2】：

我想这就是你想要的。您需要访问变量 myObj 本身。

Object.keys(myObj).forEach(element=>{
    if(element === "values"){
        Object.keys(myObj[element]).forEach(innerElement=>{
            if (innerElement === "internal"){
                myObj[element][innerElement].myProp1 = false;
            }
        })
    }
})

【讨论】：

【解决方案3】：

如果您也接受建议，我建议您使用数组来表示集合而不是对象。这使得在数组中查找任何内容的代码比遍历键和值更容易。

智能数据结构和愚蠢的代码通常比其他方式工作得更好。将集合从对象切换到数组，大大减少了我必须为转换编写的代码。

const collection = [
  {
    "id": 1,
    "internal": [
      { "name": "myProp1", "val": true },
      { "name": "myProp2", "val": true }
    ],
    "external": [
      { "name": "myProp1", "val": true },
      { "name": "myProp2", "val": true }
    ]
  },
  {
    "id": 2,
    "internal": [
      { "name": "myProp1", "val": false },
      { "name": "myProp2", "val": false }
    ],
    "external": [
      { "name": "myProp1", "val": null },
      { "name": "myProp2", "val": null }
    ]
  }
];
const item_1 = collection.find( item => item.id === 1 );
const internal_prop = item_1.internal.find( prop => prop.name === 'myProp1' );
internal_prop.val = false;
console.log( collection );

【讨论】：