ECMAScript6（ES6）标准之对象Object扩展方法及新特性

不念不忘少年蓝@ 2024-04-18 04:09 85阅读 0赞

ES6对于Object也扩增了几个方法  
不过最重要的是  
ES6扩展了一些语法  
比如说允许直接写入变量和函数，作为对象的属性和方法  
使我们的对象更加简洁  
下面我就来详细说明一下

## 语法扩展 ##

**简写对象属性**

> let name = ‘payen’;  
> let obj = \{  
> name,  
> age: 19  
> \}  
> console.log(obj);  
> //\{“name”:“payen”,“age”:19\}

从这个例子可以看出省略属性值的属性  
它的值就是变量对应的值

比如说我的函数想要返回一个对象  
对象的属性与参数同名  
那么现在我们就可以这样写

> let a = 1,  
> b = 2;  
> function foo(a, b)\{  
> return \{a, b\};  
> \}  
> console.log(foo(a, b));  
> //\{a: 1, b: 2\}

这个函数就等价于

> function foo(a, b)\{  
> return \{a: a, b: b\};  
> \}

**简写对象方法**  
现在除了属性可以简写，方法也可以简写了  
看这里

> let person = \{  
> say()\{  
> console.log(“hello world~”);  
> \}  
> \}  
> person.say(); //hello world~

没错这也可以输出  
它就是下面这种形式的简写

> let person = \{  
> say: function()\{  
> console.log(“hello world~”);  
> \}  
> \}

把“：”和“function”去掉就可以了

**添加对象属性**

> let person = \{\};

在ES6之前我们要想向对象中添加属性  
我们只能这么写，利用标识符

> person.name = ‘payen’;

但是强大的ES6允许我们使用表达式作为属性

> person\[‘a’+‘g’+‘e’\] = 19;

我们还可以这样用

> let attr1 = ‘name’,  
> attr2 = ‘age’,  
> attr3 = ‘sex’;  
> let person = \{  
> \[attr1\]: ‘payen’,  
> \[attr2\]: 19,  
> \[attr3\]: ‘male’  
> \}  
> console.log(person);  
> //\{name: “payen”, age: 19, sex: “male”\}

使用“\[ \]”可以让变量所代表的值作为对象的属性

## 方法扩展 ##

**同值相等Object.is()**  
这个静态方法用于比较两个值是否严格相等  
大家可能要问了，严格相等使用“===” 不就得了  
其实不是这样的，大家可以看下面的例子

console.log(NaN === NaN); //false
    console.log(+0 === -0); //true

ES6提出了“Same-value equality”（同值相等）算法  
用来解决这个问题  
Object.is()就是部署这个算法的新方法

> console.log(Object.is(NaN, NaN)); //true  
> console.log(Object.is(+0, -0)); //false

**对象合并Object.assign()**  
这个方法用于合并对象，注意还是浅拷贝

> let obj = \{  
> name1: ‘foo’  
> \};  
> let obj1 = \{  
> name2: ‘bar’  
> \};  
> let obj2 = \{  
> name3: ‘baz’  
> \};  
> Object.assign(obj,obj1,obj2);  
> console.log(obj);  
> //\{name1: “foo”, name2: “bar”, name3: “baz”\}

obj1和obj2中的键和值均被拷贝到了obj对象中  
当然了，被拷贝的对象内部是不变的  
参数没有限制  
第一个参数就是被拷入的对象

还有一点要注意，如果出现了同名属性  
这个方法的处理是覆盖

> let target = \{  
> name: ‘a’  
> \};  
> let source = \{  
> name: ‘b’  
> \};  
> Object.assign(target, source);  
> console.log(target);  
> //\{name: “b”\}