javascript - 为什么连接和排序方法表现得很奇怪？ 2 本质上相同的方法并不以相同的方式起作用

Question

我正在应对 FCC 挑战，学习 JS。这是link令我困惑的挑战。

我有点解决了这个问题，但是一个代码应该可以工作，而其他代码则不能，我认为它们本质上是相同的事情。

这是一个有效的代码:

var globalArray = [5, 6, 3, 2, 9];
function nonMutatingSort(arr) {
  // Add your code below this line
  return [].concat(arr).sort(function(a, b) {
    return a - b;
  });
  // Add your code above this line
}
nonMutatingSort(globalArray);

这段代码不起作用

var globalArray = [5, 6, 3, 2, 9];
function nonMutatingSort(arr) {
  // Add your code below this line
  let newArr = [];
  newArr.concat(arr);
  return newArr.sort(function(a,b){return a-b;});
  // Add your code above this line
}
nonMutatingSort(globalArray);

我的问题本质上是为什么？两个代码都将旧数组连接到新数组，并且两个函数都应返回排序数组。

但是在第一个函数中连接失败...它仅返回空 arr。为什么？我感到很困惑。它在函数之外起作用，但不在函数中起作用。

Answer 1

concat 不会改变任何现有数组(调用函数的数组或参数列表中的数组)。当您调用concat时，您将返回一个新数组。所以，独立声明

newArr.concat(arr);

不执行任何操作 - 您将 newArr 与 arr 连接起来，创建一个新的组合数组，但该组合数组未分配给任何内容；它被评估然后被丢弃。

const arr1 = ['a'];
const arr2 = ['b'];

// Does not do anything by itself:
arr1.concat(arr2);

console.log(arr1);
console.log(arr2);

将结果分配给 newArr:

newArr = newArr.concat(arr);

var globalArray = [5, 6, 3, 2, 9];
function nonMutatingSort(arr) {
  // Add your code below this line
  let newArr = [];
  newArr = newArr.concat(arr);
  return newArr.sort(function(a,b){return a-b;});
  // Add your code above this line
}
console.log(nonMutatingSort(globalArray));
// Original array is not mutated:
console.log(globalArray);

或者，完全避免 newArr 的初始声明，并使用您的原始代码(我更喜欢)。实际上，为了更简洁，您可能只是对原始数组进行切片，而不是显式创建一个空数组:

var globalArray = [5, 6, 3, 2, 9];
const nonMutatingSort = arr => arr.slice().sort((a, b) => a - b);
console.log(nonMutatingSort(globalArray));