淺析JS中Array對象一些操作方法（附代碼）

之前的文章《一文講解JS中Object對象一些操作方法（分享）》中，給大家了解了JS中Object對象一些操作方法。下面本篇文章給大家了解JS中Array對象一些操作方法，有一定的參考價值，有需要的朋友可以參考一下，希望對你們有幫助。

javascript中Array一些高效的操作方法

Array.from()

方法從一個類似數組或可迭代對象中創建一個新的數組實例。

console.log(Array.from("foo")); // expected output: Array ["f", "o", "o"] console.log(Array.from([1, 2, 3], (x) => x + x)); // expected output: Array [2, 4, 6]

Array.isArray()

用于確定傳遞的值是否是一個Array。

Array.isArray([1, 2, 3]); // true Array.isArray({ foo: 123 }); // false Array.isArray("foobar"); // false Array.isArray(undefined); // false

Array.obsolete()

用于異步監視數組發生的變化

已被廢棄 語法：Array.observe(arr, callback)

Array.of()

方法創建一個具有可變數量參數的新數組實例，而不考慮參數的數量或類型。

Array.of(7); // [7] Array.of(1, 2, 3); // [1, 2, 3]  Array(7); // [ , , , , , , ] Array(1, 2, 3); // [1, 2, 3] //es5 if (!Array.of) {   Array.of = function () {     return Array.prototype.slice.call(arguments);   }; }

Array.concat()

方法用于合并兩個或多個數組。此方法不會更改現有數組，而是返回一個新數組。

var array1 = ["a", "b", "c"]; var array2 = ["d", "e", "f"];  console.log(array1.concat(array2)); // expected output: Array ["a", "b", "c", "d", "e", "f"]

Array.copyWithin()

方法淺復制數組的一部分到同一數組中的另一個位置，并返回它，而不修改其大小。

var array1 = [1, 2, 3, 4, 5];  // place at position 0 the element between position 3 and 4 console.log(array1.copyWithin(0, 3, 4)); // expected output: Array [4, 2, 3, 4, 5]  // place at position 1 the elements after position 3 console.log(array1.copyWithin(1, 3)); // expected output: Array [4, 4, 5, 4, 5]

Array.entries()

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

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"]

Array.every()

方法測試數組的所有元素是否都通過了指定函數的測試。

var array1 = [1, 30, 39, 29, 10, 13]; console.log(array1.every((x) => x < 40)); //out true

Array.fill()

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

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]

Array.filter()

方法創建一個新數組，其包含通過所提供函數實現的測試的所有元素。

var words = ["spray", "limit", "elite", "exuberant", "destruction", "present"];  const result = words.filter((word) => word.length > 6);  console.log(result); // expected output: Array ["exuberant", "destruction", "present"]

Array.find()

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

var array1 = [5, 12, 8, 130, 44];  var found = array1.find((x) => x > 10);  console.log(found); // expected output: 12

Array.findIndex()

方法返回數組中滿足提供的測試函數的第一個元素的索引。否則返回-1。

var array1 = [5, 12, 8, 130, 44];  var index = array1.findIndex((x) => x > 10);  console.log(index); // expected output: 1

Array.flat()

方法會遞歸到指定深度將所有子數組連接，并返回一個新數組。

var arr1 = [1, 2, [3, 4]]; arr1.flat(); // [1, 2, 3, 4]  var arr2 = [1, 2, [3, 4, [5, 6]]]; arr2.flat(); // [1, 2, 3, 4, [5, 6]]  var arr3 = [1, 2, [3, 4, [5, 6]]]; arr3.flat(2); // [1, 2, 3, 4, 5, 6] var arr4 = [1, 2, , 4, 5]; arr4.flat(); // [1, 2, 4, 5]

Array.flatMap()

方法首先使用映射函數映射每個元素，然后將結果壓縮成一個新數組。它與map和深度值1的flat幾乎相同，但flatMap通常在合并成一種方法的效率稍微高一些。

var arr1 = [1, 2, 3, 4];  arr1.map((x) => [x * 2]); // [[2], [4], [6], [8]]  arr1.flatMap((x) => [x * 2]); // [2, 4, 6, 8]  // only one level is flattened arr1.flatMap((x) => [[x * 2]]); // [[2], [4], [6], [8]]

Array.forEach()

方法對數組的每個元素執行一次提供的函數。

var array1 = ["a", "b", "c"];  array1.forEach((value, index, arr) => console.log(value)); // output 'a' // output 'b' // output 'c'

Array.includes(value,index)

方法用來判斷一個數組是否包含一個指定的值，根據情況，如果包含則返回true，否則返回false。

var array1 = [1, 2, 3];  console.log(array1.includes(2)); // expected output: true  var pets = ["cat", "dog", "bat"];  console.log(pets.includes("cat")); // expected output: true  console.log(pets.includes("at")); // expected output: false

Array.indexOf()

方法返回在數組中可以找到一個給定元素的第一個索引，如果不存在，則返回-1。

/var beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];  console.log(beasts.indexOf('bison')); // expected output: 1  // start from index 2 console.log(beasts.indexOf('bison', 2)); // expected output: 4  console.log(beasts.indexOf('giraffe')); // expected output: -1

Array.join()

方法將一個數組（或一個類數組對象）的所有元素連接成一個字符串并返回這個字符

var elements = ["Fire", "Wind", "Rain"];  console.log(elements.join()); // expected output: Fire,Wind,Rain  console.log(elements.join("")); // expected output: FireWindRain  console.log(elements.join("-")); // expected output: Fire-Wind-Rain  //數組[1,2,3,3,4,5]求和 eval([1, 2, 3, 3, 4, 5].join("+")) = 18;

Array.keys()

方法返回一個新的Array迭代器，它包含數組中每個索引的鍵。

var array1 = ["a", "b", "c"]; var iterator = array1.keys();  for (let key of iterator) {   console.log(key); // expected output: 0 1 2 }

Array.lastIndexOf(item，index)

方法返回指定元素（也即有效的JavaScript值或變量）在數組中的最后一個的索引，如果不存在則返回-1。從數組的后面向前查找，從fromIndex處開始。

var animals = ["Dodo", "Tiger", "Penguin", "Dodo"];  console.log(animals.lastIndexOf("Dodo")); // expected output: 3  console.log(animals.lastIndexOf("Tiger")); // expected output: 1

Array.map()

方法創建一個新數組，其結果是該數組中的每個元素都調用一個提供的函數后返回的結果。

var array1 = [1, 4, 9, 16];  // pass a function to map const map1 = array1.map((x) => x * 2);  console.log(map1); // expected output: Array [2, 8, 18, 32]

Array.pop()

方法從數組中刪除最后一個元素，并返回該元素的值。此方法更改數組的長度。

var plants = ["broccoli", "cauliflower", "cabbage", "kale", "tomato"]; console.log(plants.pop()); // expected output: "tomato" console.log(plants); // expected output: Array ["broccoli", "cauliflower", "cabbage", "kale"] plants.pop(); console.log(plants); // expected output: Array ["broccoli", "cauliflower", "cabbage"]

Array.push()

方法將一個或多個元素添加到數組的末尾，并返回新數組的長度。

var animals = ["pigs", "goats", "sheep"];  console.log(animals.push("cows")); // expected output: 4  console.log(animals); // expected output: Array ["pigs", "goats", "sheep", "cows"]  animals.push("chickens");  console.log(animals); // expected output: Array ["pigs", "goats", "sheep", "cows", "chickens"]

Array.reduce()

方法對累加器和數組中的每個元素（從左到右）應用一個函數，將其減少為單個值。

const array1 = [1, 2, 3, 4]; const reducer = (accumulator, currentValue) => accumulator + currentValue;  // 1 + 2 + 3 + 4 console.log(array1.reduce(reducer)); // expected output: 10  // 5 + 1 + 2 + 3 + 4 console.log(array1.reduce(reducer, 5)); // expected output: 15

Array.reduceRight()

方法接受一個函數作為累加器（accumulator）和數組的每個值（從右到左）將其減少為單個值。

const array1 = [   [0, 1],   [2, 3],   [4, 5], ].reduceRight((accumulator, currentValue) => accumulator.concat(currentValue));  console.log(array1); // expected output: Array [4, 5, 2, 3, 0, 1]

Array.reverse()

方法將數組中元素的位置顛倒。

var array1 = ["one", "two", "three"]; console.log("array1: ", array1); // expected output: Array ['one', 'two', 'three']  var reversed = array1.reverse(); console.log("reversed: ", reversed); // expected output: Array ['three', 'two', 'one']  /* Careful: reverse is destructive. It also changes the original array */  console.log("array1: ", array1); // expected output: Array ['three', 'two', 'one']

Array.shift()

方法從數組中刪除第一個元素，并返回該元素的值。此方法更改數組的長度。

var array1 = [1, 2, 3];  var firstElement = array1.shift();  console.log(array1); // expected output: Array [2, 3]  console.log(firstElement); // expected output: 1

Array.slice()

方法返回一個從開始到結束（不包括結束）選擇的數組的一部分淺拷貝到一個新數組對象。且原始數組不會被修改。

var animals = ["ant", "bison", "camel", "duck", "elephant"];  console.log(animals.slice(2)); // expected output: Array ["camel", "duck", "elephant"]  console.log(animals.slice(2, 4)); // expected output: Array ["camel", "duck"]  console.log(animals.slice(1, 5)); // expected output: Array ["bison", "camel", "duck", "elephant"]

Array.some()

方法測試數組中的某些元素是否通過由提供的函數實現的測試。

var array = [1, 2, 3, 4, 5];  var even = function (element) {   // checks whether an element is even   return element % 2 === 0; };  console.log(array.some(even)); // expected output: true

Array.sort()

方法用原地算法對數組的元素進行排序，并返回數組。排序不一定是穩定的。默認排序順序是根據字符串Unicode碼點。

var months = ["March", "Jan", "Feb", "Dec"]; months.sort(); console.log(months); // expected output: Array ["Dec", "Feb", "Jan", "March"]  var array1 = [1, 30, 4, 21]; array1.sort(); console.log(array1); // expected output: Array [1, 21, 30, 4]

Array.splice()

方法通過刪除現有元素和/或添加新元素來更改一個數組的內容。

var months = ["Jan", "March", "April", "June"]; months.splice(1, 0, "Feb"); // 增 console.log(months); // expected output: Array ['Jan', 'Feb', 'March', 'April', 'June']  months.splice(4, 1, "May"); // 改 console.log(months); // expected output: Array ['Jan', 'Feb', 'March', 'April', 'May'] // 刪 months.splice(4, 1); console.log(months); //output： ["Jan", "Feb", "March", "April"]

Array.toLocaleString()

返回一個字符串表示數組中的元素。數組中的元素將使用各自的toLocaleString方法轉成字符串，這些字符串將使用一個特定語言環境的字符串（例如一個逗號 ","）隔開。

var array1 = [1, "a", new Date("21 Dec 1997 14:12:00 UTC")]; var localeString = array1.toLocaleString("en", { timeZone: "UTC" });  console.log(localeString); // expected output: "1,a,12/21/1997, 2:12:00 PM", // This assumes "en" locale and UTC timezone - your results may vary var prices = ["￥7", 500, 8123, 12]; prices.toLocaleString("ja-JP", { style: "currency", currency: "JPY" });  // "￥7,￥500,￥8,123,￥12"

Array.toSource()

返回一個字符串,代表該數組的源代碼。

該特性是非標準的，請盡量不要在生產環境中使用它！

var alpha = new Array("a", "b", "c");  alpha.toSource(); //返回["a", "b", "c"]

Array.toString()

返回一個字符串，表示指定的數組及其元素。

var array1 = [1, 2, "a", "1a"];  console.log(array1.toString()); // expected output: "1,2,a,1a"

Array.unshift()

方法將一個或多個元素添加到數組的開頭，并返回新數組的長度。

var array1 = [1, 2, 3];  console.log(array1.unshift(4, 5)); // expected output: 5  console.log(array1); // expected output: Array [4, 5, 1, 2, 3]

Array.values()

方法返回一個新的Array Iterator對象，該對象包含數組每個索引的值。

const array1 = ["a", "b", "c"]; const iterator = array1.values();  for (const value of iterator) {   console.log(value);   // expected output: "a" "b" "c" }

推薦學習：JavaScript視頻教程