Eine kurze Analyse einiger Betriebsmethoden von Array-Objekten in JS (mit Code)

Im vorherigen Artikel „Ein Artikel zur Erläuterung einiger Betriebsmethoden von Object-Objekten in JS (Teilen)“ haben wir einige Betriebsmethoden von Object-Objekten in JS kennengelernt. Der folgende Artikel wird Ihnen helfen, einige Betriebsmethoden von Array-Objekten in JS zu verstehen. Ich hoffe, dass er für Freunde hilfreich ist.

Einige effiziente Operationsmethoden von Array in javascript 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

Array.from()

Methode erstellt ein neues Objekt aus einem Array-ähnlichen oder iterierbaren Objekt Array-Instanz.

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.isArray()

wird verwendet, um zu bestimmen, ob der übergebene Wert ein Array ist.

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.obsolete()

Wird zur asynchronen Überwachung von Änderungen im Array verwendet

ist veraltet. Syntax: Array.observe(arr , Rückruf)

Array.of()🎜🎜-Methode erstellt eine neue Array-Instanz mit einer variablen Anzahl von Argumenten, unabhängig von der Anzahl oder Art der Argumente. Die Methode 🎜

var array1 = [1, 2, 3];

var firstElement = array1.shift();

console.log(array1);
// expected output: Array [2, 3]

console.log(firstElement);
// expected output: 1

🎜Array.concat()🎜🎜 wird zum Zusammenführen von zwei oder mehr Arrays verwendet. Diese Methode ändert das vorhandene Array nicht, sondern gibt ein neues Array zurück. Die Methode 🎜

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.copyWithin()🎜🎜 kopiert einen Teil eines Arrays flach an eine andere Stelle im selben Array und gibt ihn zurück, ohne seine Größe zu ändern. Die Methode 🎜

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.entries()🎜🎜 gibt ein neues Array Iterator-Objekt zurück, das die Schlüssel/Wert-Paare für jeden Index im Array enthält. Die Methode 🎜

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.every()🎜🎜 testet, ob alle Elemente des Arrays den Test der angegebenen Funktion bestehen. Die Methode 🎜

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.fill()🎜🎜 füllt alle Elemente in einem Array vom Startindex bis zum Endindex mit einem festen Wert. Durch Ausschließen der Beendigungsmethode 🎜

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.filter()🎜🎜 wird ein neues Array erstellt, das alle Elemente des von der bereitgestellten Funktion implementierten Tests enthält. Die Methode 🎜

var alpha = new Array("a", "b", "c");

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

🎜Array.find()🎜🎜 gibt den Wert des ersten Elements im Array zurück, das die bereitgestellte Testfunktion erfüllt. Andernfalls wird undefiniert zurückgegeben. Die Methode 🎜

var array1 = [1, 2, "a", "1a"];

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

🎜Array.findIndex()🎜🎜 gibt den Index des ersten Elements im Array zurück, das die bereitgestellte Testfunktion erfüllt. Andernfalls geben Sie -1 zurück. Die Methode 🎜

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.flat()🎜🎜 führt eine Rekursion bis zur angegebenen Tiefe durch, um alle Unterarrays zu verbinden und ein neues Array zurückzugeben. Die Methode 🎜

const array1 = ["a", "b", "c"];
const iterator = array1.values();

for (const value of iterator) {
  console.log(value);
  // expected output: "a" "b" "c"
}

🎜Array.flatMap()🎜🎜 ordnet zunächst jedes Element mithilfe einer Zuordnungsfunktion zu und komprimiert das Ergebnis dann in ein neues Array. Es ist fast identisch mit map und flat mit einem Tiefenwert von 1, wird aber normalerweise mit flatMap kombiniert eine Methode Etwas effizienter. Die Methode 🎜rrreee🎜Array.forEach()🎜🎜 führt die bereitgestellte Funktion einmal für jedes Element des Arrays aus. Die Methode 🎜rrreee🎜Array.includes(value,index)🎜🎜 wird verwendet, um zu bestimmen, ob ein Array einen angegebenen Wert enthält. Wenn dies der Fall ist, wird true zurückgegeben gibt false</code code> zurück. Die Methode 🎜rrreee🎜Array.indexOf()🎜🎜 gibt den ersten Index zurück, an dem ein bestimmtes Element im Array gefunden werden kann, oder <code>-1, wenn es nicht existiert. Die Methode 🎜rrreee🎜Array.join()🎜🎜 fügt alle Elemente eines Arrays (oder eines arrayähnlichen Objekts) zu einer Zeichenfolge zusammen und gibt dieses Zeichen zurück. 🎜rrreee🎜Array.keys()🎜🎜Die Methode gibt ein neues < zurück code >ArrayIterator, der den Schlüssel für jeden Index im Array enthält. Die Methode 🎜rrreee🎜Array.lastIndexOf(item, index)🎜🎜 gibt den Index des letzten Elements im Array zurück (d. h. einen gültigen JavaScript-Wert oder eine gültige Variable) oder -1. Suchen Sie vorwärts von der Rückseite des Arrays, beginnend mit fromIndex. Die Methode 🎜rrreee🎜Array.map()🎜🎜 erstellt ein neues Array, dessen Ergebnis das Ergebnis des Aufrufs einer bereitgestellten Funktion für jedes Element im Array ist. Die Methode 🎜rrreee🎜Array.pop()🎜🎜 entfernt das letzte Element aus dem Array und gibt den Wert dieses Elements zurück. Diese Methode ändert die Länge des Arrays. Die Methode 🎜rrreee🎜Array.push()🎜🎜 fügt ein oder mehrere Elemente am Ende des Arrays hinzu und gibt die Länge des neuen Arrays zurück. Die Methode 🎜rrreee🎜Array.reduce()🎜🎜 wendet eine Funktion auf den Akkumulator und jedes Element im Array (von links nach rechts) an und reduziert es auf einen einzelnen Wert. Die Methode 🎜rrreee🎜Array.reduceRight()🎜🎜 akzeptiert eine Funktion als Akkumulator (accumulator) und reduziert jeden Wert des Arrays (von rechts nach links) auf einen einzelnen Wert. Die Methode 🎜rrreee🎜Array.reverse()🎜🎜 kehrt die Position von Elementen im Array um. Die Methode 🎜rrreee🎜Array.shift()🎜🎜 entfernt das erste Element aus dem Array und gibt den Wert dieses Elements zurück. Diese Methode ändert die Länge des Arrays. Die Methode 🎜rrreee🎜Array.slice()🎜🎜 gibt eine flache Kopie eines Teils des ausgewählten Arrays vom Anfang bis zum Ende (exklusiv) an ein neues Array-Objekt zurück. Und das ursprüngliche Array wird nicht geändert. Die Methode 🎜rrreee🎜Array.some()🎜🎜 testet, ob einige Elemente im Array einen von der bereitgestellten Funktion implementierten Test bestehen. 🎜

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视频教程

Das obige ist der detaillierte Inhalt vonEine kurze Analyse einiger Betriebsmethoden von Array-Objekten in JS (mit Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!