【ES6】对象新特性

最新推荐文章于 2022-08-17 21:52:27 发布

@剁椒鱼头

最新推荐文章于 2022-08-17 21:52:27 发布

阅读量200

点赞数

文章标签： es6 javascript 前端

本文链接：https://blog.youkuaiyun.com/qq_57215961/article/details/125379775

版权

本文介绍了ES6中对象属性简写技巧，如name、age简写，Object.is()的比较特性，Object.assign()的合并对象，以及Object.keys(), Object.values(), Object.entries()的用法。通过实例展示了如何利用这些新特性提高代码简洁性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1. 属性及方法的简洁表示

当key名与value名相同时可以简写为下面ES6形式。

    let name = "ali";
    let age = 18;
    
    //ES5
    var obj1 = {
        name: name,
        age: age,
        run:function(){
            console.log("快速跑！")
        }
    }

    //ES6
    var obj2 = {
        name,
        age,
        run(){
            console.log("快速跑！")
        }
    }

2. Object.is()

相当于全等，但是有区别

建议使用 ===

    console.log(Object.is(1,2));    //false
    console.log(1===2);             //false
    console.log(Object.is(NaN, NaN));   //true
    console.log(NaN === NaN);       //false
    console.log(Object.is(0, -0));  //false
    console.log(0===-0);            //true

3. Object.assign(obj1,obj2,obj3)

合并对象

所有对象都会合并到obj1，如果是相同的属性，后边的对象的属性值会对前边的进行覆盖。

4. Object.keys(obj)

将obj的key值返回一个纯数组

    let person = {name:"张三",age:25,address:"深圳",getName:function(){}}

    Object.keys(person) // ["name", "age", "address","getName"]

5. Object.values(obj)

将obj的value值返回一个纯数组

    let person = {name:"张三",age:25,address:"深圳",getName:function(){}}

    console.log(Object.values(person)); // ['张三', 25, '深圳', ƒ]

6. Object.entries(obj)

返回一个二维数组，每一个小数组都是一对[key, value]

    let person = {name:"张三",age:25,address:"深圳",getName:function(){}}

    console.log(Object.entries(person)); 

    //    (4) [Array(2), Array(2), Array(2), Array(2)]
    // 0: (2) ['name', '张三']
    // 1: (2) ['age', 25]
    // 2: (2) ['address', '深圳']
    // 3: (2) ['getName', ƒ]