js对象获取属性的几种方法

js 对象获取属性有多种方法。

通过 . 方式获取属性值

key是静态的。

const person = {name: "zhang", age: 18};
console.log(person.name);

通过 [] 获取属性值

key是动态的，可以是字符串，或者数字的形式。

const fruits = {"apple": 3, "pear": 2}
const person = {name: "zhang", age: 18};
console.log(fruits["apple"]);
console.log(person[1]);  // 注意这里的写法跟数组容易混淆，cc仍是对象，不是数组

通过使用这种方式，可以在属性名定义和使用上实现解耦。

Object.keys()方式

这是对象内置属性方法: Object.keys()；该方法返回一个数组，数组内包括 对象内可枚举属性以及方法名称

const fruits = {"apple": 3, "pear": 2}
const keys= Object.keys(fruits);
console.log(keys); // 输出 keys ["apple", "pear"]

Object.getOwnPropertyNames()

方法返回一个 指定对象 所有自身属性的属性名（包括不可枚举属性, 但不包括 Symbol 值作为名称的属性）组成的数组.（不可枚举: 比如属性是一个js方法）

const fruits = {"apple": 3, "pear": 2}
const keys = Object.getOwnPropertyNames(fruits);
console.log(keys);　　// 输出 keys ["apple", "pear"]

for...in

最原始的 for...in 循环

const fruits = {"apple": 3, "pear": 2}
const keys =[];
  for(var i in fruits){
    keys.push(i);
  }
console.log(keys);   // 输出 keys ["apple", "pear"]

致谢

1. JS获取对象“属性”的方法

2. js对象获取属性的方法(.和[]方式)