JavaScript中Object值合并方法詳解

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

這篇文章主要為大家詳細介紹了JavaScript中Object值合并方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下

前言：在日常開發(fā)工作中我們可能會遇到js中對象中所有值的復制工作，也有可能是通過electron開發(fā)客戶端，改版時候面臨到的設置合并問題。那么本文將對此做一個簡要解決方案的敘述。

介紹：比如有obj1, obj2，我們需要將obj1中的所有與obj2中相同字段相同深度的值copy給obj2，并且需要保持obj2字段結構不變，調用一下方法即可（采用ES6寫法）。

代碼：

/**
     * 將src中的數(shù)據(jù)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]

          // 判斷是不是對象，如果是則繼續(xù)遍歷，不是則開始賦值或忽略
          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)){
            // 如果源數(shù)據(jù)存在，并且類型一致，則開始賦值
            dist[key] = src[key]
          }
        })
      }

    },

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

js
Object

js createRange與createTextRange的一些用法實例
關于createTextRange和createRange的一些用法,腳本之家增強版。
2010-05-05
微信小程序實現(xiàn)登錄注冊界面
這篇文章主要為大家詳細介紹了微信小程序實現(xiàn)登錄注冊界面，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-08-08
js 覆蓋和重載函數(shù)
學過JAVA的人對函數(shù)的覆蓋和重載肯定是再熟悉不過了。
2009-09-09
用Div仿showModalDialog模式菜單的效果的代碼
用Div仿showModalDialog模式菜單的效果的代碼...
2007-03-03
javascript實現(xiàn)頁面的實時時鐘顯示示例
這篇文章主要介紹了javascript實現(xiàn)頁面的實時時鐘顯示示例，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
2020-08-08
Javascript基于對象三大特性（封裝性、繼承性、多態(tài)性）
這篇文章主要介紹了Javascript基于對象三大特性，包括封裝性、繼承性、多態(tài)性，感興趣的小伙伴們可以參考一下
2016-01-01
基于 webpack2 實現(xiàn)的多入口項目腳手架詳解
這篇文章主要給大家介紹了基于 webpack2 實現(xiàn)的多入口項目腳手架的相關資料，文中通過示例代碼介紹的非常詳細，對大家具有一定的參考學習價值，需要的朋友們下面來一起看看吧。
2017-06-06
JS開發(fā)中基本數(shù)據(jù)類型具體有哪幾種
JS的數(shù)據(jù)類型包括基本數(shù)據(jù)類型、復雜數(shù)據(jù)類型和特殊數(shù)據(jù)類型，今天我們主要先講解一下基本數(shù)據(jù)類型。感興趣的朋友一起看看吧
2017-10-10
JS使用for循環(huán)遍歷Table的所有單元格內容
JS遍歷Table的所有單元格內容思路是遍歷Table的所有Row，遍歷Row中的每一列，獲取Table中單元格的內容
2014-08-08
在javascript中，null＞=0 為真，null==0卻為假，null的值詳解
這篇文章主要介紹了在javascript中，null＞=0 為真，null==0卻為假，null的值詳解的相關資料,需要的朋友可以參考下
2017-02-02