导航

HTML

CSS

JavaScript

浏览器 & 网络

版本管理

框架

构建工具

TypeScript

性能优化

软实力

算法

UI、组件库

Node

冷门技能

合并对象

var obj = {a: 1}
var tar = {}
console.log(Object.assign(tar, obj))
console.log(tar === obj)

Untitled

var obj = {
  firstName: 'Yang'
}

var obj2 = {
  lastName: 'Lance'
}

var copy = Object.assign(obj, obj2);

console.log(copy === obj)

Untitled

const tar = {a: 1};
const tar1 = {b: 2, c: 2};
const tar2 = {c: 3};
Object.assign(tar, tar1, tar2);
console.log(tar);

Untitled

⭐️ 使用包装类

var test = Object.assign(undefined, {a: 1})
var test = Object.assign(null, {a: 1})

Untitled

var test1 = Object.assign(1, {a: 1})
var test2 = Object.assign(true, {a: 1})
var test3 = Object.assign('aa', {a: 1})
console.log(test1)
console.log(test2)
console.log(test3)

Untitled

⭐️ 第二个参数，在转换为对象的时候，参数的可枚举性需要为真

var test1 = Object.assign({a: 1}, undefined);
var test2 = Object.assign({a: 1}, 1);
var test3 = Object.assign({a: 1}, '123');
var test4 = Object.assign({a: 1}, true);
console.log(test1);
console.log(test2);
console.log(test3);
console.log(test4);

Untitled

var test1 = 'abc';
var test2 = true;
var test3 = 10;
console.log(new Object(test1)) // 转为类数组，可以枚举
console.log(new Object(test2))
console.log(new Object(test3))

Untitled

⭐️ assign 继承属性和不可枚举属性不能够拷贝

var obj = Object.create({foo: 1}, {
	bar: {
  	value: 2
  },
  baz: {
  	value: 3,
    enumerable: true
  }
})
console.log(obj)
console.log(Object.assign({}, obj))

Untitled

var test = Object.assign({a: 'b'}, {[Symbol('c')]: 'd'});
console.log(test);

属性为 Symbol 的情况

Untitled

⭐️ assign 是浅拷贝

var obj1 = {
	a: {
  	b: 1
  }
}

var obj2 = Object.assign({}, obj1);
obj1.a.b = 2;
console.log(obj1, obj2);

Untitled

assign 同名属性替换

var tar = {a: {b: 1, c: 2}}
var source = {a: {b: 'hhhh'}}
console.log(Object.assign(tar, source))

Untitled

⭐️ assign 操作数组， 属性名替换，数组就等于替换下标相同的

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

Untitled

⭐️ assign 能获取 getter 方法中返回的值

var source = {
	get foo() {
		return 1;
	}
}
console.log(Object.getOwnPropertyDescriptor(source, 'foo'));
var tar = {}
Object.assign(tar, source);
console.log(tar);

Untitled

用作拓展原型

function Person(){}
var age = 1;
Object.assign(Person.prototype, {
	eat(){},
  age
})
console.log(Person.prototype);

Untitled

defineProperties() / getOwnPropertyDescriptors()

var obj = {}
Object.defineProperties(obj, {
	a: {
  	value: true,
    writable: true
  },
  b: {
  	value: 3
  }
});
console.log(obj);
console.log(Object.getOwnPropertyDescriptors(obj));

Untitled

assign 拷贝是无法拿到 set 方法的

var source = {
	set foo(val) {
  	console.log(val)
  }
}
var tar = {};
Object.assign(tar, source);
console.log(Object.getOwnPropertyDescriptors(tar));

Untitled

var source = {
	set foo(val){
  	console.log(val)
  }
}
var tar = {};
Object.defineProperties(tar, Object.getOwnPropertyDescriptors(source));

console.log(Object.getOwnPropertyDescriptors(tar));

Untitled

浅拷贝

var obj = {a: 1, b: 3, c: {d: 5}}
var clone = Object.create(
  Object.getPrototypeOf(obj), 
  Object.getOwnPropertyDescriptors(obj)
)
console.log(clone)

Untitled

var obj = {a: 1, b: 3, c: {d: 5}}
var clone = Object.create(
  Object.getPrototypeOf(obj), 
  Object.getOwnPropertyDescriptors(obj)
)
obj.c.d = 777
console.log(clone)

Untitled