AngularJS：复制vs扩展 [英] AngularJS : copy vs extend

问题描述

说明：

我们遇到一些需要将一个对象复制到另一个对象的情况。在这种情况下，我们可能有两个解决方案： angular.copy（）或 angular.extend（）。

we come across some situation in which we need to copy one object to another object. In that case, we probably have two solutions: angular.copy() or angular.extend().

我面临的挑战：

我们知道 angular.copy（来源，目的地） ）创建源对象的深层副本并将其分配给目标。通过编写深层副本，我们的意思是制作推荐对象的新副本并使其正常工作。

As we know angular.copy(source, destination) creates a deep copy of source object and assign it to destination. By writing deep copy, we mean that a new copy of the referred object is made and its working fine.

深层复制代码：

var mySource = {'name' : 'Rohit', 'age' : '24'}
var myDest = {}
angular.copy(mySource,myDest);
mySource.name = "Jindal";
console.log(mySource); // Object {name: "Jindal", age: "24"}
console.log(myDest); // Object {name: "Rohit", age: "24"}
console.log(mySource.obj === myDest.obj); // false

在这里，我修改源对象 mySource.name = Jindal但它没有按预期影响目标对象 myDest 。
如果我们检查 mySource.obj === myDest.obj ，这将给出错误，因为它们都指向不同的对象。

Here, I modify the source object mySource.name = "Jindal" but it is not affecting the destination object myDest as expected. If we check mySource.obj === myDest.obj, this will give false because both point to different objects.

现在，我遇到了 angular.extend（目的地，来源）的问题，因为它创建了浅拷贝意味着源和目标都指向同一地址。 因此，如果我将修改源对象，那么它也将反映在目标对象中。但它没有发生。

Now,I am facing issue with angular.extend(destination, source) as it creates a shallow copy means in this both source and destination will point to same address. So, if i will modify source object then it will also reflect in destination object. But it's not happening.

浅拷贝代码：

var mySource = {'name' : 'Rohit', 'age' : '24'}
var myDest = {}
angular.extend(myDest,mySource);
mySource.name = "Jindal";
console.log(mySource); // Object {name: "Jindal", age: "24"}
console.log(myDest); // Object {name: "Rohit", age: "24"}
console.log(mySource.obj === myDest.obj); // True

jsfiddle： https://jsfiddle.net/U3pVM/24322/

jsfiddle : https://jsfiddle.net/U3pVM/24322/

由于我是新手，需要帮助才能理解适当的angular.copy（）& amp; angular.extend（）。

As i am new in this, need help to understand the proper flow of angular.copy() & angular.extend().

任何直接的帮助都会非常明显。谢谢

Any immediate help will be highly appreciable. Thanks

推荐答案

我更新了代码。现在angular.extends按预期工作。请记住，如果传递angular.extends空对象作为第一个参数（目标）然后传递源，则angular将保留两个对象并仅复制属性，就像angular.copy一样。

I updated the code . Now angular.extends works as you expected. Remember that if you pass angular.extends an empty object as first parameter (destination) and then the source, angular is going to preserve both objects and copy only the properties, just like angular.copy does.

// angular.copy()

var mySource = {'name' : 'sakshi', 'age' : '24', 'obj' :{'key':'value'}}
var myDest = angular.copy(mySource);

mySource.name = "Rohit";
console.log(mySource); // Object {name: "Rohit", age: "24", obj: Object}
console.log(myDest); // Object {name: "sakshi", age: "24", obj: Object}
console.log(mySource.obj === myDest.obj); // false

// angular.extend()

var mySource = {'name' : 'sakshi', 'age' : '24', 'obj' :{'key':'value'}}
var myDest = angular.extend(mySource);
mySource.name = "Rohit";
console.log(mySource); // Object {name: "Rohit", age: "24", obj: Object}
console.log(myDest); // Object {name: "Rohit", age: "24", obj: Object}
console.log(mySource.obj === myDest.obj); // True

这篇关于AngularJS：复制vs扩展的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！