JavaScript中嵌套对象的方括号属性访问语法是什么？如何使用？

1. 名称与本质 #

这种写法叫做对象的方括号表示法，用来访问嵌套JavaScript对象的属性。你示例里的Data是一个嵌套对象，不是数组——数组用[]定义，而对象是{}包裹的键值对结构，每个键（key）对应一个值（value），值可以是任意类型，包括另一个对象（也就是嵌套对象）。

2. 核心含义 #

JavaScript对象是键值对的集合，['xxx']的作用就是通过指定的键名，获取对象中对应的值。当对象的属性值也是一个对象时，就可以连续使用方括号，逐层访问嵌套的属性（比如Data['apple']['banana']就是先取Data里apple对应的对象，再取这个子对象里banana对应的值）。

它和更常见的点表示法（比如Data.apple.banana）功能等价，只是适用场景不同。

3. 常见用法 #

• 访问嵌套属性：像你示例里的结构，多层嵌套的对象可以通过连续方括号逐层访问，比如：

  const Data = {
    'apple':{
      'banana':{
        color: 'yellow',
        price: 5
      }
    }
  }
  console.log(Data['apple']['banana']['color']); // 输出 'yellow'
  

• 动态获取属性：如果键名存在变量里，只能用方括号表示法，比如：

  const fruit = 'apple';
  const subFruit = 'banana';
  console.log(Data[fruit][subFruit].price); // 输出 5
  

• 键名含特殊字符：当键名包含空格、连字符等特殊字符时，点表示法无法使用，必须用方括号，比如：

  const Data = {
    'red apple': {
      'fresh-banana': 3
    }
  }
  console.log(Data['red apple']['fresh-banana']); // 输出 3
  

区分对象与数组 #

你之前混淆了对象和数组：

• 数组是有序集合，用[]定义，访问时方括号里是数字索引（比如arr[0]）；
• 对象是无序键值对集合，用{}定义，方括号里是字符串类型的键名（或者能转为字符串的变量）。

内容的提问来源于stack exchange，提问作者BlackInk7777