美文网首页工作生活
对象的扩展(笔记)

对象的扩展(笔记)

作者: 灰灰_82a6 | 来源:发表于2019-07-10 13:14 被阅读0次

    属性的简写

    1.属性值可以是一个变量或者函数,并且当属性值与属性名一样的时候,只写属性名即可。

    var foo="bar";
    var obj={foo}; 
    //等同于
    var var obj={foo:foo};  //{foo:"bar"}
    

    2.方法的简写

    var obj={
      method(){}
    }
    //等同于
    var obj={
      method:function(){}
    }
    

    属性的表达式

    字母式声明对象的时候 ,属性名可以放在[]里,即可以使用变量或者表达式

    let lastWord = 'last word';
    
    const a = {
      'first word': 'hello',
      [lastWord]: 'world'
    };
    
    a['first word'] // "hello"
    a[lastWord] // "world"
    a['last word'] // "world"
    

    也可以定义方法

    let obj = {
      ['h' + 'ello']() {
        return 'hi';
      }
    };
    
    obj.hello() // hi
    

    super

    1.super指向当前对象的原型对象。

    const proto = {
      foo: 'hello'
    };
    
    const obj = {
      foo: 'world',
      find() {
        return super.foo;
      }
    };
    
    Object.setPrototypeOf(obj, proto);
    obj.find() // "hello"
    

    2.super关键字表示原型对象时,只能用在对象的方法之中,用在其他地方都会报错。

    对象的扩展运算符

    1.对象的解构赋值是浅拷贝
    2.扩展运算符的解构赋值,不能复制继承自原型对象的属性

    let o1 = { a: 1 };
    let o2 = { b: 2 };
    o2.__proto__ = o1;
    let { ...o3 } = o2; //把o2的自身的属性赋值给了o3,原型上的没有赋给
    o3 // { b: 2 }
    o3.a // undefined
    

    3.使用...可以取出对象的所有可遍历属性。

    let z = { a: 3, b: 4 };
    let n = { ...z };
    n // { a: 3, b: 4 }
    

    上面的let n = { ...z }等同于如下:

    let n= Object.assign({}, z);
    

    4.如果扩展运算符后面是一个空对象,则没有任何效果。

    {...{}, a: 1}
    // { a: 1 }
    

    5.如果扩展运算符后面不是对象,则会自动将其转为对象

    // 等同于 {...Object(1)}
    //扩展运算符后面是整数1,会自动转为数值的包装对象Number{1}。由于该对象没有自身属性,所以返回一个空对象。
    {...1} // {}
    

    如果扩展运算符后面是字符串,它会自动转成一个类似数组的对象

    {...'hello'}
    // {0: "h", 1: "e", 2: "l", 3: "l", 4: "o"}
    

    相关文章

      网友评论

        本文标题:对象的扩展(笔记)

        本文链接:https://www.haomeiwen.com/subject/ciszcctx.html