javascript數組的內置方法詳解

Posted on by

1.Array.at()

功能：接受一個整數值並返回該索引處的項目，允許正整數和負整數。負整數從數組中的最後一項開始計數。

語法：Array.at(index)

參數：index：要返回的數組元素的索引（位置）。當傳遞一個負索引時，支持從數組末尾開始相對索引；即，如果使用負數，將通過從數組末尾開始倒數來找到返回的元素。

返回值：數組中與給定索引匹配的元素。undefined如果找不到給定的索引，則返回

<script type="text/javascript">
			var arr = [1,2,3,4,5];
			var newarr = arr.at(-1);
			console.log(newarr);// 5
			var newarr = arr.at(3);
			console.log(newarr);// 4
</script>

2. Array.copyWithin()

功能：淺復制數組的一部分到同一數組中的另一個位置，並返回它，不會改變原數組的長度。

語法：arr.copyWithin(target[, start[, end]])

參數：

target:

0 為基底的索引，復制序列到該位置。如果是負數，target 將從末尾開始計算。

如果 target 大於等於 arr.length，將會不發生拷貝。如果 target 在 start 之後，復制的序列將被 修改以符合 arr.length。

start:

0 為基底的索引，開始復制元素的起始位置。如果是負數，start 將從末尾開始計算。

如果 start 被忽略，copyWithin 將會從0開始復制。

end:

0 為基底的索引，開始復制元素的結束位置。copyWithin 將會拷貝到該位置，但不包括 end 這 個位置的元素。如果是負數， end 將從末尾開始計算。

如果 end 被忽略，copyWithin 方法將會一直復制至數組結尾（默認為 arr.length）

<script type="text/javascript">
			var arr = [1,2,3,4,5];
			var arr2= arr.copyWithin(-2)
			console.log(arr2); // [1, 2, 3, 1, 2]
			var arr3= arr.copyWithin(0, 3)
			console.log(arr3); // [4, 5, 3, 4, 5]
			var arr4= arr.copyWithin(0, 3, 4)
			console.log(arr4); // [4, 2, 3, 4, 5]
			var arr5= arr.copyWithin(-2, -3, -1)
			console.log(arr5); // [1, 2, 3, 3, 4]
</script>

3. Array.entries()

功能：返回一個新的Array Iterator對象，該對象包含數組中每個索引的鍵/值對。

語法：arr.entries()

返回值：一個新的 Array 迭代器對象。Array Iterator是對象，它的原型（__proto__:Array Iterator）上有一個next方法，可用用於遍歷迭代器取得原數組的[key,value]。

<script type="text/javascript">
			var array1 = ['a', 'b', 'c'];
			var iterator1 = array1.entries();
			console.log(iterator1.next().value);
			// expected output: Array [0, "a"]
			console.log(iterator1.next().value);
			// expected output: Array [1, "b"]
</script>

4. Array.fill()

功能：用一個固定值填充一個數組中從起始索引到終止索引內的全部元素。不包括終止索引。

語法：arr.fill(target[, start[, end]])

參數：

  • value：用來填充數組元素的值。
  • start ：可選，起始索引，默認值為0。
  • end ：可選，終止索引，默認值為 this.length。

返回值：修改後的數組

<script type="text/javascript">
			var array1 = [1, 2, 3, 4];	
			// fill with 0 from position 2 until position 4
			console.log(array1.fill(0, 2, 4));
			// expected output: [1, 2, 0, 0]
			// fill with 5 from position 1
			console.log(array1.fill(5, 1));
			// expected output: [1, 5, 5, 5]
			console.log(array1.fill(6));
			// expected output: [6, 6, 6, 6]
</script>

5.find()

功能：返回數組中滿足提供的測試函數的第一個元素的值。否則返回 undefined。

語法：arr.find(callback[, thisArg])

參數：

  • callback：在數組每一項上執行的函數，接收 3 個參數：
  • element：當前遍歷到的元素。
  • index：可選，當前遍歷到的索引。
  • array：可選，數組本身。
  • thisArg可選，執行回調時用作this 的對象。

返回值：數組中第一個滿足所提供測試函數的元素的值，否則返回 undefined。

<script type="text/javascript">
			var array1 = [5, 12, 8, 130, 44];
			var found = array1.find(element => element > 10);
			console.log(found); // 12
</script>

總結

本篇文章就到這裡瞭，希望能夠給你帶來幫助，也希望您能夠多多關註WalkonNet的更多內容！

推薦閱讀：