在React组件中的ES2015非变异阵列交换(或磁通动作)

时间:2016-04-05 13:17:22

标签: javascript reactjs immutability

也许我一直在搜索错误的关键字,但我一直试图找到一个JavaScript(最好是ES2015 +)函数的例子来以非变异(不可变)的方式交换两个数组值。我也想使用纯JS来做这个,而不必添加不变量库。

例如,如果我有[1, 2, 3, 4, 5, 6],我想将3和4(或可能是它们的索引)传递给返回新数组[1, 2, 4, 3, 5, 6]的函数。我发现了一些方法,但他们通过直接替换值来改变数组。我需要一种不可改变的方式。我猜也许用切片?我这样做是一个React组件,如果这很重要,并且数组是一个状态值。

TIA!

2 个答案:

答案 0 :(得分:6)

不是ES6(仍在学习)

function swap(array, first, second){
  var final = array.slice();
  temp = final[first];
  final[first] = final[second];
  final[second] = temp;
  return final
}

ES6感谢@Benjamin

const swapIndices = (array,index1,index2) => { 
  const newArray = array.slice(); 
  newArray[index1] = array[index2]; 
  newArray[index2] = array[index1]; 
  return newArray; 
}

答案 1 :(得分:1)

function swap(arr, i1, i2) {
    // i1 must be lower
    if (i1 > i2) i1 = [i2, i2 = i1][0];
    return arr
        .slice(0,i1)
        .concat(arr[i2])
        .concat(arr.slice(i1+1,i2))
        .concat(arr[i1])
        .concat(arr.slice(i2+1))
}

也许不完美,但却是踏脚石:)