Object.assign() 函数与...state函数
程序员文章站
2024-03-12 12:08:38
...
1、Object.assign()函数
Object.assign(target, source)
target为目标对象
source为源对象
该函数的作用是以目标对象为基础,将源对象中的内容更新到目标对象中,有则替换,无则新增
var result01 = {type: '01', name: 'ming', age: 23};
let result02 = {type: '02', marry: false};
let result03 = {type: '03', age: 55}
const result = Object.assign({}, result01, result02, result03);
DLog(result,result.name,result.type,result01);
结果
image.png
var result01 = {type: '01', name: 'ming', age: 23};
let result02 = {type: '02', marry: false};
let result03 = {type: '03', age: 55}
const result = Object.assign(result01, result02, result03);
DLog(result,result.name,result.type,result01);
结果
image.png
由此可以看出,如果不需要改变目标函数,第一个参数就置为空对象
2、...state函数
测试01:
let result01 = {type: '01', name: 'ming', age: 23};
console.log(result01);
console.log({...result01});
console.log({result01});
console.log([{...result01}]);
打印结果
image.png
说明 ...state 是把对象的元素拿出来作为一个新的集合
测试02:
let result01 = {type: '01', name: 'ming', age: 23};
let result02 = {type: '02', marry: false};
let result03 = {type: '03', age: 55,address:'beijing'}
const result = Object.assign({},result01, result02, result03);
console.log({...result02,...result03});
打印结果
image.png
测试03:
var arr0 = [0,1,2];
var arr1 = [3,4];
var arr3 = [arr0];
var arr4 = [...arr0];
console.log(arr3);
console.log(arr4);
打印结果
image.png
var arr0 = [0,1,2];
var arr1 = [3,4];
var arr3 = [arr0];
var arr4 = [...arr0,{...arr1}];
console.log(arr4);
打印结果
image.png
var arr0 = [0,1,2];
var arr1 = [3,4,0];
var arr3 = [arr0];
var arr4 = [...arr0,...arr1];
console.log(arr4);
打印结果
image.png
说明这是一个数据深拷贝的过程
把源对象的元素加入到目标函数中
对象合并
这样看...state与Object.assign()之间既有相似之处,也有各种特点
对比代码与结果,不难理解
作者:云深不知处a
链接:https://www.jianshu.com/p/3e412e254d85
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。