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"
          
posted @ 2017-11-29 10:01  happysun85  阅读(1286)  评论(0编辑  收藏  举报