- 1. ES6之对象的扩展
- 1.1. 属性简写:
- 1.2. 方法简写
- 1.3. 属性名表达式
- 1.4. 方法的 name 属性
- 1.5. Object.is():
- 1.6. Object.assign():
- 1.7. 属性的遍历:
- 1.8. Object.getOwnPropertyDescriptors()
- 1.9. Object.setPrototypeOf() 与 Object.getPrototypeOf()
- 1.10. Super关键字:
- 1.11. Object.keys(),Object.values(),Object.entries()
- 1.12. 扩展运算符(…):
- 1.13. Null 传导运算符
?.
1. ES6之对象的扩展
ES6(ECMAScript 2015)对JavaScript的对象类型进行了显著的扩展和改进,旨在简化对象字面量的编写、增强对象操作的灵活性,并引入了一些新的API来提升开发者效率。
以下是ES6中对象的一些关键扩展及其例子:
1.1. 属性简写:
ES6 允许直接写入变量和函数,作为对象的属性和方法。这样的书写更加简洁。
使用方括号[]允许在对象字面量中使用表达式作为属性名。例如:
let propName = 'age';
let person = {
[propName]: 25 // 动态生成属性名
};
在对象字面量中,如果属性名与变量名相同,可以省略冒号和值,直接写变量名。
例如:
let x = 1, y = 2;
let obj = {
x, y}; // 等同于 {x: x, y: y}
1.2. 方法简写
对象字面量中的函数可以不用function
关键字,直接跟一对圆括号表示。
这种写法用于函数的返回值,将会非常方便。
如:
let birth = '2000/01/01';
const Person = {
name: '张三',
//等同于birth: birth
birth,
// 等同于hello: function ()...
hello() {
console.log('我的名字是', this.name); }
};
let obj = {
sayHello(name) {
// 等同于 sayHello: function(name)
console.log(`Hello, ${
name}!`);
}
};
注意,简洁写法的属性名总是字符串,这会导致一些看上去比较奇怪的结果。
const obj = {
class () {
}
};
// 等同于
var obj = {
'class': function() {
}
};
上面代码中, class 是字符串,所以不会因为它属于关键字,而导致语法解析报错。
1.3. 属性名表达式
JavaScript 定义对象的属性,有两种方法。
// 方法一
obj.foo = true;
// 方法二
obj['a' + 'bc'] = 123;
方法一是直接用标识符作为属性名,方法二是用表达式作为属性名,这时要将表达式放在方括号之内。
ES6 允许字面量定义对象时,用方法二(表达式)作为对象的属性名,即把表达式放在方括号内。
let lastWord = 'last word';
const a = {
'first word': 'hello',
[lastWord]: 'world'
};
a['first word'] // "hello"
a[lastWord] // "world"
a['last word'] // "world"
表达式还可以用于定义方法名。
let obj = {
['h' + 'ello']() {
return 'hi';
}
};
obj