lodash-assign

lodash-assign：https://www.lodashjs.com/docs/latest#_assignobject-sources

mdn-assign：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。
语法：Object.assign(target, ...sources)
target：目标对象。
sources：源对象。

描述：
如果目标对象中的属性具有相同的键，则属性将被源对象中的属性覆盖。后面的源对象的属性将类似地覆盖前面的源对象的属性。

注：
1.浅拷贝。
2.改变原对象，返回改变后的对象。

例子：

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };const returnedTarget = Object.assign(target, source);console.log(target);
// expected output: Object { a: 1, b: 4, c: 5 }console.log(returnedTarget);
// expected output: Object { a: 1, b: 4, c: 5 }

复制一个对象：

const obj = { a: 1 };
const copy = Object.assign({}, obj);console.log(copy); // { a: 1 }

浅拷贝：

let obj1 = { a: 0 , b: { c: 0}};
let obj2 = Object.assign({}, obj1);
console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}} obj1.a = 1;
console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}} obj2.a = 2;
console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 0}}obj2.b.c = 3;
console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 3}}
console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 3}} // Deep Clone
obj1 = { a: 0 , b: { c: 0}};
let obj3 = JSON.parse(JSON.stringify(obj1));
obj1.a = 4;
obj1.b.c = 4;
console.log(JSON.stringify(obj3)); // { a: 0, b: { c: 0}}

合并对象

const o1 = { a: 1 };
const o2 = { b: 2 };
const o3 = { c: 3 };const obj = Object.assign(o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1);  // { a: 1, b: 2, c: 3 }, 注意目标对象自身也会改变。

合并具有相同属性的对象

const o1 = { a: 1, b: 1, c: 1 };
const o2 = { b: 2, c: 2 };
const o3 = { c: 3 };const obj = Object.assign({}, o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }

功能：复制对象，合并对象，对象key重新赋值。

lodash-assign相关推荐

Lodash学习笔记
Lodash Lodash是一套工具库,它内部封装了诸多对字符串.数组.对象等常见数据类型的处理函数,其中部分是目前ECMAScript尚未制订的规范,但同时被业界所认可的辅助函数. 常用 assig ...
webpack+react+redux+es6开发模式
一.预备知识 node, npm, react, redux, es6, webpack 二.学习资源 ECMAScript 6入门 React和Redux的连接react-redux Redux 入 ...
React入门教程第三课--gulp编译优化
上节课中我提到了,在gulpfile中编写task编译js和sass的task. 然后在项目中使用时发现,当项目内容越写越多时,编译速度会越来越久. 看了一下编译过程.上次gulpfile中的定义是当 ...
VUE使用docxtemplater导出word（带图片）
一.docxtemplater docxtemplater 是一种邮件合并工具,以编程方式使用并处理条件.循环,并且可以扩展以插入任何内容(表格.html.图像). npm 是安装 docxtempl ...
signature=b5d482f98802c3bc661cc82639edaa27,Taro
({ + url: api.getReplies({ + 'topic_id': id + }) + }), + Taro.request({ + url: api.getTopics({ + id ...
npm 安装node-sass失败
npm 安装node-sass失败 0 info it worked if it ends with ok 1 verbose cli [ 'C:\Program Files\nodejs\node. ...
vue 中哪些操作自动触发更新视图
vue 中哪些操作自动触发更新视图 vue数组对象修改触发视图更新直接修改数组元素是无法触发视图更新的,如 this.array[0] = {name: 'meng',age: 22 } 修改arr ...
使用docxtemplater模板语法，导出多个word文件，并生成zip压缩包
文章目录前言: 一.插件准备: 二.创建一个 download-zip.ts 文件,内容为: 三.页面使用: 四.word模板: 五.结果如下: 六.基本语法: 前言: 1.前端使用的是vue.el ...
vue+docxtemplater，填充word模板
安装依赖 yarn add docxtemplateryarn add pizzipyarn add jszip-utilsyarn add file-saver// 模板解析插件(支持list循环直 ...
jquery合并两个对象
1. object.assign Object.assign(target,source,souce...) 2. $.extend $.extend( target [, object1 ] [, ...