深合并与AngularJS对象 [英] deep merge objects with AngularJS

问题描述

通常情况下，以我会用浅拷贝对象 angular.extend（）

下面是这样一个例子：

  VAR object1 = {
  钥匙：abc123def456
  信息： {
    主题：有一个问题
    从：[e-mail]
    到：[e-mail]
   }
};VAR = Object2的{
  钥匙：00700916391
};的console.log（angular.extend（{}，object1，Object2的））;
 

会给我们：

  {
 钥匙：00700916391，
 信息： {
   主题：有一个问题
   从：[e-mail]
   到：[e-mail]
  }
}
 

但是，如果我想，这样父键不通过写子对象合并的对象是什么：

  VAR object1 = {
  钥匙：abc123def456
  信息： {
    主题：有一个问题
    从：[e-mail]
    到：[e-mail]
   }
};VAR = Object2的{
  钥匙：00700916391，//我覆盖
  消息：{//不要覆盖我！
    主题：嘿，这是怎么回事，//我覆盖
    东西：新的东西//加我
   }
};的console.log（合并（object1，Object2的））;
 

会给我们：

  {
 钥匙：00700916391，
 信息： {
   主题：嘿，怎么了？
   从：[e-mail]
   到：[e-mail]，
   东西：新的东西
  }
}
 

• 有没有已经这样做了深刻的合并我不知道的一个角的功能？




• 如果不是有在JavaScript这样做原生方式递归n级深？

解决方案

角1.4或更高版本

使用 angular.merge ：

  

与延长（），合并（）递归下降到源对象的对象属性，执行深拷贝

  angular.merge（object1，Object2的）; //合并对象2成目标1
 

---

旧版本的角度：

有没有理由一个简单的递归算法不应该工作：）

假设他们是JSON.stringify或两个结果类似：

 函数合并（OBJ1，OBJ2）{//我们的合并功能
    VAR的结果= {}; //返回结果
    对于（VAR我在OBJ1）{//在OBJ1每个属性
        如果（（i的OBJ2）及及（typeof运算OBJ1 [Ⅰ] ===对象）及及（我== NULL）！）{
            结果由[i] =合并（OBJ1 [I]，obj2的[I]）; //如果它是一个对象，合并
        }其他{
           结果[I] = OBJ1 [I] //添加导致
        }
    }
    对（我OBJ2）{//从对象2加入剩余的性质
        如果（我的结果）{//冲突
            继续;
        }
        结果[I] = OBJ2 [I]
    }
    返回结果;
}
 

这里是工作提琴

（注意，数组这里没有处理）

Normally to shallow copy objects I would use angular.extend()

Here's an example of that:

var object1 = {
  "key": "abc123def456",
  "message": {
    "subject": "Has a Question",
    "from": "[e-mail]",
    "to": "[e-mail]"
   }
};

var object2 = {
  "key": "00700916391"
};

console.log(angular.extend({}, object1, object2));

Would give us:

{
 "key": "00700916391",
 "message": {
   "subject": "Has a Question",
   "from": "[e-mail]",
   "to": "[e-mail]"
  }
}

But what if I wanted to merge objects so that parent keys are not over written by child objects:

var object1 = {
  "key": "abc123def456",
  "message": {
    "subject": "Has a Question",
    "from": "[e-mail]",
    "to": "[e-mail]"
   }
};

var object2 = {
  "key": "00700916391",              //Overwrite me
  "message": {                       //Dont overwrite me!
    "subject": "Hey what's up?",     //Overwrite me
    "something": "something new"     //Add me
   }
};

console.log(merge(object1, object2));

Would give us:

{
 "key": "00700916391",
 "message": {
   "subject": "Hey what's up?",
   "from": "[e-mail]",
   "to": "[e-mail]",
   "something": "something new"
  }
}

• Is there an Angular function that already does a deep merge that I am not aware of?

• If not is there a native way to do this in javascript recursively for n levels deep?

解决方案

Angular 1.4 or later

Use angular.merge:

Unlike extend(), merge() recursively descends into object properties of source objects, performing a deep copy.

angular.merge(object1, object2); // merge object 2 into object 1

---

Older versions of Angular:

There is no reason a simple recursive algorithm shouldn't work :)

Assuming they're both the result of JSON.stringify or similar:

function merge(obj1,obj2){ // Our merge function
    var result = {}; // return result
    for(var i in obj1){      // for every property in obj1 
        if((i in obj2) && (typeof obj1[i] === "object") && (i !== null)){
            result[i] = merge(obj1[i],obj2[i]); // if it's an object, merge   
        }else{
           result[i] = obj1[i]; // add it to result
        }
    }
    for(i in obj2){ // add the remaining properties from object 2
        if(i in result){ //conflict
            continue;
        }
        result[i] = obj2[i];
    }
    return result;
}

Here is a working fiddle

(Note, arrays are not handled here)

这篇关于深合并与AngularJS对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！