对象新增特性

1. 属性的简洁表示法

1.1 属性的简化写法

var foo = 'name1';
var bar = 'name2';
function fn(){}

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

1.2 方法的简化写法

{
    fn:function(){
    }
}

// 可简写为
{
    fn(){
    }
}

2 属性名表达式

var obj = {
  name: '曹操',
  [username]: '关云长',
  [10*45]: '刘备',
  ['age']:100
};
console.log(obj);  // {450: "刘备", name: "曹操", 张飞: "关云长", age: 100}

3 super 关键字

this 关键字总是指向调用方法的对象; super关键字指向所在对象的原型。

super 的指向只与方法定义时候所在的对象有关,与调用该方法的对象无关。

// 定义对象
var obj = {
  name: 'obj',
  say() {
    console.log('My Name is '+this.name);
    console.log('My Name is '+super.name);
  },
};
//在obj的原型上添加属性
Object.prototype.name = 'obj proto';
obj.say();
// this: My Name is obj
// super: My Name is obj proto

// ----------------------------
// 定义对象并指定原型对象
var obj1 = Object.create({name: 'obj1 proto'});
obj1.name = 'obj1';
obj1.say = obj.say;
obj1.say();
// this: My Name is obj1
// super: My Name is obj proto

super 关键字表示原型对象时,只能用在简化写法定义的方法中,其他形式定义的方法都会报错。

// 报错
const obj = {
  foo: super.foo
}

// 报错
const obj = {
  foo: () => super.foo
}

// 报错
const obj = {
  foo: function () {
    return super.foo
  }
}

4 Object 构造函数本身新增的方法

方法名 描述
Object.is() 判断两个值是否相等。
Object.assign() 将一个或者多个源对象复制到目标对象,并返回修改后的目标对象。
Object.setPrototypeOf() 修改指定对象的原型。
Object.getPrototypeOf() 返回指定对象的原型。
Object.keys() 返回由对象的属性名组成的数组。
Object.values() 返回由对象的属性值组成的数组。
Object.entries() 返回由对象的属性名和属性值组成的数组,是二维数组。

4.1. Object.is() 全等

它用来比较两个值是否严格相等,与严格比较运算符(===)的行为基本一致,不同之处只有两个:一是 +0 不等于 -0 ,二是 NaN 等于自身。

Object.is('foo', 'foo');    // true
Object.is({}, {});            // false
Object.is(+0, -0);            // false
Object.is(NaN, NaN);        // true

4.2 Object.assign() 合并对象

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

const target = { a: 1 };
const source1 = { b: 2 };
const source2 = { c: 3 };
Object.assign(target, source1, source2);
console.log(target);    // {a:1, b:2, c:3}

注意:如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。

const target = { a: 1, b: 1 };
const source1 = { b: 2, c: 2 };
const source2 = { c: 3 };

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

该方法的常见用途如下:

1)克隆对象

// 用这种方法克隆,只能克隆原始对象自身的值,不能克隆它继承的值
function clone(origin) {
  return Object.assign({}, origin);
}

// 想要保持继承链,可以采用下面的写法
function clone(origin) {
  let originProto = Object.getPrototypeOf(origin);
  return Object.assign(Object.create(originProto), origin);
}

2)合并多个对象

3)为属性指定默认值

const DEFAULTS = {
  logLevel: 0,
  outputFormat: 'html'
};

function processContent(options) {
  options = Object.assign({}, DEFAULTS, options);
  console.log(options);
  // ...
}

results matching ""

    No results matching ""