zoukankan      html  css  js  c++  java
  • 深入理解ES6之—对象

    Object新方法

    Object.is()方法

    在js中比较两个值时,你可能会用相等运算符==或者严格相等运算符 ===。为了避免在比较时发生强制类型转换,许多开发者更倾向于使用后者。

    Object.is()接受两个参数,并且会在二者的值相等时返回true,此时要求二者的数据类型相同并且值也相等。

    console.log(Object.is(+0, -0)); //false
    console.log(+0 == -0); //true
    console.log(+0 === -0); //true
    
    console.log(NaN == NaN);//false
    console.log(NaN === NaN);//false
    console.log(Object.is(NaN, NaN));//true
    

    在许多情况下,Object.js()的结果与===运算符是相同的,仅有的例外是:它会认为+0与-0不相等,而且NaN等于NaN。

    Object.assign()方法

    Object.assign()可以设置一个对象从另一个对象接受属性和方法。Object.assign()接受任意数量的供应者,而接受者会按照供应者在参数的顺序来依次接收他们的属性。这意味着在接收者中,第二个供应者的属性可能会覆盖第一个供应者的

    var recevier = {};
    Object.assign(recevier, {
        type: "js",
        name: "file.js"
    }, {
        type: "css"
    })
    
    console.log(recevier);//{type:"css",name:"file.js"}
    

    重复的对象字面量属性

    在es5的严格模式下,如果对象存在重复的属性名,就会抛出错误。在es6中无论严格模式还是非严格模式都不会抛出错误。当存在重复属性时,排在后面的属性的值会成为该属性的实际值。

    更强大的原型

    修改对象的原型

    一般来说,对象的原型会在通过构造器或Object.create()方法创建该对象时被指定。es5可以通过Object.getPrototypeOf()方法从任意对象中获取其原型。

    es6添加了Object.setPrototypeOf()方法来修改任意制定对象的原型。它接受两个参数:需要被修改原型的对象,以及将会成为前者原型的对象。

    var person = {
        getGreeting() {
            return "hello";
        }
    };
    var dog = {
        getGreeting() {
            return "woof";
        }
    };
    let friend = Object.create(person);
    Object.setPrototypeOf(friend, dog);
    console.log(friend.getGreeting());//woof
    

    使用super引用的简单原型访问

    super是指向当前对象的原型的一个指针。

    let friend = {
        getGreeting() {
            return super.getGreeting() + ",hi";
        }
    }
    Object.setPrototypeOf(friend, person);
    console.log(friend.getGreeting());//hello,hi
    

    可以使用super引用来调用对象原型上的任何方法,只要这个引用是位于简写的方法之内。试图在简写方法之外的情况使用super会导致语法错误。

    使用多级继承时,super引用就是非常强大的,因为这种情况下Object.getPrototypeOf()不在适用于所有场景。

    自有属性的枚举顺序

    自由属性枚举时基本顺序如下:

    1. 所有的数字类型键,按升序排列
    2. 所有的字符串类型键,按被添加到对象的顺序排列
    3. 所有的符号类型键,按添加顺序排列
    var obj = {
        a: 1,
        0: 1,
        c: 1,
        2: 1,
        b: 1,
        1: 1
    }
    obj.d = 1;
    console.log(Object.getOwnPropertyNames(obj).join(""));//012acbd
    

    对象字面量语法的扩展

    属性初始化器的速记法

    在es6中,当对象的一个属性名称与本地变量名相同时,可以简单书写名称而省略冒号和值

    function createPerson(name.age){
        return {
            name,
            age
        };
    }
    

    方法简写

    在es5及更早版本中,你必须制定一个名称并用完整的函数定义来为对象添加方法。通过省略冒号和function关键字,es6将这个语法变得更简洁。

    var person = {
        name:"cc",
        sayName(){
            console.log(this.name);
        }
    }
    

    需计算属性名

    在es6中,需计算属性名是对象字面量语法的一部分,它用的也是方括号表示法,与此前在对象实例上的用法一致。

    var lastName = "last name";
    var person = {
        "first name": "nicolas",
        [lastName]: "zakas"
    }
    console.log(person[lastName]);
    

    对象字面量内的方括号表明该属性需要计算,其结果是一个字符串。意味着可以包含表达式:

    var suffix = "name";
    var person = {
        ["first "+suffix]:"nicolas",
        ["last "+suffix]:"zakas"
    }
    
  • 相关阅读:
    字符串数组 去重 研究
    监听 dom 改变
    清除body 不改变路径 页面信息加载第三方
    使用img标签实现xss的常见方法
    禁止ios浏览器页面上下滚动 (橡皮筋效果)
    遍历 Request.Form.Keys
    selenium-java之使用浏览器打开网页举例
    docker搭建redis
    docker镜像无法删除 Error:No such image:xxxxxx
    连接查询SQL说明举例
  • 原文地址:https://www.cnblogs.com/xzsty/p/8486725.html
Copyright © 2011-2022 走看看