JavaScript中Object值合并方法详解

更新时间：2017年12月22日 11:39:16 作者：fullStack-yang

这篇文章主要为大家详细介绍了JavaScript中Object值合并方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

前言：在日常开发工作中我们可能会遇到js中对象中所有值的复制工作，也有可能是通过electron开发客户端，改版时候面临到的设置合并问题。那么本文将对此做一个简要解决方案的叙述。

介绍：比如有obj1, obj2，我们需要将obj1中的所有与obj2中相同字段相同深度的值copy给obj2，并且需要保持obj2字段结构不变，调用一下方法即可（采用ES6写法）。

代码：

/**
     * 将src中的数据copy到dist中，并保留dist的结构
     * @param src
     * @param dist
     */
    copyValue(src, dist) {
      if (!src || typeof(src) !== 'object' || typeof(dist) !== 'object'){
        return ;
      }

      let keys = Object.keys(dist)
      if (keys && keys.length > 0 && isNaN(keys[0])){
        keys.forEach(key => {
          let value = dist[key]
          let srcVal = src[key]

          // 判断是不是对象，如果是则继续遍历，不是则开始赋值或忽略
          if (value !== undefined && typeof(value) === 'object' && srcVal && typeof(srcVal) === 'object' && srcVal[0] === undefined){
            copyValue(srcVal, value)
          } else if (value !== undefined && srcVal && typeof(value) == typeof (srcVal)){
            // 如果源数据存在，并且类型一致，则开始赋值
            dist[key] = src[key]
          }
        })
      }

    },

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

js
Object

JavaScript数组Array对象增加和删除元素方法总结
这篇文章主要介绍了JavaScript数组Array对象增加和删除元素方法,实例总结了pop方法、push方法、splice方法、concat方法等的使用技巧,需要的朋友可以参考下
2015-01-01
json传值以及ajax接收详解
下面小编就为大家带来一篇json传值以及ajax接收详解。小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-05-05
原生javascript AJAX 三级联动的实现代码
这篇文章主要介绍了原生javascript AJAX 三级联动的实现代码，非常不错代码简单易懂，具有一定的参考借鉴价值,需要的朋友可以参考下
2018-05-05
基于javascript实现随机颜色变化效果
这篇文章主要介绍了基于javascript实现随机颜色变化效果的相关资料,需要的朋友可以参考下
2016-01-01
JavaScript实现导入导出excel的示例代码
这篇文章主要为大家详细介绍了如何利用JavaScript语言实现导入导出excel文件的功能，文中的示例代码讲解详细，感兴趣的小伙伴可以了解一下
2022-07-07
深入理解js 中async 函数的含义和用法
async 函数就是隧道尽头的亮光，很多人认为它是异步操作的终极解决方案。接下来通过本文给大家分享js 中async 函数的含义和用法，感兴趣的朋友跟随脚本之家小编一起看看吧
2018-05-05
uni-app表单组件(form表单)用法举例
平时我们经常会使用到表单,下面这篇文章主要给大家介绍了关于uni-app表单组件(form表单)的相关资料,文中通过示例代码介绍的非常详细,需要的朋友可以参考下
2022-12-12
微信小程序实现基于三元运算验证手机号/姓名功能示例
这篇文章主要介绍了微信小程序实现基于三元运算验证手机号/姓名功能,涉及三元运算符的判定及字符串正则验证相关操作技巧,需要的朋友可以参考下
2019-01-01
JavaScript原型与原型链深入探究使用方法
js中的原型与原型链应该是老生常谈的话题了，在前端面试中基本都是必问的一个问题，但是很多人还是稀里糊涂的，只知道其表层含义。本文将带大家深入了解JavaScript中的原型与原型链，感兴趣的可以学习一下
2022-11-11
javascript实用小函数使用介绍
本文整理了一些实用小函数如阻止输入非数字，backspace除外；限制输入最大字符串长度等，需要的朋友可以了解下
2013-11-11