es6 对象添加属性和值_es6中新增对象的特性和方法

1. 对象简写

//曾经假如是这样的

var name = 'xxx'

var obj = {

name : name,

say : function(){

alert(this.name)

}

}

//对象简写后

var obj = {

name,

say(){

alert(this.name)

}

}

//简单的说就是写对象的时候把冒号以及左边的key省了，直接写变量名或者方法名，这个应用还是很广泛的。

2. 属性名表达式

//曾经定义的时候可以这样这样

var obj = {

name : '小白',

age : 20

}

//也可以这样

obj.name = '小白'

obj['a' + 'ge'] = 20

//现在可以让上面的两种方式合体了。。。

var name = 'name'

var obj = {

[name] : '小白', // 数组里用变量作为属性名

['a' + 'ge'] : 20

}

//看到没，在字面量的情况下使用变量和字符串拼接定义属性。。。合体了～

console.log( obj[name], obj.age ) //name是变量

//属性名表达式跟那个中括号离不开，甚至写方法的时候也可以这么搞

var obj = {

[name] : '小白', // 数组里用变量作为属性名

['a' + 'ge'] : 20,

['say'+'Name'](){ // 函数名也可以用属性名表达式

return this[name]

}

}

// 属性名表达式与简洁表示法 不能同时使用

var name = '小白'

var obj = {

[name] //这样是不对的，使用了属性名表达式后，必须后面跟冒号，像往常写法一样

}

3. Object.assign 合并对象

var target = {}

Object.assign(target, source1, source2, ...) // 所有source被合并到target中

// 如果参数只有一个对象，那么assign则只返回这个对象。

// assign是浅拷贝自身属性，并且同名会被后面的覆盖调，如果是非对象参数会被变成对象再做处理。

4. super

//做java的看这个肯定很眼熟。。。

//在js里。。this代表当前函数所属对象，super代表当前函数所属对象的原型对象也就是__proto__

const proto = {

x: 'hello',

foo() {

console.log(this.x);

},

};

const obj = {

x: 'world',

foo() {

super.foo();

}

}

Object.setPrototypeOf(obj, proto);

//obj调用foo方法后执行的super找到自身的proto下的foo方法执行了console.log(this.x)，

//一般来说这个this应该指向的离他最近的对象，但super后就变成了call调用并且修改自身this为

//obj, 所以输出world

obj.foo() // "world"