当对象字面量的属性名与变量名相同时,可以省略属性名,直接使用变量名作为属性名。
const x = 10;
const y = 20;
// ES6之前
const obj1 = { x: x, y: y };
// ES6属性简写
const obj2 = { x, y };
注意:简写的对象方法不能用作构造函数,否则会报错
在对象字面量中定义方法时,可以省略冒号和 function 关键字。
// ES6之前
const obj1 = {
method: function() {
// 方法内容
}
};
// ES6方法简写
const obj2 = {
method() {
// 方法内容
}
};
在对象字面量中,可以使用计算表达式来定义属性名。
const prefix = "foo";
const obj = {
[prefix + "Bar"]: 42
};
console.log(obj.fooBar); // 输出 42
可以从对象中提取属性并赋值给变量。
const obj = { x: 10, y: 20 };
const { x, y } = obj;
console.log(x, y); // 输出 10 20
用于将一个或多个源对象的属性复制到目标对象。
const target = { a: 1 };
const source = { b: 2, c: 3 };
const result = Object.assign(target, source);
console.log(result); // 输出 { a: 1, b: 2, c: 3 }
这些静态方法用于获取对象的键、值和键值对的数组。
const obj = { a: 1, b: 2, c: 3 };
console.log(Object.keys(obj)); // 输出 ["a", "b", "c"]
console.log(Object.values(obj)); // 输出 [1, 2, 3]
console.log(Object.entries(obj)); // 输出 [["a", 1], ["b", 2], ["c", 3]]
ES6 一共有 5 种方法可以遍历对象的属性。
for…in:循环遍历对象自身的和继承的可枚举属性(不含 Symbol 属性)
Object.keys(obj):返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含 Symbol 属性)的键名
Object.getOwnPropertyNames(obj):回一个数组,包含对象自身的所有属性(不含 Symbol 属性,但是包括不可枚举属性)的键名
Object.getOwnPropertySymbols(obj):返回一个数组,包含对象自身的所有 Symbol 属性的键名
Reflect.ownKeys(obj):返回一个数组,包含对象自身的(不含继承的)所有键名,不管键名是 Symbol 或字符串,也不管是否可枚举
上述遍历,都遵守同样的属性遍历的次序规则:
const target = { a: 1 };
const source = { b: 2, c: 3 };
const result = Object.assign(target, source);
console.log(result);
// 输出:{ a: 1, b: 2, c: 3 }
const obj = { a: 1, b: 2, c: 3 };
const keys = Object.keys(obj);
console.log(keys);
// 输出:['a', 'b', 'c']
const obj = { a: 1, b: 2, c: 3 };
const values = Object.values(obj);
console.log(values);
// 输出:[1, 2, 3]
const obj = { a: 1, b: 2, c: 3 };
const entries = Object.entries(obj);
console.log(entries);
// 输出:[['a', 1], ['b', 2], ['c', 3]]
const entries = [['a', 1], ['b', 2], ['c', 3]];
const obj = Object.fromEntries(entries);
console.log(obj);
// 输出:{ a: 1, b: 2, c: 3 }
const parent = {
sayHello() {
console.log('Hello');
}
};
const child = Object.create(parent, {
name: {
value: 'Alice',
writable: true,
enumerable: true,
configurable: true
}
});
console.log(child.name);
child.sayHello(); // 输出:Hello