Einführung in unbekannte Array-Methoden in JavaScript

In diesem Artikel werden hauptsächlich einige Array-Methoden vorgestellt, die Sie nicht über JavaScript kennen. Freunde in Not können sich darauf beziehen

concat

var a = [1,2,3];
a.concat([4,5,6],7,8);//[1,2,3,4,5,6,7,8]

Beachten Sie, dass sich das Array a nicht geändert hat, sondern nur ein neues Array zurückgegeben wird.

copyWithin

Es akzeptiert drei Parameter.

Ziel (erforderlich): Beginnen Sie mit dem Ersetzen der Daten ab dieser Position.
Start (optional): Beginnen Sie mit dem Lesen der Daten ab dieser Position, der Standardwert ist 0. Wenn es sich um einen negativen Wert handelt, stellt er den Kehrwert dar.
Ende (optional): Stoppen Sie das Lesen von Daten, bevor diese Position erreicht wird. Der Standardwert entspricht der Array-Länge. Wenn es sich um einen negativen Wert handelt, stellt er den Kehrwert dar.

Diese drei Parameter sollten alle numerische Werte sein. Wenn nicht, werden sie automatisch in numerische Werte umgewandelt

// 将 3 号位复制到 0 号位 
[1, 2, 3, 4, 5].copyWithin(0, 3, 4) 
// [4, 2, 3, 4, 5] 
// -2 相当于 3 号位， -1 相当于 4 号位 
[1, 2, 3, 4, 5].copyWithin(0, -2, -1) 
// [4, 2, 3, 4, 5] 
// 将 3 号位复制到 0 号位 
[].copyWithin.call({length: 5, 3: 1}, 0, 3) 
// {0: 1, 3: 1, length: 5} 
// 将 2 号位到数组结束，复制到 0 号位 
var i32a = new Int32Array([1, 2, 3, 4, 5]); 
i32a.copyWithin(0, 2); 
// Int32Array [3, 4, 5, 4, 5] 
// 对于没有部署 TypedArray 的 copyWithin 方法的平台 
// 需要采用下面的写法 
[].copyWithin.call(new Int32Array([1, 2, 3, 4, 5]), 0, 3, 4); 
// Int32Array [4, 2, 3, 4, 5]

Einträge

var a = [1,2,3];
var en = a.entries();
en.next().value;//[0.1];

Gibt ein iterierbares Objekt zurück

jedes

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

Jedes Element gibt durch die Testfunktion true zurück, andernfalls ist es wahr gibt false zurück

fill

[1, 2, 3].fill(4)   // [4, 4, 4]
[1, 2, 3].fill(4, 1)   // [1, 4, 4]
[1, 2, 3].fill(4, 1, 2)  // [1, 4, 3]
[1, 2, 3].fill(4, 1, 1)  // [1, 2, 3]
[1, 2, 3].fill(4, -3, -2) // [4, 2, 3]
[1, 2, 3].fill(4, NaN, NaN) // [1, 2, 3]
Array(3).fill(4);   // [4, 4, 4]
[].fill.call({length: 3}, 4) // {0: 4, 1: 4, 2: 4, length: 3}

Was sich ändert, ist das Array selbst

Filter

function isBigEnough(value) {
 return value >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]

Gibt ein neues Array zurück

find

Die Methode gibt das erste Element in zurück das Array, das die bereitgestellte Testfunktion erfüllt. Der Wert eines Elements. Andernfalls geben Sie undefind

function isBigEnough(element) {
 return element >= 15;
}
[12, 5, 8, 130, 44].find(isBigEnough); // 130

findIndex

zurück. Die Methode findIndex() gibt den Index des ersten Elements im Array zurück, das die bereitgestellten Anforderungen erfüllt Testfunktion. Andernfalls wird -1 zurückgegeben.

function isBigEnough(element) {
 return element >= 15;
}
[12, 5, 8, 130, 44].findIndex(isBigEnough); // 3

forEach

let a = ['a', 'b', 'c'];
a.forEach(function(element) {
 console.log(element);
});
// a
// b
// c
//语法
array.forEach(callback(currentValue, index, array){
 //do something
}, this)
array.forEach(callback[, thisArg])

Rückruf

为数组中每个元素执行的函数，该函数接收三个参数：
currentValue(当前值)
数组中正在处理的当前元素。
index(索引)
数组中正在处理的当前元素的索引。
array
forEach()方法正在操作的数组。
thisArg可选
可选参数。当执行回调 函数时用作this的值(参考对象)

Hinweis: Es gibt keine Möglichkeit zum Abbrechen oder aus der forEach-Schleife ausbrechen, es sei denn, es wird eine Ausnahme ausgelöst. Wenn Sie dies benötigen, ist die Verwendung der Methode forEach() falsch und Sie können stattdessen eine einfache Schleife verwenden. Wenn Sie testen, ob ein Element in einem Array eine bestimmte Bedingung erfüllt und einen booleschen Wert zurückgeben muss, verwenden Sie Array.every,Array.some. Sofern verfügbar, können auch die neuen Methoden find() oder findIndex() zum vorzeitigen Abbruch von Wahrheitstests verwendet werden.

include

arr.includes(searchElement)
arr.includes(searchElement, fromIndex)

Parameter

searchElement

Der zu findende Elementwert.

fromIndex

Optional

Starten Sie die Suche nach searchElement

an diesem Index. Wenn negativ, beginnt die Suche beim Index von array.length + fromIndex in aufsteigender Reihenfolge. Der Standardwert ist 0.

Rückgabewert

Ein boolescher Wert.

[1, 2, 3].includes(2);  // true
[1, 2, 3].includes(4);  // false
[1, 2, 3].includes(3, 3); // false
[1, 2, 3].includes(3, -1); // true
[1, 2, NaN].includes(NaN); // true

indexOf

arr.indexOf(searchElement)
arr.indexOf(searchElement[, fromIndex = 0])

Parameter

searchElement

Das zu suchende Element

fromIndex

Die Position, an der mit der Suche begonnen 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 vom 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, wird das Array weiterhin von vorne nach hinten abgefragt. Wenn der Offset-Indexwert immer noch kleiner als 0 ist, wird das gesamte Array abgefragt. Sein Standardwert ist 0.

Rückgabewert

Die Indexposition des ersten gefundenen Elements im Array; wenn nicht gefunden, wird -1 zurückgegeben

let a = [2, 9, 7, 8, 9]; 
a.indexOf(2); // 0 
a.indexOf(6); // -1
a.indexOf(7); // 2
a.indexOf(8); // 3
a.indexOf(9); // 1
if (a.indexOf(3) === -1) {
 // element doesn't exist in array
}

< Die Methode „keys()“ gibt eine neue Array-Iteration zurück. Die Methode „map()“ erstellt ein neues Array, wobei das Ergebnis das Ergebnis des Aufrufs einer bereitgestellten Funktion für jedes Element im Array ist. Callback

Eine Funktion, die mithilfe von drei Parametern neue Array-Elemente generiert:

str = arr.join()
// 默认为 ","
str = arr.join("")
// 分隔符 === 空字符串 ""
str = arr.join(separator)
// 分隔符

currentValueDer erste Parameter des Callbacks im Array Das aktuell verarbeitete Element. index

Der zweite Parameter des Rückrufs, der Index des aktuellen Elements, das im Array verarbeitet wird.

let arr = ["a", "b", "c"];
let iterator = arr.keys();
// undefined
console.log(iterator);
// Array Iterator {}
console.log(iterator.next()); 
// Object {value: 0, done: false}
console.log(iterator.next()); 
// Object {value: 1, done: false}
console.log(iterator.next()); 
// Object {value: 2, done: false}
console.log(iterator.next()); 
// Object {value: undefined, done: true}

Array

Der dritte Parameter des Rückrufs, das Array, in dem die Map-Methode aufgerufen wird. thisArg

Optional. Der Wert, der beim Ausführen der Rückruffunktion verwendet wird.

Rückgabewert

let array = arr.map(function callback(currentValue, index, array) { 
 // Return element for new_array 
}[, thisArg])
let numbers = [1, 5, 10, 15];
let doubles = numbers.map((x) => {
 return x * 2;
});
// doubles is now [2, 10, 20, 30]
// numbers is still [1, 5, 10, 15]
let numbers = [1, 4, 9];
let roots = numbers.map(Math.sqrt);
// roots is now [1, 2, 3]
// numbers is still [1, 4, 9]

Ein neues Array, jedes Element ist das Ergebnis der Rückruffunktion. Die Methode pop() entfernt das letzte Element aus dem Array und gibt den Wert des Elements zurück. Diese Methode ändert die Länge des Arrays. Die

push()-Methode fügt ein oder mehrere Elemente am Ende des Arrays hinzu und gibt die neue Länge des Arrays zurück.

arr.push(element1, ..., elementN)

Zwei Arrays zusammenführen

In diesem Beispiel wird apply() verwendet, um alle Elemente des zweiten Arrays hinzuzufügen.

Beachten Sie, dass Sie diese Methode nicht zum Zusammenführen von Arrays verwenden, wenn das zweite Array (z. B. „moreVegs“ im Beispiel) zu groß ist, da die Anzahl der Parameter, die eine Funktion akzeptieren kann, tatsächlich begrenzt ist. Einzelheiten finden Sie in den Methoden apply()

reduce und ReduceRight

reduce() für jedes Element im Akkumulator und Array (von links nach rechts) Wenden Sie eine Funktion an, um es auf einen einzelnen Wert zu reduzieren.

array.reduce(function(accumulator, currentValue, currentIndex, array), initialValue)
var total = [0, 1, 2, 3].reduce(function(sum, value) {
 return sum + value;
}, 0);
// total is 6
var flattened = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) {
 return a.concat(b);
}, []);
// flattened is [0, 1, 2, 3, 4, 5]

callback

执行数组中每个值的函数，包含四个参数

accumulator

上一次调用回调返回的值，或者是提供的初始值（initialValue）

currentValue

数组中正在处理的元素

currentIndex

数据中正在处理的元素索引，如果提供了 initialValue ，从0开始；否则从1开始

array

调用 reduce 的数组

initialValue

可选项，其值用于第一次调用 callback 的第一个参数。如果没有设置初始值，则将数组中的第一个元素作为初始值。空数组调用reduce时没有设置初始值将会报错。

PS: 与 reduceRight()和reduce() 的执行方向相反

reverse

reverse 方法颠倒数组中元素的位置，并返回该数组的引用。

shift与unshift

shift() 方法从数组中删除第一个元素，并返回该元素的值。此方法更改数组的长度。

unshift() 方法将一个或多个元素添加到数组的开头，并返回新数组的长度。

slice

slice() 方法返回一个从开始到结束（不包括结束）选择的数组的一部分浅拷贝到一个新数组对象。原始数组不会被修改。

arr.slice();
//[0,end];
arr.slice(start);
//[start,end];
arr.slice(start,end);
//[start,end];

slice不修改原数组，只会返回一个浅复制了原数组中的元素的一个新数组。原数组的元素会按照下述规则拷贝：

如果该元素是个对象引用 （不是实际的对象），slice会拷贝这个对象引用到新的数组里。两个对象引用都引用了同一个对象。如果被引用的对象发生改变，则新的和原来的数组中的这个元素也会发生改变。

对于字符串、数字及布尔值来说不是String、Number或者Boolean，slice会拷贝这些值到新的数组里。在别的数组里修改这些字符串或数字或是布尔值，将不会影响另一个数组。

如果向两个数组任一中添加了新元素，则另一个不会受到影响

some

some() 方法测试数组中的某些元素是否通过由提供的函数实现的测试。

const isBiggerThan10 = (element, index, array) => {
 return element > 10;
}
[2, 5, 8, 1, 4].some(isBiggerThan10); 
// false
[12, 5, 8, 1, 4].some(isBiggerThan10); 
// true

toLocaleString与toString

toLocaleString() 返回一个字符串表示数组中的元素。数组中的元素将使用各自的 toLocaleString 方法转成字符串，这些字符串将使用一个特定语言环境的字符串（例如一个逗号 ","）隔开。

var number = 1337;
var date = new Date();
var myArr = [number, date, "foo"];
var str = myArr.toLocaleString(); 
console.log(str); 
// 输出 "1,337,2017/8/13 下午8:32:24,foo"
// 假定运行在中文（zh-CN）环境，北京时区
var a=1234
a.toString()
//"1234"
a.toLocaleString()
//"1,234"
//当数字是四位及以上时，toLocaleString()会让数字三位三位一分隔，像我们有时候数字也会三位一个分号
var sd=new Date()
sd
//Wed Feb 15 2017 11:21:31 GMT+0800 (CST)
sd.toLocaleString()
//"2017/2/15 上午11:21:31"
sd.toString()
//"Wed Feb 15 2017 11:21:31 GMT+0800 (CST)"

splice

splice() 方法通过删除现有元素和/或添加新元素来更改一个数组的内容。

array.splice(start)
array.splice(start, deleteCount) 
array.splice(start, deleteCount, item1, item2, ...)

start

指定修改的开始位置（从0计数）。如果超出了数组的长度，则从数组末尾开始添加内容；如果是负值，则表示从数组末位开始的第几位（从1计数）。

deleteCount 可选

整数，表示要移除的数组元素的个数。如果 deleteCount 是 0，则不移除元素。这种情况下，至少应添加一个新元素。如果 deleteCount 大于start 之后的元素的总数，则从 start 后面的元素都将被删除（含第 start 位）。

如果deleteCount被省略，则其相当于(arr.length - start)。

item1, item2, ... 可选

要添加进数组的元素,从start 位置开始。如果不指定，则 splice() 将只删除数组元素。

返回值

由被删除的元素组成的一个数组。如果只删除了一个元素，则返回只包含一个元素的数组。如果没有删除元素，则返回空数组。

Das obige ist der detaillierte Inhalt vonEinführung in unbekannte Array-Methoden in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!