ECMAScript6基础学习教程（五）对象

娜姐

发布于 2020-09-22 10:47:47

3100

发布于 2020-09-22 10:47:47

文章被收录于专栏：娜姐聊前端娜姐聊前端

ES6在处理对象上，又添加了新方法。

1. 属性简洁写法

当属性名和属性值变量同名时，ES6允许在对象中只写属性名，不写属性。

关键点有两个：

属性值为变量
属性值变量名==属性名

例如：

var foo = "abc";
var obj = {
  name: 'nicole',
  foo
}; //相当于是 var obj = {foo: foo}

如果属性值是函数，可以省略关键字function，如下：

var obj = {
  say(name) {
    return "hello, " + name;
  }
}
//等价于
var obj = {
  say: function (name) {
    return "hello, " + name;
  }
}

2. 属性名表达式

ES5中，使用字面量方式定义对象时，属性名不能是变量。ES6中可以支持变量/表达式格式的属性名，格式为**[propertyName]**。

var key = "property name";
var a = "hello";
var b = "world";
var obj = {
  [key]: 1,
  name: "nicole",
  [a+" "+b]: "good"
};
obj["property name"]; //1
obj["hello world"]; //"good"

注意：“属性简洁写法”和“属性名表达式”不能同时使用。

3. Object.is()

Object.is(val1, val2)用于判断两个值是否严格相等，用===判断。

注意：我们知道NaN===NaN会返回false，但是Object.is(NaN, NaN)，返回true。

4. Object.assign()

Object.assign(target, object1 [,objectN])用于对象拷贝，将对象object1...复制到对象target中。

Object.assign()**是浅拷贝**，类似jQuery.extend( false, target, object1 [, objectN ] )。

var obj1 = {a: {b:1}, x: 1};
var obj2 = {x: 3, y: 4};
var target = {};
Object.assign(target, obj1, obj2);
// 改变复制源对象的值
obj1.a.b = 11;
// 复制对象同步改变，说明复制的仅仅是源对象引用地址
console.log(target); // { a: { b: 11 }, x: 3, y: 4 }

小结

最常用的是“属性简洁写法”和“属性名表达式”。

做对象拷贝时，除了Object.assign()，更简便的方法是使用“扩展运算符”（参考上一节文章ECMAScript6基础学习教程（四）函数 - 扩展运算符）。

例子如下：

var obj1 = {a: {b:1}, x: 1};
var obj2 = {x: 3, y: 4};
var target = {...obj1, ...obj2};
// 改变复制源对象的值
obj1.a.b = 11;
// 复制对象同步改变
console.log(target); // { a: { b: 11 }, x: 3, y: 4 }

本文参与腾讯云自媒体分享计划，分享自作者个人站点/博客。

如有侵权请联系 cloudcommunity@tencent.com 删除

actionscript