威尼斯wns.9778官网活动_vnsc威尼斯城官网

热门关键词: 威尼斯wns.9778官网活动,vnsc威尼斯城官网
当前位置:威尼斯wns.9778官网活动 > 计算机教程 > es6 对象的扩展

es6 对象的扩展

文章作者:计算机教程 上传时间:2019-05-10

1.属性的简洁表示法

    function f(x,y) {

      return {x,y};

    }

    // 等同于

    function f(x,y){

      return {x:x,y:y};

    }

    f(1,2)   // Object {x:1,y:2}

    例如:

      let birth = '2000/01/01';

      const Person = {

        name: '张三',

          // 等同于 birth: birth

        birth,

          // 等同于hello: function()...

        hello() {console.log('我的名字',this.name);}

      };

    例如:用于函数的返回值

    function getPoint() {

        const x = 1;

        const y = 10;

        return {x,y};

    }

    console.log(getPoint());

      // {x:1,y:10}

 

  2.属性名表达式

    表达式作为对象的属性名

      let obj = {

        [propKey]: true,

        ['a' 'bc']:123

      };

      console.log(obj[propKey]); // true

      console.log(obj['abc']); // 123

    例如:

      let lastWord = 'last word';

      const a = {

        ‘first word’: 'hello',

        [lastWord]: 'world'

      }

      console.log(a['first word']); // "hello"

      console.log(a[lastWord]); // "world"

      console.log(a['last word']); // "world"

    例如: 表达式可以用于定义方法名

      let obj = {

        ['h' 'ello']() {

          return 'hi';

        }

      };

      console.log(obj.hello()); // 'hi'

  3.方法的 name 属性

    例如:函数的name 属性,返回函数名。

      const person = {

        sayName() {

        console.log('hello');

        }

      }

      console.log(person.sayName.name); // "sayName"

4.Object.is()

    ES 比较两个值是否相等,只有两个运算符,相等运算符,相等运算符(==)

    和严格相等运算符(===)

 

       0 === -0 // true

      NaN === NaN // false

      Object.is( 0,-0); // false

      Object.is(NaN,NaN) // true

5.Object.assign()

    Object.assign 方法用于对象的合并,将源对象的所有的可枚举属性,赋值到目标对象

    例如;

      const target = {a:1};

      const source1 = {b:2};

      const source2 = {c:2};

      Object.assign(target,source1,source2);

      console.log(target); // {a:1,b:2,c:3}

    例如:同名属性的替换,当遇到同名属性的时候,处理方法是替换。

      const target = {a:{b:'c',d:'e'}}

      const source = {a: {b:'hello'}}

      console.log(Object.assign(target,source))

        // {a: {b:'hello'}}

    例如: 数组的处理

      Object.assign 可以用来出来数组,把数组作为对象看

      Object.assign([1,2,3],[4,5])

        // [4,5,3]

 

    常见用途(1) 为对象添加属性

        class Point {

          constructor(x,y){

            Object.assign(this,{x,y});

          }

        }

    常见用途(2) 为对象添加方法

      Object.assign(SomeClass.prototype,{

        someMethod(arg1,arg2){

          .....

        }

      anotherMethod(){

        ...

        }

      })

    常见用途(3) 克隆对象

      function clone (origin) {

        return Object.assign({},origin);

      }

6.属性的可枚举行和遍历

    可枚举性

      Object.getOwnProperDescriptor 方法可以获取该属性的描述对象

        let obj = {foo:123};

      Object.getOwnPropertyDescriptor(obj,'foo')

        // {

          value: 123,

          writable: true,

          enumerable: true,

          configurable:true

        }

    描述对象的enumerable 属性,称为“可枚举属性” 如果该属性的值为false,

      就表示会忽略当前属性。

    目前有四个操作会忽略 enumerable 为false 属性。

      for...in , Object.keys(), JSON.stringify(), Object.assign();

      ES6一共有5种方法可以遍历对象的属性

        (1) for ... in

            循环遍历对象自身的和继承的可枚举属性

        (2) Object.keys(obj)

            Object.keys 返回一个数组,包括对象自身的所有可枚举属性

        (3) Object.getOwnPropertyNames(obj)

            Object.getOwnPropertyNames 返回一个数组,包含对象自身的所有属性

        (4) Object.getOwnPropetrySymbols(obj)

            Object.getOwnPropetrySymbols 返回一个数组,包含对象自身的所有

            Symbol属性的键名。

        (5) Reflect.ownKeys(Obj)

          Reflect.ownKeys 返回一个数组,包含对象自身的所有键名。

8._proto_ 属性。

    _proto_ 属性,用来读取和设置当前对象的protoype对象。

      const obj = {

        method: function(){

          console.log(111)

        }

      }

    obj._proto_= someOtherrObj;

    Object.setPrototypeOf()

    Object.setPrototypeOf 方法的作用与 _proto_ 相同,用来设置一个对象的prototype对象

      返回参数对象本身,。

        // 格式

      Object.setPrototypeOf(object,prototype)

        // 用法

      const o = Object.setPrototypeOf({},null);

        Object.getPrototypeOf()

        该方法与Object.setPrototypeOf 方法配套,用于读取一个对象的原型对象。

            Object.getPrototypeOf(obj);

9.super 关键字

    this 关键字总是指向函数所在的当前对象,super 指向当前对象的原型对象。

      const proto = {

        foo: 'hello'

      };

      const obj = {

        find(){

        return super.foo;

        }

      }

      Object.setPrototypeOf(obj,proto);

      obj.find();

10.Object.keys() ,Object.values(),Object.entries()

    let {keys,values,entries} = Object;

    let object = {a:1,b:2,c:3};

    for (let key of keys(obj)){

      console.log(key); // 'a','b','c'

    }

    for(let key of keys(obj)){

      console.log(key);// 'a','b','c'

    }

    for(let value of values(obj)){

      console.log(key); // 1,2,3

      }

    for (let [key,value] of entries(obj)){

      console.log([key,value]); // ['a',1],['b',2],['c',3]

    }

11.对象的扩展运算

    对象的结构赋值用于从一个对象取值,相当于将所有可遍历的,但尚未对齐的属性,

    分配到指定的对象上面,所有的键和值他们的值,都会拷贝到新对象上面。

 

    let {x,y,...z} = {x:1,y:2,a:3,b:4};

      x // 1

      y // 2

      z // {a:3,b:4}

 

    扩展运算

      扩展运算符(...) 用于取出参数对象的多有可遍历属性,拷贝到当前对象之中。

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

威尼斯wns.9778官网活动,        let n = {...z};

        n // {a:3,b:4}

    合并两个对象

      let ab = {...a,...b};

        // 等同于

      let ab = Object.assign({},a,b)

本文由威尼斯wns.9778官网活动发布于计算机教程,转载请注明出处:es6 对象的扩展

关键词: