美文网首页
8、对象的拓展

8、对象的拓展

作者: Daeeman | 来源:发表于2020-08-20 20:53 被阅读0次

#8.1 属性的简洁表示

let a = 'a1';
let b = { a };  // b => { a : 'a1' }
// 等同于
let b = { a : a };

function f(a, b){
    return {a, b}; 
}
// 等同于
function f (a, b){
    return {a:a ,b:b};
}

let a = {
    fun () {
        return 'leo';
    }
}
// 等同于
let a = {
    fun : function(){
        return 'leo';
    }
}

#8.2 属性名表达式

JavaScript提供2种方法定义对象的属性

// 方法1 标识符作为属性名
a.f = true;

// 方法2 字符串作为属性名
a['f' + 'un'] = true;

延伸出来的还有:

let a = 'hi leo';
let b = {
    [a]: true,
    ['a'+'bc']: 123,
    ['my' + 'fun'] (){
        return 'hi';
    }
};
// b.a => undefined ; b.abc => 123 ; b.myfun() => 'hi'
// b[a] => true ; b['abc'] => 123 ; b['myfun'] => ƒ ['my' + 'fun'] (){ return 'hi'; }

注意
属性名表达式不能与简洁表示法同时使用,否则报错。

// 报错
let a1 = 'aa';
let a2 = 'bb';
let b1 = {[a1]};

// 正确
let a1 = 'aa';
let b1 = { [a1] : 'bb'};

#8.3 Object.is()

Object.is() 用于比较两个值是否严格相等,在ES5时候只要使用相等运算符(==)和严格相等运算符(===)就可以做比较,但是它们都有缺点,前者会自动转换数据类型,后者的NaN不等于自身,以及+0等于-0

Object.is('a','a');   // true
Object.is({}, {});    // false

// ES5
+0 === -0 ;           // true
NaN === NaN;          // false

// ES6
Object.is(+0,-0);     // false
Object.is(NaN,NaN);   // true

#8.4 Object.assign()

Object.assign()方法用于对象的合并,将原对象的所有可枚举属性复制到目标对象。
基础用法
第一个参数是目标对象,后面参数都是源对象

let a = {a:1};
let b = {b:2};
Object.assign(a,b);  // a=> {a:1,b:2}

注意

  • 若目标对象与源对象有同名属性,则后面属性会覆盖前面属性。
let a = {a:1, b:2};
let b = {b:3, c:4};
Object.assign(a, b); // a => {a:1, b:3, c:4}

  • 若只有一个参数,则返回该参数。
let a = {a:1};
Object.assign(a) === a;  // true

  • 若参数不是对象,则先转成对象后返回。
typeof Object.assign(2); // 'object'

  • 由于undefinedNaN无法转成对象,所以做为参数会报错。
Object.assign(undefined) // 报错
Object.assign(NaN);      // 报错

  • Object.assign()实现的是浅拷贝。

Object.assign()拷贝得到的是这个对象的引用。这个对象的任何变化,都会反映到目标对象上面。

let a = {a: {b:1}};
let b = Object.assign({},a);
a.a.b = 2;
console.log(b.a.b);  // 2

  • 将数组当做对象处理,键名为数组下标,键值为数组下标对应的值。
Object.assign([1, 2, 3], [4, 5]); // [4, 5, 3]

相关文章

  • 8、对象的拓展

    #8.1 属性的简洁表示 #8.2 属性名表达式 JavaScript提供2种方法定义对象的属性。 延伸出来的还有...

  • 对象的拓展

    对象属性的简写 当对象的属性名和变量名一样时,可以简写。如 对象方法的简写 Object.assign() Obj...

  • 对象的拓展

    1、属性的简介表示法ES6允许直接写入变量和函数,作为对象的属性和方法。这样的书写更加简介。 除了属性简写,方法也...

  • 对象的拓展

    Object.fromEntries 自身可枚举属性的键值对数组转化为对象 fromEntries和entries...

  • ES6 数组拓展、对象拓展、函数、类的语法

    一、数组的拓展 二、对象的拓展 三、函数的拓展 四、class基本语法

  • 高级技巧

    不可拓展对象: preventExtensions(想要禁止拓展的对象):这个是Object的静态方法,它可以用于...

  • ES5数组拓展

    ES5 数组拓展 ES5为Array对象做了大幅拓展 Array.isArray(obj) 这是Array对象的一...

  • 请求和响应

    请求对象(Request objects)拓展了Django自带的HttpRequestRequest对象的核心功...

  • jQuery中的 $.extend 和 $.fn.extend

    $.extend 是拓展 jQuery 类的方法 $.fn.extend 是拓展jQuery对象的方法 所谓jQu...

  • 扩展对象的功能性.md

    对象扩展 对象类别 在ES6中,对象分为下面几种叫法。 普通对象 特异对象 标准对象 内建对象 对象字面量语法拓展...

网友评论

      本文标题:8、对象的拓展

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