1.属性的简洁表示法
允许在对象中直接写入变量和函数,作为对象的属性和方法.
const a = {foo}
// 等同于
const a = {foo: foo}
变量直接写在大括号内,属性名就是变量名,属性值就是变量值 例子:
function f(x, y) {
return {x,y}
}
// 这个函数返回一个对象,这个对象有;两个属性x,y,属性x的值就是:传入参数x 的值,属性y的值就是:传入参数y 的值,
//等同于
function f(x, y) {
return {x, y}
}
f(1,2) // {1, 2}
除了属性可以简写外,方法也可以简写
const a = {
getName() {
}
}
// 等同于
const a = {
getName: function() {
}
}
2 属性名表达式
JS定义对象的属性名,有两种方法
// 方法一
const a = {}
a.foo = true
// 方法二
const a = {}
a['foo'] = true
但是如果使用对象字面量的方式,只能使用方法一(对象标识符)。 现在ES6 允许在使用对象字面量方式的时候, 使用表达式作为队形的属性名,就是 [表达式]作为属性名。也有人把这种形式叫做对象属性名的计算表达式。
let propKey = 'foo'
let a = {
[propKey]: 'name',
['a' + 'b']: 'age'
}
a // {foo: "name", ab: "age"}
这种表达式同样可以作用与对象的方法名上,
let obj = {
['a'+ 'b'] () {
console.log('ab')
}
}
obj.ab() // ab
注意,属性名表达式与简洁表示法,不能同时使用,会报错。
// 报错
const foo = 'bar';
const bar = 'abc';
const baz = { [foo] };
// 正确
const foo = 'bar';
const baz = { [foo]: 'abc'};
注意,属性名表达式如果是一个对象,默认情况下会自动将对象转为字符串[object Object],这一点要特别小心。
const keyA = {a: 1};
const keyB = {b: 2};
const myObject = {
[keyA]: 'valueA',
[keyB]: 'valueB'
};
// 很好奇为什么会出现这种情况?暂时无法解决疑问。
myObject // Object {[object Object]: "valueB"}
3.方法的 name 属性
返回方法的函数名
const person = {
sayName() {
console.log('hello!');
}
};
person.sayName.name // "sayName"
4 属性的可枚举型和遍历
我们知道对象的每个属性都有一个描述对象(Descriptor),用来控制属性的行为。 Object.getOwnPropertyDescriptor() 这个方法可以获取属性的描述对象
let obj = { foo: 123 }
Object.getOwnPropertyDescriptor(obj, 'foo')
// 返回对象obj属性foo的描述对象。
// {
// value: 123,
// writable: true,
// enumerable: true,
// configurable: true
// }
描述对象的enumerable 规定了这个属性是否可被枚举,如果这个值为false,就表示在 操作时 会忽略这个属性,意为在对这个对象进行遍历时,foo 属性是 不能被遍历的。 但是,有些操作会忽略 描述对象的 enumerable 为false的情况,意为,即使为false ,这个属性依然会被遍历。这些操作包含:
for...in循环:只遍历对象自身的和继承的可枚举的属性。
Object.keys():返回对象自身的所有可枚举的属性的键名。
JSON.stringify():只串行化对象自身的可枚举的属性。
Object.assign(): 忽略enumerable为false的属性,只拷贝对象自身的可枚举的属性。
遍历对象属性的方法
- for...in
- Object.keys(obj)
- Object.getOwnPropertyNames(obj)
- Object.getOwnPropertySymbols(obj)
- Reflect.ownKeys(obj)
5.super关键字
this关键字总是指向函数所在的当前对象,ES6 又新增了另一个类似的关键字super,指向当前对象的原型对象。
const proto = {
foo: 'hello'
};
const obj = {
foo: 'world',
find() {
return super.foo;
}
};
Object.setPrototypeOf(obj, proto); // 用来更改对象的原型对象
obj.find() // "hello"
super关键字只能用在对象的方法上,用在其他地方会报错。
6.对象结构赋值
解构赋值是浅拷贝