ES6对象(1)：新增语法与API

最新推荐文章于 2023-03-14 14:29:01 发布

桃花扇J

最新推荐文章于 2023-03-14 14:29:01 发布

阅读量302

点赞数

分类专栏： ES6 文章标签： object js es6

本文链接：https://blog.csdn.net/weixin_44584442/article/details/105808799

版权

ES6 专栏收录该内容

27 篇文章 1 订阅

订阅专栏

3.Object.getOwnPropertyNames的枚举顺序

4.Object.setPrototypeOf

一.新增的对象字面量语法

1.成员速写

如果对象字面量初始化时，成员的名称来自于一个变量，并且和变量名的名称相同，则可以进行简写

【例1-1】

之前的写法

function personMes(name, sex, age, address) {
    return {
        name : name,
        sex : sex,
        age : age,
        address: address,
    }
}
const person = personMes('jwh', 'female', 18, '陕西省');
console.log(person);

ES6写法

function personMes(name,sex,age,address) {
    return{
        name,
        sex,
        age,
        address
    }
}
const person = personMes('jwh', 'female', 18, '陕西省');
console.log(person);

2.方法速写

对象字面初始化时，方法可以省略冒号和function关键字

【例1-2】

之前的写法

const init = {
    name : 'jwh',
    age : 18,
    print: function () {
        console.log(this.name, this.age);
    }
}
init.print();

ES6写法

const init = {
    name : 'jwh',
    age : 18,
    print() {
        console.log(this.name, this.age);
    }
}
init.print();

3.计算属性名

有的时候，初始化对象时，某些属性名可能来自于某个表达式的值，在ES6中，可以使用中括号来表示该属性名是通过计算得到的。

【例1-3】

const prop1 = 'name';
const prop2 = 'age';
const prop3 = 'print';
const user = {
    [prop1] : 'jwh',
    [prop2] : 18,
    [prop3] () {
        console.log(this[prop1] ,this[prop2])
    }
}
user[prop3]();
console.log(user);

二.Object的新增API

1.Object.is

用于判断两个数据是否相等，基本上跟严格相等（===）是一致的，除了以下两点

NaN和NaN相等
+0和-0不相等

【例2-1】

console.log('NaN === NaN的结果', NaN === NaN);
console.log('Object.is(NaN, NaN)', Object.is(NaN, NaN));
console.log('+0 === -0的结果', +0 === -0);
console.log('Object.is(+0, -0)',Object.is(+0, -0));

【结果】

2.Object.assign

用于混合对象，Object.assign(obj1, obj2,...)，将所有对象按照顺序混合到第一个对象上，若obj1没有的属性则直接添加，若obj1有该属性，则进行覆盖。

【例2-2】

obj1 = {
    name: 'jwh',
    age: 18,
    sex: 'female'
}
obj2 = {
    grade: 1,
    number: 1901210214,
    name: 'ths'
}
obj3 = {
    address: 2313,
    grade: 2
}
Object.assign(obj1, obj2, obj3);
console.log('obj1:', obj1);
console.log('obj2:', obj2);
console.log('obj3:', obj3)

【结果】

3.Object.getOwnPropertyNames的枚举顺序

Object.getOwnPropertyNames方法之前就存在，只不过官方没有明确要求对属性的顺序如何排序，具体如何排序，完全由浏览厂商决定。ES6规定了该方法返回的数组的排序方式如下

先排数字，并按照升序排列
再排其他，按照书写顺序排序

【例2-3】

obj1 = {
    2: 'grade',
    name: 'jwh',
    1: 'address',
    age: 18,
    sex: 'female',
}
console.log(Object.getOwnPropertyNames(obj1));

【结果】

4.Object.setPrototypeOf

该函数用于设置某个对象的隐式原型，比如Object.setPrototypeOd(obj1, obj2)，相当于obj1.__proto__ = obj2.__proto__

【例2-4】不设置的话，obj1的隐式原型是Object

obj1 = {
    name: 'jwh',
    age: 18,
    sex: 'female'
}
obj2 = {
    grade: 1,
    number: 1901210214
}
Object.setPrototypeOf(obj1, obj2)
console.log(obj1);

【结果】