[Javascript] Deep merge in Javascript with Ramda.js mergeDeepWith
Javascript's Object.assign is shadow merge, loadsh's _.merge is deep merge, but has probem for array.
const person = {
name: { first: "Joe" },
age: ,
color: "green",
pets: ["dog", "lizard"]
}; const update = {
name: { last: "Smith" },
color: "blue",
book: "Harry Potter",
pets: ["cat"]
};
const merged1 = {
...person,
...update,
name: { ...person.name, ...update.name },
pets: [...person.pets, ...update.pets]
}; /*Object {name: Object, age: 23, color: "blue", pets: Array[3], book: "Harry Potter"}
name: Object
age: 23
color: "blue"
pets: Array[3]
0: "dog"
1: "lizard"
2: "cat"
book: "Harry Potter" */ const merged2 = _.merge({}, person, update);
/*
name: Object
first: "Joe"
last: "Smith"
age: 23
color: "blue"
pets: Array[2]
0: "cat"
1: "lizard"
book: "Harry Potter"
*/
We can use Ramda.js to easy solve the problem:
console.log(R.mergeDeepWith(R.concat, person, update));
/*
Object {name: Object, age: 23, color: "blue", pets: Array[2], book: "Harry Potter"}
name: Object
first: "Joe"
last: "Smith"
age: 23
color: "blue"
pets: Array[2]
0: "cat"
1: "lizard"
book: "Harry Potter"
*/
To make it more point-free style and more reuseable, we can do:
const _merge = R.mergeDeepWith(R.concat);
console.log(_merge(person, update));
[Javascript] Deep merge in Javascript with Ramda.js mergeDeepWith的更多相关文章
- 翻译连载 | 附录 C:函数式编程函数库-《JavaScript轻量级函数式编程》 |《你不知道的JS》姊妹篇
原文地址:Functional-Light-JS 原文作者:Kyle Simpson-<You-Dont-Know-JS>作者 关于译者:这是一个流淌着沪江血液的纯粹工程:认真,是 HTM ...
- javascript马赛克遮罩图片切换效果:XMosaic.js(转)
新鲜出炉的javascript图片切换特效,实现的是马赛克遮罩切换.在flash里,好实现遮罩动画很简单,不过JS实现起来就有些困难了. XMosaic.js,与XScroll.js和XScroll2 ...
- JavaScript手札:《编写高质量JS代码的68个有效方法》(一)(1~5)
编写高质量JS代码的68个有效方法(一) *:first-child { margin-top: 0 !important; } body>*:last-child { margin-botto ...
- JavaScript、jQuery、HTML5、Node.js实例大全-读书笔记3
技术很多,例子很多,只好慢慢学,慢慢实践!!现在学的这本书是[JavaScript实战----JavaScript.jQuery.HTML5.Node.js实例大全] JavaScript.jQuer ...
- JavaScript、jQuery、HTML5、Node.js实例大全-读书笔记2
技术很多,例子很多,只好慢慢学,慢慢实践!!现在学的这本书是[JavaScript实战----JavaScript.jQuery.HTML5.Node.js实例大全] JavaScript.jQuer ...
- JavaScript、jQuery、HTML5、Node.js实例大全-读书笔记1
技术很多,例子很多,只好慢慢学,慢慢实践!!现在学的这本书是[JavaScript实战----JavaScript.jQuery.HTML5.Node.js实例大全] 第 3 章 用 JavaScri ...
- js对象详解(JavaScript对象深度剖析,深度理解js对象)
js对象详解(JavaScript对象深度剖析,深度理解js对象) 这算是酝酿很久的一篇文章了. JavaScript作为一个基于对象(没有类的概念)的语言,从入门到精通到放弃一直会被对象这个问题围绕 ...
- 翻译连载 | 第 9 章:递归(下)-《JavaScript轻量级函数式编程》 |《你不知道的JS》姊妹篇
原文地址:Functional-Light-JS 原文作者:Kyle Simpson-<You-Dont-Know-JS>作者 关于译者:这是一个流淌着沪江血液的纯粹工程:认真,是 HTM ...
- JavaScript面向对象(三)——继承与闭包、JS实现继承的三种方式
前 言 JRedu 在之前的两篇博客中,我们详细探讨了JavaScript OOP中的各种知识点(JS OOP基础与JS 中This指向详解 . 成员属性.静态属性.原型属性与JS原型链).今天 ...
随机推荐
- cookie和session的区别与会话跟踪技术
会话跟踪技术: HTTP是一种无状态协议,每当用户发出请求时,服务器就会做出响应,客户端与服务器之间的联系是离散的.非连续的.当用户在同一网站的多个页面之间转换时,根本无法确定是否是同一个客户,会话跟 ...
- pm2笔记
概述 pm2是一个进程管理工具.使用pm2部署NodeJS服务可以轻松实现负载均衡. 指定用户启动 pm2启动时会指定一个PM2_HOME目录,作为存放日志文件.rpc.sock文件,默认情况下会PM ...
- selenium+python自动化77-autoit文件上传【转载】
前言 关于非input文件上传,点上传按钮后,这个弹出的windows的控件了,已经跳出三界之外了,不属于selenium的管辖范围(selenium不是万能的,只能操作web上元素).autoit工 ...
- Deep Learning关于Vision的Reading List
最近开始学习深度学习了,加油! 下文转载自:http://blog.sina.com.cn/s/blog_bda0d2f10101fpp4.html 主要是顺着Bengio的PAMI review的文 ...
- qt include_directories没用
include_directories之后在.cpp文件中include.h文件没有路径补全说明qt没有找到该.h文件 问题解决: 在add_executable里加入那个.cpp文件就可以了 因为c ...
- (十)MySQL日志
1)日志种类 error log:错误日志 拍错 /var/log/mysqld.log \这是yum安装mysqld生成error默认目录 bin blog 二进制日志 备份 增量备份,记录DDL, ...
- Android学习--还有一些小技巧
这些小技巧 通过上面的这些文章,就把简单的安卓项目总结了一遍,当然你说懂这些就可以做Android开发的话还是不行的,欠缺的还有很多,但欠缺的这些我们有只能在工作中去总结以及不断的提高,这篇文章我们还 ...
- POJ 1486 Sorting Slides(二分图匹配)
[题目链接] http://poj.org/problem?id=1486 [题目大意] 给出每张幻灯片的上下左右坐标,每张幻灯片的页码一定标在这张幻灯片上, 现在问你有没有办法唯一鉴别出一些幻灯片 ...
- 【计算几何】【凸包】bzoj1670 [Usaco2006 Oct]Building the Moat护城河的挖掘
#include<cstdio> #include<cmath> #include<algorithm> using namespace std; #define ...
- Problem J: 求方程的解——C语言初学者百题大战之十五
#include<stdio.h> #include<math.h> int main() { float a,b,c,x1,x2,delta; scanf("%f ...