JavaScript笑話測試； 使用回調函數修改數組中的元素

Question

我正在使用Jest測試庫來測試一個調用帶有兩個參數element[i]和i的回調的函數。

這是我要測試的功能：

const each = (elements, cb) => {
  for (let i = 0; i < elements.length; i++) {
    cb(elements[i], i);
  }
};

我知道數組只有數字，所以在測試功能中，我試圖使回調簡單地將索引添加到數組中的每個數字。 例如，應將[1, 2, 3, 4]的數組更改為[1, 2, 3, 4] [1, 3, 5, 7] 。

這是我嘗試做的事情：

const arrayFunctions = require('./arrays');

describe('Arrays', () => {
    it('each', () => {
        const callBack = (elem, indx) => {
            elem += indx;  
        }
        const arr = [1, 2, 3, 4];
        arrayFunctions.each(arr, callBack);
        expect(arr).toEqual([1, 3, 5, 7]);
    })
});

這是我得到的錯誤：

 Received:
      [1, 2, 3, 4]

    Difference:

    - Expected
    + Received

      Array [
        1,
    +   2,
        3,
    -   5,
    -   7,
    +   4,
      ]

      15 |         const arr = [1, 2, 3, 4];
      16 |         arrayFunctions.each(arr, callBack);
    > 17 |         expect(arr).toEqual([1, 3, 5, 7]);
         |                     ^
      18 |     })
      19 | });
      20 |

      at Object.it (advanced-javascript/arrays.spec.js:17:21)

為什么不按預期修改數組？ 為了重申一個更簡單的示例，為什么這樣做：

const arr = [1, 2, 3, 4];
for (let i = 0; i < arr.length; i++) {
  arr[i] += i;
}
console.log(arr) // [1, 3, 5, 7];

雖然這不是嗎？

const arr = [1, 2, 3, 4];
each(arr, callBack);
console.log(arr); // [1, 2, 3, 4];

Answer 1

區別在於索引分配的精妙之處。 它看起來像兩個運算符（ [n]和+= ），但實際上是一個： [n]+= 。 最后，使用+= （添加並賦值）與[n] += （添加並賦值給index的值）不同，因此您可以在索引和賦值字符之間加上空格（很奇怪，即使是括號，但這很令人困惑），但是您不能將其分成幾行，這實際上就是您正在做的事情（請參閱下文）。

讓我們創建自己的數組，看看如何實現[n] （讓我們將其稱為get(n) ）和[n]=value （讓我們將該函數稱為set(n, value) 。為便於閱讀，我將使用新的類語法。

class FakeArray {
  get(index) {
    var valueAtIndex = // somehow get that value
    return valueAtIndex
  }

  set(index, value) {
    //somehow set that value
  }
}

現在考慮是否可以使用get實現set 。 這行得通嗎？：

  set(index, value) {
    this.get(index) = value
  }

不會的。 您將得到一個錯誤： ReferenceError: Left side of assignment is not a reference. （您可以更改引用的值，但不能更改值的值）。 但是，如果可以的話，實際上就不需要set函數。 您可以將get函數與=結合使用（也可以將+= ， -=等）組合使用。 但是您無法將它們分開，因此它們是完全不同的功能/運算符。 與[n]和[n]= 。 它們的工作原理完全不同，不是兩者的結合。

---

另外，將值傳遞給函數時，實際上是將它們分配給新變量：

var a = 1;

function foo (b) {
  b = b + 1
  console.log(b)
};

foo(a)
console.log(a)

大致等於：

var a = 1;

var b = a
b = b + 1
console.log(b)

console.log(a)

這稱為按值傳遞，這是在javascript中傳遞值的唯一方法。 請參閱此答案以獲取更多詳細信息： 按引用傳遞與按值傳遞有什么區別？