JavaScript中Object值合并方法详解


Posted in Javascript onDecember 22, 2017

前言:在日常开发工作中我们可能会遇到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]
          }
        })
      }

    },

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
写出更好的JavaScript之undefined篇(上)
Nov 22 Javascript
防止页面被iframe(兼容IE,Firefox火狐)
Jul 04 Javascript
关于jquery动态增减控件的一些想法和小插件
Aug 01 Javascript
基于Jquery制作图片文字排版预览效果附源码下载
Nov 18 Javascript
动态加载js、css的简单实现代码
May 26 Javascript
JS从数组中随机取出几个数组元素的方法
Aug 02 Javascript
微信小程序 开发工具快捷键整理
Oct 31 Javascript
mui back 返回刷新页面的实例
Dec 06 Javascript
vue.js中引入vuex储存接口数据及调用的详细流程
Dec 14 Javascript
node.js通过axios实现网络请求的方法
Mar 05 Javascript
vue基于element-ui的三级CheckBox复选框功能的实现代码
Oct 15 Javascript
微信小程序indexOf的替换方法(推荐)
Jan 14 Javascript
Angular简单验证功能示例
Dec 22 #Javascript
Angular实现的table表格排序功能完整示例
Dec 22 #Javascript
详解Vue中localstorage和sessionstorage的使用
Dec 22 #Javascript
vue + element-ui实现简洁的导入导出功能
Dec 22 #Javascript
jackson解析json字符串,首字母大写会自动转为小写的方法
Dec 22 #Javascript
js读取本地文件的实例
Dec 22 #Javascript
javascript将json格式数组下载为excel表格的方法
Dec 22 #Javascript
You might like
PHP循环获取GET和POST值的代码
2008/04/09 PHP
PHP基于ORM方式操作MySQL数据库实例
2017/06/21 PHP
laravel项目利用twemproxy部署redis集群的完整步骤
2018/05/11 PHP
动态加载js的几种方法
2006/10/23 Javascript
超轻量级的基于jquery的三级展开列表
2011/04/26 Javascript
基于OO的动画附加插件,可以实现弹跳、渐隐等动画效果 分享
2013/06/24 Javascript
解决JQeury显示内容没有边距内容紧挨着浏览器边线
2013/12/20 Javascript
使用typeof判断function是否存在于上下文
2014/08/14 Javascript
jQuery中contents()方法用法实例
2015/01/08 Javascript
Bootstrap carousel轮转图的使用实例详解
2016/05/17 Javascript
jquery.serialize() 函数语法及简单实例
2016/07/08 Javascript
一个超简单的jQuery回调函数例子(分享)
2016/08/08 Javascript
JSON 对象未定义错误的解决方法
2016/09/29 Javascript
微信小程序 判断手机号的实现代码
2017/04/19 Javascript
Vue编写多地区选择组件
2017/08/21 Javascript
vue.js2.0点击获取自己的属性和jquery方法
2018/02/23 jQuery
vue+VeeValidate 校验范围实例详解(部分校验,全部校验)
2018/10/19 Javascript
详解JavaScript自定义函数
2020/07/29 Javascript
Python+django实现文件上传
2016/01/17 Python
Python中遍历字典过程中更改元素导致异常的解决方法
2016/05/12 Python
python 与GO中操作slice,list的方式实例代码
2017/03/20 Python
python整小时 整天时间戳获取算法示例
2019/02/20 Python
python使用paramiko实现ssh的功能详解
2020/03/06 Python
TensorFlow2.1.0安装过程中setuptools、wrapt等相关错误指南
2020/04/08 Python
广州御银科技股份有限公司试卷(C++)
2016/11/04 面试题
教师个人鉴定材料
2014/02/08 职场文书
私人会所最新创业计划书范文
2014/03/24 职场文书
毕业典礼演讲稿
2014/05/13 职场文书
平面设计师岗位职责
2014/09/18 职场文书
2015年园林绿化工作总结
2015/05/23 职场文书
消费者投诉书范文
2015/07/02 职场文书
市直属机关2016年主题党日活动总结
2016/04/05 职场文书
教你怎么用Python实现GIF动图的提取及合成
2021/06/15 Python
JavaScript利用html5新方法操作元素类名详解
2021/11/27 Javascript
深入理解MySQL中MVCC与BufferPool缓存机制
2022/05/25 MySQL
SpringBoot前端后端分离之Nginx服务器下载安装过程
2022/08/14 Servers