js中对象的访问

js中，对象的属性访问有三种方法：

点属性访问器： object.property
方括号属性访问： object['property']
对象解构： const { property } = object

比较常用的是点属性访问器和方括号属性访问。为什么会想到写这个呢，因为看到了力扣的题解，一开始没看懂，然后细看才想明白就是用了方括号属性访问器根据传入的参数选中对象的属性，发现原来这个对象属性方法原来可以这么用，附上题目连接：1773. 统计匹配检索规则的物品数量 - 力扣（LeetCode）

方括号属性访问器

访问对象属性

方法 object['property']
例子

//首先定义一个对象
var person = {
    firstName: "John",
    lastName : "Doe",
    id : 5566,
    'prop-3': 'three',
    '3': 'three' ,
    affiliation: ['Batman Family', 'Justice League', 'Outsiders', 'Guild of Detection'],
    status: {
      alignment: 'good',
      occupation: 'businessman'
    }
};

特点：
1. 支持不是有效标识符的属性名称
  要获取person对象的'prop-3'属性和'3'，使用点属性访问器无效
```
//要获取person对象的'prop-3'属性和'3'，使用点属性访问器无效
console.log(person.prop-3) // =>NaN
console.log(person.3) // => Uncaught SyntaxError
```
使用方括号属性访问器可以正确获得,使用时需要给属性名加上引号，单引号或者双引号都可以
```
console.log(person.['prop-3'])
console.log(person.['3'])
```
1. 支持链式访问
  这是点属性访问器也有的功能
```
console.log(person['status']['alignment'])// =>good
console.log(person['affiliation'][1])// =>Justice League
```
控制台将打印good和Justice League
1. 支持动态地访问属性，即适用于属性名称为在运行时确定的情况
简而言之就是你一开始可能并不知道该属性名，但是之后这个属性名被存在某一个变量中，你可以引用此变量来访问与变量值匹配的属性,而且变量名放在方括号里是不需要加引号。
```
const myFirstName = "firstName"
console.log(person[myFirstName])
// =>John
```
控制台将打印John

应用

以下的应用均基于第3个特点，动态地访问属性

1. 在for..in循环中获得对象的属性（通过键值对的键获得值）

for (var x in person) {
    console.log('person:',person[x])
}

有没有发现感觉用上方括号选择器后获取对象的值很像使用数组下标取值，如果使用.去获得的话，得到值会是“undefined”，因为.只能获取对象中确定的属性

2. 接收函数参数作为选择器选出对象属性值，实现类似Map的功能

回到那条力扣题解，红框部分就是一个对象，后面跟着方括号属性选择器，根据传入的参数选出跟对象中键值与参数相同的属性的属性值根据传入的ruleKey,index的值就为0，1，或2;实现了类似Map.prototype.get()的功能

参考

在JavaScript中访问对象属性的方法有哪几种？ - 知乎 (zhihu.com)
访问对象的属性，你知道有哪些方法？ - 简书 (jianshu.com)
js对象属性通过点(.) 和方括号([]) 的不同之处_js 为什么用方括号定义不了对象属性-CSDN博客
 js对象属性的查询（点运算符和方括号运算符的区别）-CSDN博客
 javaScript 访问对象属性的两种方式和中括号[]的形式_js .访问对象与括号访问对象-CSDN博客
 使用对象 - JavaScript | MDN (mozilla.org)

js访问对象属性之方括号属性访问器

js中对象的访问

方括号属性访问器

访问对象属性

应用

1. 在for..in循环中获得对象的属性（通过键值对的键获得值）

2. 接收函数参数作为选择器选出对象属性值，实现类似Map的功能

参考