在javascript中将反转数组保存到变量

Question

我有一系列颜色,我希望可以选择反转.我有一个切换功能,基本上根据数组颜色元素.如果我抛出一个反向变量然后它反转,但它反转全局变量而不是局部变量.

var inc_colors = ['#000','#333','#888']; //global inc_colors

function toggleLegendColors(reverse){
  var reverse = reverse || false;
  var colors = inc_colors; //local colors
  if(reverse) colors.reverse(); //reverses inc_colors array as well as colors
  ...
}

如何在不更改全局数组的情况下获得反转的全局数组？

Answer 1

由于没有人真正解释过你遇到问题的原因,我会将其添加到混音中.

将javascript中的数组或对象分配给变量时,它会为该数组/对象分配引用.它不会复制数组/对象.那么,你将有两个变量都指向同一个数组/对象,并且修改任何一个将影响另一个(因为它们都指向相同的底层数据).

所以,当你有这个:

var inc_colors = ['#000','#333','#888']; //global inc_colors
var colors = inc_colors; //local colors

你现在拥有的只有两个变量,它们都指向完全相同的数据.修改同一个结果将通过另一个变量显示,因为它们指向相同的基础数据.

如果你想制作副本,那么必须明确地制作副本(javascript不会自动为你做).对于数组,制作浅表副本的最简单方法是这样的:

var newColors = Array.prototype.slice.call(inc_colors);

因此,在您的确切代码中,您可以像这样应用该副本:

var inc_colors = ['#000','#333','#888']; //global inc_colors

function toggleLegendColors(reverse){
  var reverse = reverse || false;
  var colors = Array.prototype.slice.call(inc_colors);  //local copy of the colors array
  if(reverse) colors.reverse(); //reverses inc_colors array as well as colors
  ...
}

Answer 2

您现在也可以通过使用es6 spread运算符来完成此操作:

let colors = [ ...inc_colors ].reverse()

Answer 3

只需使用Array.slice(安全方式)制作数组的副本:

var colors = Array.prototype.slice.call(inc_colors);

Answer 4

干净简单的方法,你可以考虑,但涉及创建一个新的数组实例

var arr_reverse=arr.slice(0).reverse();