js中对象Object的常用方法

前端

学习记录 - Object的常用方法

属性名表达式

1
2
3
4
5
6
7
8
9
10
11
12
// 方法一
obj.foo = true;

// 方法二
obj['a' + 'bc'] = 123;

//ES6
let propKey = 'foo';
let obj = {
	[propKey]: true,
	['a' + 'bc']: 123
};

对象里函数
函数的name属性，返回函数名。对象方法也是函数，因此也有name属性

属性的遍历

  • for…in…
  • Object.keys(obj)
    • Object.keys返回一个数组，包括对象自身的（不含继承的）所有可枚举属性（不含 Symbol 属性）的键名
  • Object.getOwnPropertyNames(obj)
    • Object.getOwnPropertyNames返回一个数组，包含对象自身的所有属性（不含 Symbol 属性，但是包括不可枚举属性）的键名
  • Object.getOwnPropertySymbols(obj)
    • Object.getOwnPropertySymbols返回一个数组，包含对象自身的所有 Symbol 属性的键名
  • Reflect.ownKeys(obj)
    • Reflect.ownKeys返回一个数组，包含对象自身的所有键名，不管键名是 Symbol 或字符串，也不管是否可枚举
  • 以上的 5 种方法遍历对象的键名，都遵守同样的属性遍历的次序规则。
    • 首先遍历所有数值键，按照数值升序排列。
    • 其次遍历所有字符串键，按照加入时间升序排列。
    • 最后遍历所有 Symbol 键，按照加入时间升序排列。

super关键字

​ this关键字总是指向函数所在的当前对象，ES6 又新增了另一个类似的关键字super，指向当前对象的原型对象

1
2
3
4
5
6
7
8
9
10
11
12
13
const proto = {
  foo: 'hello'
};

const obj = {
  foo: 'world',
  find() {
    return super.foo;
  }
};

Object.setPrototypeOf(obj, proto);
obj.find() // "hello"

常用方法

1
2
3
Object.keys(obj)     //返回键名数组（es6）
Object.values(obj)         //返回键值数组（es7）
Object.entries(obj)        //返回键值对数组（es7）

判断是否存在某键值

hasOwnProperty()

  • 方法会返回一个布尔值
  • 所有继承了 Object 的对象都会继承到 hasOwnProperty 方法
1
2
3
4
5
6
7
8
9
10
11
12
13
const dome = {
    a: 1,
    c: 3,
    warn: null,
    WARN: undefined
};
dome.hasOwnProperty('a');  // true
dome.hasOwnProperty('b');  // false
// Tip
dome.hasOwnProperty('warn');  // true
dome.hasOwnProperty('WARN');  // true

Object.prototype.hasOwnProperty.call(dome, 'a');  // true