2022-12-27 使用lodash库实现两个非空对象的深拷贝并输出这两个对象的并集

原创已于 2022-12-27 18:34:17 修改 · 493 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #深拷贝 #lodash #merge #并集

于 2022-12-27 18:30:23 首次发布

本文介绍如何利用lodash库的merge函数实现两个非空对象的深拷贝，并生成这两个对象的并集。在解决该问题的过程中，讨论了深拷贝的挑战以及lodash库在处理此类问题上的优势。此外，还计划进一步探索lodash库的其他功能，如防抖和去重，以及尝试用原生JavaScript实现相同功能。

问题描述

遇到这样一个题,如下

    const a = {
        fruits: ['apple', 'banana'],
        series: {
            apple: ['C'],
            banana: ['A', 'B'],
        }
    };
    const b = {
        fruits: ['banana', 'orange'],
        animals: ['pig'],
        series: {
            banana: ['B', 'C'],
            orange: ['A'],
        }
    };

要求输出:

    { 
	    fruits: ['apple', 'banana', 'orange'], 
	    animals: ['pig'],
	    series: { 
	    apple: ['C'], 
	    banana: ['A', 'B', 'C'],
	    orange: ['A'], 
    }

使用各种深拷贝的方法都不行,只会覆盖,并不会有取并集这么一个效果

解决方案

使用lodash库中的merge函数
引入lodash库(在线地址)

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.10/lodash.min.js"></script>

使用merge函数

    console.log(_.merge(a, b));

输出结果:
在这里插入图片描述

后续

了解一下这个lodash库的其他方法(防抖,去重等等)
复习深拷贝的各种实现
尝试使用原生js写一个函数,实现上述需求
(目前的一个思路是对子数组去重,对子对象递归)