js-Array-Methoden (Enzyklopädie)

Language 2023-10-05 07:25:40 views: null

  1. Array.at() Ruft einen Wert per Index ab

Array.at(index) erhält den Wert, der dem Index entspricht. Index ist der Indexwert. Wenn die Zahl positiv ist, erfolgt die Abfrage von links nach rechts, und wenn die Zahl negativ ist, erfolgt die Abfrage von rechts nach links (der Der Standardwert ist 0). Beispiele sind wie folgt:

const array1 = [5, 12, 8, 130, 44];

let index = 2;

console.log(`Using an index of ${index} the item returned is ${array1.at(index)}`);
// Expected output: "Using an index of 2 the item returned is 8"

index = -2;

console.log(`Using an index of ${index} item returned is ${array1.at(index)}`);
// Expected output: "Using an index of -2 item returned is 130"

  1. Array.concat-Array-Verkettung

Durch das Zusammenfügen von zwei Arrays oder mehreren Arrays wird ein neues Array zurückgegeben, ohne das ursprüngliche Array zu ändern. Beispiele sind wie folgt:

const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = array1.concat(array2);

console.log(array3);
// Expected output: Array ["a", "b", "c", "d", "e", "f"]

  1. Array.entries() Array-Iteratorobjekt

Das Objekt wird Schicht für Schicht iteriert und enthält das Schlüssel/Wert-Paar für jeden Index im Array. Beispiele sind wie folgt:

示例一：
const array1 = ['a', 'b', 'c'];

const iterator1 = array1.entries();

console.log(iterator1.next().value);
// Expected output: Array [0, "a"]

console.log(iterator1.next().value);
// Expected output: Array [1, "b"]

console.log(iterator1.next().value);
// Expected output: Array [2, "c"]

示例二：
const a = ["a", "b", "c"];

for (const [index, element] of a.entries()) {
  console.log(index, element);
}
// 0 'a'
// 1 'b'
// 2 'c'

示例三：
const array = ["a", "b", "c"];
const arrayEntries = array.entries();

for (const element of arrayEntries) {
  console.log(element);
}

// [0, 'a']
// [1, 'b']
// [2, 'c']

  1. Array.every() bestimmt, ob das angegebene Element den Test besteht (der Rückgabewert ist ein boolescher Wert)

Die Methode Array.every (element, index. array) testet, ob alle Elemente in einem Array den Test der angegebenen Funktion bestehen können. Es gibt einen booleschen Wert zurück. Es gibt drei Parameter, die den folgenden entsprechen:

Element

Index

Array

Das aktuelle Element im Array, das verarbeitet wird

Index

Rufen Sie das aktuelle Array von jedem auf

Beispiele sind wie folgt:

示例一：
const isBelowThreshold = (currentValue) => currentValue < 40;

const array1 = [1, 30, 39, 29, 10, 13];

console.log(array1.every(isBelowThreshold));
// Expected output: true

示例二
function isBigEnough(element, index, array) {
  return element >= 10;
}
[12, 5, 8, 130, 44].every(isBigEnough);   // false
[12, 54, 18, 130, 44].every(isBigEnough); // true

  1. Array.fill() füllt und ändert das Array

Die Methode Array.fill(value, statr, end) füllt alle Elemente in einem Array vom Startindex (Standard ist 0) bis zum Endindex (Standard ist array.length) mit einem festen Wert. Es gibt das geänderte Array zurück.

Wert

statr

Ende

Wert geändert

Index geändert

Beispiele sind wie folgt:

console.log([1, 2, 3].fill(4)); // [4, 4, 4]
console.log([1, 2, 3].fill(4, 1)); // [1, 4, 4]
console.log([1, 2, 3].fill(4, 1, 2)); // [1, 4, 3]
console.log([1, 2, 3].fill(4, 1, 1)); // [1, 2, 3]
console.log([1, 2, 3].fill(4, 3, 3)); // [1, 2, 3]
console.log([1, 2, 3].fill(4, -3, -2)); // [4, 2, 3]
console.log([1, 2, 3].fill(4, NaN, NaN)); // [1, 2, 3]
console.log([1, 2, 3].fill(4, 3, 5)); // [1, 2, 3]
console.log(Array(3).fill(4)); // [4, 4, 4]

Array.filter() Array-Filterung, Filterung

Array.filter(element, index, array) ändert nicht das ursprüngliche Array, sondern erstellt ein neues Array

Element

Index

Array

Das Element im Array, das gerade verarbeitet wird.

Der Index im Array des verarbeiteten Elements.

Das Array selbst, für das filter() aufgerufen wurde.

Beispiele sind wie folgt

示例一：
筛选排除对比小的值
function isBigEnough(value) {
  return value >= 10;
}

const filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]

示例二：
找出下列输入所有质数
const array = [-3, -2, -1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13];

function isPrime(num) {
  for (let i = 2; num > i; i++) {
    if (num % i === 0) {
      return false;
    }
  }
  return num > 1;
}

console.log(array.filter(isPrime)); // [2, 3, 5, 7, 11, 13]

示例三：
在数组中搜索
const fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];

/**
 * 根据搜索条件（查询）筛选数组项
 */
function filterItems(arr, query) {
    return arr.filter((el) => el.toLowerCase().includes(query.toLowerCase()));
}

console.log(filterItems(fruits, 'ap')); // ['apple', 'grapes']
console.log(filterItems(fruits, 'an')); // ['banana', 'mango', 'orange']

  1. Array.find() gibt den Wert des ersten Elements im Test zurück, das die Anforderungen erfüllt

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

Element

Index

Array

Das aktuell durchlaufene Element.

Der aktuell durchlaufene Index.

Das Array selbst.

Beispiele sind wie folgt:

示例一：
const inventory = [
  {name: 'apples', quantity: 2},
  {name: 'bananas', quantity: 0},
  {name: 'cherries', quantity: 5},
  {name: 'cherries', quantity: 6}
];

function isCherries(fruit) {
  return fruit.name === 'cherries';
}

console.log(inventory.find(isCherries));
// { name: 'cherries', quantity: 5 }
// 只会返回满足条件的第一个数据

示例二：
使用箭头函数和解构赋值
const inventory = [
  {name: 'apples', quantity: 2},
  {name: 'bananas', quantity: 0},
  {name: 'cherries', quantity: 5}
];

const result = inventory.find(({ name }) => name === 'cherries');

console.log(result) // { name: 'cherries', quantity: 5 }

  1. Array.findIndex() fragt die erfüllten Bedingungen ab und gibt den entsprechenden Index zurück, andernfalls wird -1 zurückgegeben

Die Methode Array.findIndex() gibt den Index des ersten Elements im Array zurück, das die bereitgestellte Testfunktion erfüllt. Wenn das entsprechende Element nicht gefunden wird, wird -1 zurückgegeben (der Index beginnt bei 0).

const array1 = [5, 12, 8, 130, 44];

const isLargeNumber = (element) => element > 46;

console.log(array1.findIndex(isLargeNumber));
// Expected output: 3

const isLargeNumber = (element) => element > 144;

console.log(array1.findIndex(isLargeNumber));
// Expected output: -1

  1. Array.findLast() fragt die erfüllten Bedingungen ab und gibt den entsprechenden Index zurück, andernfalls wird undefiniert zurückgegeben

Die Methode findLast() gibt den Wert des letzten Elements im Array zurück, das die Bedingungen der bereitgestellten Testfunktion erfüllt. Wenn das entsprechende Element nicht gefunden wird, wird undefiniert zurückgegeben (der Index beginnt bei 0).

Beispiele sind wie folgt:

示例一：
const array1 = [5, 12, 50, 130, 44];

const found = array1.findLast((element) => element > 45);

console.log(found);
// Expected output: 130

示例二：
const inventory = [
  {name: 'apples', quantity: 2},
  {name: 'bananas', quantity: 0},
  {name: 'fish', quantity: 1},
  {name: 'cherries', quantity: 5}
];

// return true inventory stock is low
function isNotEnough(item) {
  return item.quantity < 2;
}

console.log(inventory.findLast(isNotEnough));
// { name: "fish", quantity: 1 }

  1. Array.findLastIndex() gibt den letzten Index zurück, der die Bedingung erfüllt, oder -1, wenn er nicht gefunden wird.

Die Methode Array.findLastIndex () gibt den Index des letzten Elements im Array zurück, das die bereitgestellte Testfunktionsbedingung erfüllt. Wenn das entsprechende Element nicht gefunden wird, wird -1 zurückgegeben. (Indizes beginnen bei 0)

Beispiele sind wie folgt:

示例一：
const array1 = [5, 12, 50, 130, 44];

const isLargeNumber = (element) => element > 45;

console.log(array1.findLastIndex(isLargeNumber));
// Expected output: 3
// Index of element with value: 130

示例二：
const fruits = ["apple", "banana", "cantaloupe", "blueberries", "grapefruit"];

const index = fruits.findLastIndex(fruit => fruit === "blueberries");

console.log(index); // 3
console.log(fruits[index]); // blueberries

  1. Array.flat() durchläuft das Array rekursiv

Die Methode Array.flat( Depth) durchläuft das Array rekursiv entsprechend einer spezifizierbaren Tiefe, führt alle Elemente mit den Elementen im durchquerten Unterarray in einem neuen Array zusammen und gibt es zurück.

Tiefe

Gibt die Tiefe der Struktur zum Extrahieren des verschachtelten Arrays an. Der Standardwert ist 1.

Beispiele sind wie folgt:

const arr1 = [0, 1, 2, [3, 4]];

console.log(arr1.flat());
// Expected output: Array [0, 1, 2, 3, 4]

const arr2 = [0, 1, 2, [[[3, 4]]]];

console.log(arr2.flat(2));
// Expected output: Array [0, 1, 2, Array [3, 4]]

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

  1. Array.forEach() Schleifenarray

Die Methode Array.forEach( element, index, array ) führt die angegebene Funktion einmal für jedes Element des Arrays aus

Element

Index

Array

Das aktuelle Element im Array, das verarbeitet wird.

Der Index des aktuellen Elements im Array, das verarbeitet wird.

Das Array, mit dem die forEach()-Methode arbeitet.

Beispiele sind wie folgt:

示例一：
const array1 = ['a', 'b', 'c'];

array1.forEach(element => console.log(element));

// Expected output: "a"
// Expected output: "b"
// Expected output: "c"

示例二:
const ratings = [5, 4, 5];
let sum = 0;

const sumFunction = async (a, b) => a + b;
ratings.forEach(async (rating) => {
  sum = await sumFunction(sum, rating);
});

console.log(sum);
// 期望的输出：14
// 实际的输出：0

  1. Array.from() erstellt eine neue, flache Kopie einer Array-Instanz wie eines Arrays oder iterierbaren Objekts.

Die Methode Array.from() erstellt eine neue, flache Kopie einer Array-Instanz aus einem Array-ähnlichen oder iterierbaren Objekt. Beispiele sind wie folgt:

示例一：
// 将string字符串转换为数组
Array.from('foo');
// [ "f", "o", "o" ]

示例二：
// 从set生成数组
const set = new Set(['foo', 'bar', 'baz', 'foo']);
Array.from(set);
// [ "foo", "bar", "baz" ]
// new Set可以去重

示例三：
// 从Map生成数组
const map = new Map([[1, 2], [2, 4], [4, 8]]);
Array.from(map);
// [[1, 2], [2, 4], [4, 8]]

const mapper = new Map([['1', 'a'], ['2', 'b']]);
Array.from(mapper.values());
// ['a', 'b'];

Array.from(mapper.keys());
// ['1', '2'];

示例四：
// 从类数组对象生成数组
function f() {
  return Array.from(arguments);
}

f(1, 2, 3);
// [ 1, 2, 3 ]

示例五： 
// 数组去重合并
function combine(){
    let arr = [].concat.apply([], arguments);  //没有去重复的新数组
    return Array.from(new Set(arr));
}

var m = [1, 2, 2], n = [2,3,3];
console.log(combine(m,n));                     // [1, 2, 3]

  1. Array.includes() ermittelt, ob das Array diesen Wert hat und gibt einen booleschen Wert zurück

Die Methode include( searchElement, fromIndex ) wird verwendet, um zu bestimmen, ob ein Array einen angegebenen Wert enthält. Je nach Situation gibt sie true zurück, wenn sie enthält, andernfalls gibt sie false zurück. Es können zwei Parameter übergeben werden

suchElement

fromIndex (optional)

Der zu findende Elementwert.

SearchElement wird beginnend mit dem Index fromIndex durchsucht. Wenn es sich um einen negativen Wert handelt, beginnt die Suche beim Index von array.length + fromIndex in aufsteigender Reihenfolge (auch wenn vom Absolutwert der fromIndex-Indizes vom Ende aus vorwärts gesprungen wird und dann rückwärts gesucht wird). Der Standardwert ist 0.

Beispiele sind wie folgt:

示例一：
const array1 = [1, 2, 3];

console.log(array1.includes(2));
// Expected output: true

const pets = ['cat', 'dog', 'bat'];

console.log(pets.includes('cat'));
// Expected output: true

console.log(pets.includes('at'));
// Expected output: false

示例二：
// 如果 fromIndex 大于等于数组的长度，则将直接返回 false，且不搜索该数组。
var arr = ['a', 'b', 'c'];

arr.includes('c', 3);   // false
arr.includes('c', 100); // false

  1. Array.indexOf() findet den ersten Wert, der die Anforderung erfüllt, und gibt den Index zurück

Die Methode Array.indexOf( searchElement, fromIndex ) gibt den ersten Index im Array zurück, in dem das angegebene Element gefunden werden kann, oder -1, wenn es nicht existiert. (Der zurückgegebene Index beginnt bei 0)

suchElement

fromIndex

Das zu findende Element.

Der Ort, an dem die Suche gestartet werden soll. Wenn der Indexwert größer oder gleich der Array-Länge ist, bedeutet dies, dass die Suche im Array nicht durchgeführt wird und -1 zurückgegeben wird. Wenn der im Parameter angegebene Indexwert ein negativer Wert ist, wird er als Offset zum Ende des Arrays behandelt, d. h. -1 bedeutet, dass mit dem letzten Element begonnen wird, -2 bedeutet, dass mit dem vorletzten Element begonnen wird, und so weiter . Hinweis: Wenn der im Parameter angegebene Indexwert ein negativer Wert ist, ändert sich die Suchreihenfolge nicht. Die Suchreihenfolge besteht weiterhin darin, das Array von vorne nach hinten zu durchsuchen. Wenn der Offset-Indexwert immer noch kleiner als 0 ist, wird das gesamte Array abgefragt. Der Standardwert ist 0.

Beispiele sind wie folgt:

示例一：
const 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

示例二：
const array = [2, 9, 9];
array.indexOf(2);     // 0
array.indexOf(7);     // -1
array.indexOf(9, 2);  // 2
array.indexOf(2, -1); // -1
array.indexOf(2, -3); // 0

示例三：
// 找出指定元素出现的所有位置
const indices = [];
const array = ['a', 'b', 'a', 'c', 'a', 'd'];
const element = 'a';
let idx = array.indexOf(element);
while (idx !== -1) {
  indices.push(idx);
  idx = array.indexOf(element, idx + 1);
}
console.log(indices);
// [0, 2, 4]

  1. Array.isArray() bestimmt, ob es sich um ein Array handelt, und der Rückgabewert ist ein boolescher Wert

Array.isArray(value) wird verwendet, um zu bestimmen, ob der übergebene Wert ein Array ist.

Rückgabewert: Gibt „true“ zurück, wenn es sich um ein Array handelt, andernfalls wird „false“ zurückgegeben

Wert

Der zu erkennende Wert

Beispiele sind wie folgt:

示例一：
// 下面的函数调用都返回 true
Array.isArray([]);
Array.isArray([1]);
Array.isArray(new Array());
Array.isArray(new Array('a', 'b', 'c', 'd'))
Array.isArray(new Array(3));
// 鲜为人知的事实：其实 Array.prototype 也是一个数组。
Array.isArray(Array.prototype);

// 下面的函数调用都返回 false
Array.isArray();
Array.isArray({});
Array.isArray(null);
Array.isArray(undefined);
Array.isArray(17);
Array.isArray('Array');
Array.isArray(true);
Array.isArray(false);
Array.isArray(new Uint8Array(32))
Array.isArray({ __proto__: Array.prototype });

  1. Array.join() konvertiert ein Array in einen String

Array.join(separator) 方法将一个数组（或一个类数组对象）的所有元素连接成一个字符串并返回这个字符串，用逗号或指定的分隔符字符串分隔。如果数组只有一个元素，那么将返回该元素而不使用分隔符。

separator

指定一个字符串来分隔数组的每个元素。如果需要，将分隔符转换为字符串。如果省略，数组元素用逗号（,）分隔。如果 separator 是空字符串（""），则所有元素之间都没有任何字符。

示例如下：

示例一：
const elements = ['Fire', 'Air', 'Water'];

console.log(elements.join());
// Expected output: "Fire,Air,Water"

console.log(elements.join(''));
// Expected output: "FireAirWater"

console.log(elements.join('-'));
// Expected output: "Fire-Air-Water"

示例二：
const a = ['Wind', 'Water', 'Fire'];
a.join();      // 'Wind,Water,Fire'
a.join(', ');  // 'Wind, Water, Fire'
a.join(' + '); // 'Wind + Water + Fire'
a.join('');    // 'WindWaterFire'

  1. Array.keys() 返回数组的下标

Array,keys() 方法返回一个包含数组中每个索引键的 Array Iterator 对象。

示例如下：

示例一:
const array1 = ['a', 'b', 'c'];
const iterator = array1.keys();

for (const key of iterator) {
  console.log(key);
}

// Expected output: 0
// Expected output: 1
// Expected output: 2

  1. Array.lastIndexOf() 查找指定元素，返回最后一个找到的下标

Array.lastIndexOf(searchElement, fromIndex) 方法返回指定元素（也即有效的 JavaScript 值或变量）在数组中的最后一个的索引，如果不存在则返回 -1。从数组的后面向前查找，从 fromIndex 处开始。(返回的下标从0开始)

searchElement

被查找的元素。

fromIndex

从此位置开始逆向查找。默认为数组的长度减 1(arr.length - 1)，即整个数组都被查找。如果该值大于或等于数组的长度，则整个数组会被查找。如果为负值，将其视为从数组末尾向前的偏移。即使该值为负，数组仍然会被从后向前查找。如果该值为负时，其绝对值大于数组长度，则方法返回 -1，即数组不会被查找。

示例如下：

示例一：
const animals = ['Dodo', 'Tiger', 'Penguin', 'Dodo'];

console.log(animals.lastIndexOf('Dodo'));
// Expected output: 3

console.log(animals.lastIndexOf('Tiger'));
// Expected output: 1

示例二：
var array = [2, 5, 9, 2];
var index = array.lastIndexOf(2);
// index is 3
index = array.lastIndexOf(7);
// index is -1
index = array.lastIndexOf(2, 3);
// index is 3
index = array.lastIndexOf(2, 2);
// index is 0
index = array.lastIndexOf(2, -2);
// index is 0
index = array.lastIndexOf(2, -1);
// index is 3

示例三：
var array = [2, 5, 9, 2];
var index = array.lastIndexOf(2);
// index is 3
index = array.lastIndexOf(7);
// index is -1
index = array.lastIndexOf(2, 3);
// index is 3
index = array.lastIndexOf(2, 2);
// index is 0
index = array.lastIndexOf(2, -2);
// index is 0
index = array.lastIndexOf(2, -1);
// index is 3

  1. Array.map() 遍历数组

Array.map(currentValue, index, array) 方法创建一个新数组，这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成。

currentValue

callbackFn 数组中正在处理的当前元素。

index

callbackFn 数组中正在处理的当前元素的索引

array

map 方法调用的数组。

示例如下：

示例一：
const 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]

array1.map((item,index,arr) => {
  console.log(item,index,arr)
})
// 1 0 Array [1, 4, 9, 16]
// 4 1 Array [1, 4, 9, 16]
// 9 2 Array [1, 4, 9, 16]
// 16 3 Array [1, 4, 9, 16]

  1. Array.pop() 从一个数组中删除并返回最后一个元素。

Array.pop() 方法从数组中删除最后一个元素，并返回该元素的值。如果你在一个空数组上调用 pop()，它将返回 undefined。此方法会更改数组的长度(会改变原数组)。

示例如下：

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

示例二：
const myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];

const popped = myFish.pop();

console.log(myFish); // ['angel', 'clown', 'mandarin']

console.log(popped); // 'sturgeon'

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/push

Supongo que te gusta

Origin blog.csdn.net/zzll1216/article/details/129688379
Recomendado
Clasificación
Diario
Más
2024-05-18(30)
2024-05-17(4)
2024-05-16(22)
2024-05-15(5)
2024-05-14(10)
2024-05-13(7)
2024-05-12(22)
2024-05-11(31)
2024-05-10(32)
2024-05-09(31)

Code World

© 2018 codetd.com