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 相关文章推荐
页面js遇到乱码问题的解决方法是和无法转码的情况
Apr 30 Javascript
Google 地图API资料整理及详细介绍
Aug 06 Javascript
从零学习node.js之详解异步控制工具async(八)
Feb 27 Javascript
JavaScript中错误正确处理方式小结你用对了吗
Oct 10 Javascript
jQuery中each方法的使用详解
Mar 18 jQuery
详解webpack模块加载器兼打包工具
Sep 11 Javascript
JavaScript数据结构与算法之检索算法示例【二分查找法、计算重复次数】
Feb 22 Javascript
angular4+百分比进度显示插件用法示例
May 05 Javascript
vue element-ui中table合计指定列求和实例
Nov 02 Javascript
WebPack工具运行原理及入门教程
Dec 02 Javascript
vue中axios封装使用的完整教程
Mar 03 Vue.js
小程序自定义轮播图圆点组件
Jun 25 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变量可用字符
2014/05/28 PHP
php截取视频指定帧为图片
2016/05/16 PHP
JavaScript 模仿vbs中的 DateAdd() 函数的代码
2007/08/13 Javascript
DHTML Slide Show script图片轮换
2008/03/03 Javascript
JavaScript 全角转半角部分
2009/10/28 Javascript
js 上传图片预览问题
2010/12/06 Javascript
解析javascript 实用函数的使用详解
2013/05/10 Javascript
原生JS实现加入收藏夹的代码
2013/10/24 Javascript
jQuery.lazyload+masonry改良图片瀑布流代码
2014/06/20 Javascript
Javascript闭包用法实例分析
2015/01/23 Javascript
Js查找字符串中出现次数最多的字符及个数实例解析
2016/09/05 Javascript
Chrome浏览器的alert弹窗禁止再次弹出后恢复的方法
2016/12/30 Javascript
JS实现弹出下载对话框及常见文件类型的下载
2017/07/13 Javascript
一篇文章让你彻底弄懂JS的事件冒泡和事件捕获
2017/08/14 Javascript
微信小程序实现获取自己所处位置的经纬度坐标功能示例
2017/11/30 Javascript
js解决软键盘遮挡输入框的问题分享
2017/12/19 Javascript
JS实现的抛物线运动效果示例
2018/01/30 Javascript
关于自定义Egg.js的请求级别日志详解
2018/12/12 Javascript
JavaScript实现栈结构Stack过程详解
2020/03/07 Javascript
python判断、获取一张图片主色调的2个实例
2014/04/10 Python
全面了解Python的getattr(),setattr(),delattr(),hasattr()
2016/06/14 Python
Python内置函数 next的具体使用方法
2017/11/24 Python
Python元字符的用法实例解析
2018/01/17 Python
Python 函数基础知识汇总
2018/03/09 Python
详解Python中is和==的区别
2019/03/21 Python
Python定义函数实现累计求和操作
2020/05/03 Python
Python try except else使用详解
2021/01/12 Python
CSS3按钮鼠标悬浮实现光圈效果源码
2016/09/11 HTML / CSS
HTML5 Canvas绘制文本及图片的基础教程
2016/03/14 HTML / CSS
京东国际站:JOYBUY
2017/11/23 全球购物
如何查找和删除数据库中的重复数据
2014/11/05 面试题
2015年药店店长工作总结
2015/04/29 职场文书
就业推荐表院系意见
2015/06/05 职场文书
评奖评优个人先进事迹材料
2015/11/04 职场文书
Python入门学习之类的相关知识总结
2021/05/25 Python
flex布局中使用flex-wrap实现换行的项目实践
2022/06/21 HTML / CSS