当数组具有自定义属性时的angular.copy

时间:2021-07-11 01:48:42

Consider following example:

请考虑以下示例:

var ar = [4, 2, 3];
ar.$x = 'something';
var br = angular.copy(ar);
console.dir(br);

br does not have $x property any more, because when copying array, angular iterates with for (;;;) which does not see custom properties (if it iterated with for in then it would work).

br不再具有$ x属性,因为在复制数组时,angular会使用for(;;;)进行迭代,但不会看到自定义属性(如果使用for迭代,那么它将起作用)。

Which of following shall I do?

我该怎么做?

  1. Create array like class and then assign property;
  2. 像类一样创建数组然后赋值属性;

  3. If it's bug, report to angular;
  4. 如果是bug,请报告角度;

  5. Change my code, because assigning property to array is not good practice;
  6. 更改我的代码,因为将属性赋值给数组不是好习惯;

3 个解决方案

#1


5  

Try angular.merge() This is a deep copy that includes enumerable properties.

尝试angular.merge()这是一个包含可枚举属性的深层副本。

var ar = [4, 2, 3];
ar.$x = 'something';
var br = angular.merge([], ar);
console.dir(br);

Output

Array[3]
  0: 4
  1: 2
  2: 3
  $x: "something"
  length: 3
  __proto__: Array[0]

#2


2  

I think that it's not an Angular problem. If you call such a statement:

我认为这不是一个角度问题。如果你这样说的话:

ar.$x = 'something';
console.log(Object.prototype.toString.call(ar));

You will see that [object Array] will be logged. That is how Array.isArray() method works, and, in its turn, that is how angular copy() method decides how to iterate through the entity passed as the argument. This detection is crucial beacuse for ... in loop on an array can make some confusions in other cases. Here is described why: Why is using "for...in" with array iteration a bad idea?

您将看到将记录[object Array]。这就是Array.isArray()方法的工作方式,反过来,这就是angular copy()方法如何决定如何遍历作为参数传递的实体。这种检测至关重要,因为...在数组循环中可能会在其他情况下产生一些混淆。这里描述了原因:为什么在数组迭代中使用“for ... in”是一个坏主意?

I would advise you to change your code, for this particular case.

对于这种特殊情况,我建议你改变你的代码。

#3


1  

Try using jQuery:

尝试使用jQuery:

jQuery.extend([], ar);

var ar = [4, 2, 3];
ar.$x = 'something';
var br = jQuery.extend([], ar);
console.dir(br);

#1


5  

Try angular.merge() This is a deep copy that includes enumerable properties.

尝试angular.merge()这是一个包含可枚举属性的深层副本。

var ar = [4, 2, 3];
ar.$x = 'something';
var br = angular.merge([], ar);
console.dir(br);

Output

Array[3]
  0: 4
  1: 2
  2: 3
  $x: "something"
  length: 3
  __proto__: Array[0]

#2


2  

I think that it's not an Angular problem. If you call such a statement:

我认为这不是一个角度问题。如果你这样说的话:

ar.$x = 'something';
console.log(Object.prototype.toString.call(ar));

You will see that [object Array] will be logged. That is how Array.isArray() method works, and, in its turn, that is how angular copy() method decides how to iterate through the entity passed as the argument. This detection is crucial beacuse for ... in loop on an array can make some confusions in other cases. Here is described why: Why is using "for...in" with array iteration a bad idea?

您将看到将记录[object Array]。这就是Array.isArray()方法的工作方式,反过来,这就是angular copy()方法如何决定如何遍历作为参数传递的实体。这种检测至关重要,因为...在数组循环中可能会在其他情况下产生一些混淆。这里描述了原因:为什么在数组迭代中使用“for ... in”是一个坏主意?

I would advise you to change your code, for this particular case.

对于这种特殊情况,我建议你改变你的代码。

#3


1  

Try using jQuery:

尝试使用jQuery:

jQuery.extend([], ar);

var ar = [4, 2, 3];
ar.$x = 'something';
var br = jQuery.extend([], ar);
console.dir(br);