Heim Web-Frontend js-Tutorial JavaScript-Arrays mit Sammlungen

JavaScript-Arrays mit Sammlungen

Mar 14, 2018 am 10:27 AM
javascript js 集合

Dieses Mal zeige ich Ihnen die Arrays, die Sammlungen in JavaScript verwenden, und welche Vorsichtsmaßnahmen bei der Verwendung von JavaScript-Arrays Sammlungen gelten. Hier sind die praktischen Fälle . Werfen wir einen Blick darauf.

1.join() Wandelt alle Elemente im Array in Strings um und verbindet sie miteinander.

var a=[1,2,3,4];
a.join(); //"1,2,3,4"
Nach dem Login kopieren

2.reverser() Kehrt die Reihenfolge der Elemente im Array um und gibt die umgekehrte Reihenfolge zurück Ordnungsarray.

var a[1,2,3,4];
a.reverse(); //[4,3,2,1]
Nach dem Login kopieren

3.sort() Sortiert die Elemente im Array und gibt das sortierte Array zurück.
Wenn sort() ohne Argumente aufgerufen wird, werden die Array-Elemente in alphabetischer Reihenfolge sortiert.

var a=['ant','Bug','cat','Dog'];
a.sort(); //["Bug", "Dog", "ant", "cat"]
a.sort(function(s,t){
   var s1=s.toLowerCase();
   var t1=t.toLowerCase();   if(s1<t1) return -1;   if(s1>t1) return 1;   return 0});//["ant", "BUg", "cat", "Dog"]
Nach dem Login kopieren

4.concat() erstellt ein neues Array und gibt es zurück, dessen Elemente die Elemente des ursprünglichen Arrays, das concat() aufgerufen hat, und jeden Parameter von concat() enthalten. Wenn eines dieser Argumente selbst ein Array ist, werden die Array-Elemente verkettet, nicht die Arrays selbst.

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

5.slice() Gibt ein Slice oder Subarray des angegebenen Arrays zurück. Seine beiden Parameter geben die Start- bzw. Endposition des Fragments an. Das zurückgegebene Array enthält alle Datenelemente zwischen der durch das erste Argument angegebenen Position und allen bis zu der durch das zweite Argument angegebenen Position, jedoch nicht einschließlich dieser.
Wenn nur ein Parameter angegeben wird, enthält das zurückgegebene Array alle Elemente vom Anfang bis zum Ende des Arrays.
Wenn im Parameter eine negative Zahl erscheint, stellt sie die Position relativ zum letzten Element im Array dar. Beispiel: Parameter -1 gibt das letzte Element an und -3 gibt das drittletzte Element an.
Beachten Sie, dass Slice() das aufrufende Array nicht ändert.

var a=[1,2,3,4,5];a.slice(0,2);//[1, 2]a.slice(3);//[4, 5]a.slice(1,-1);//[2, 3, 4]a.slice(-3,-2);//[3]
Nach dem Login kopieren

6.splice() Eine allgemeine Methode zum Einfügen oder Löschen von Elementen in einem Array. Im Gegensatz zu Slice() und Concat() ändert Splice() das aufrufende Array. Hinweis: splice() und Slice() haben sehr ähnliche Namen, ihre Funktionen unterscheiden sich jedoch grundlegend.
splice() kann Elemente aus einem Array löschen, Elemente in ein Array einfügen oder beide Vorgänge gleichzeitig ausführen. Bei Array-Elementen nach dem Einfüge- oder Löschpunkt werden die Indexwerte nach Bedarf erhöht oder verringert, sodass der Rest des Arrays zusammenhängend bleibt. Der erste Parameter von splice() gibt die Startposition des Einfügens und/oder Löschens an. Der zweite Parameter gibt die Anzahl der Elemente an, die aus dem Array gelöscht werden sollen. Wenn der zweite Parameter weggelassen wird, werden alle Elemente vom Startpunkt bis zum Ende des Arrays gelöscht. splice() gibt ein Array gelöschter Elemente zurück oder ein leeres Array, wenn keine Elemente gelöscht wurden.

var a=[1,2,3,4,5,6,7,8];a.splice(4);//返回[[5, 6, 7, 8]],a是[1, 2, 3, 4]a.splice(1,2)//返回[2, 3],a是[1, 4, 5, 6, 7, 8]a.splice(1,1);//返回[2],a是 [1, 3, 4, 5, 6, 7, 8]
Nach dem Login kopieren

7.push() und pop()
push() fügt ein oder mehrere Elemente am Ende des Arrays hinzu.
pop() löscht das letzte Element des Arrays.

8.unshift() und shift()
unshift() fügt ein oder mehrere Elemente zum Kopf des Arrays hinzu.
shift() löscht das erste Element des Arrays.

9.toString() und toLocaleString()

[1,2,3].toString();//"1,2,3"[1,[2,&#39;c&#39;]].toString();//"1,2,c"
Nach dem Login kopieren

toLocaleString() ist die lokalisierte Version der toString()-Methode. Es ruft die toLocaleString()-Methode des Elements auf, um jedes Array-Element in einen String zu konvertieren, und verkettet diese Strings mithilfe lokalisierter Trennzeichen, um den endgültigen String zu generieren.

10.forEach() durchläuft das Array vom Anfang bis zum Ende und ruft die angegebene Funktion für jedes Element auf.
Die Funktion wird als erstes Argument an forEach() übergeben und dann ruft forEach() die Funktion mit drei Argumenten auf: dem Array-Element, dem Index des Elements und dem Array selbst.

var data=[1,2,3,4,5];//计算数组元素的和值var sum=0;
data.forEach(function(value){
sum+=value
});  
sum //15//每个数组元素的值加1data.forEach(function(value,index,arr){
arr[index]=value+1;
});
data  //[2, 3, 4, 5, 6]
Nach dem Login kopieren

11.map() übergibt jedes Element des aufgerufenen Arrays an die angegebene Funktion und gibt ein Array zurück, das den Rückgabewert der -Funktion enthält.
Hinweis: Die an mao() übergebene Funktion sollte einen Rückgabewert haben. map() gibt ein neues Array zurück und verändert das ursprüngliche Array nicht. Wenn das ursprüngliche Array ein Sparse-Array ist, wird das Sparse-Array auf die gleiche Weise zurückgegeben, mit derselben Länge und denselben fehlenden Elementen.

var a=[1,2,3];var b=a.map(function(value){return value*value;
});
b// [1, 4, 9]
Nach dem Login kopieren

12 filter() gibt die Array-Elemente zurück, die die Bedingungen erfüllen

var a=[1,2,3,5];var b=a.filter(function(value){return value>2;
});
b  // [3, 5]
Nach dem Login kopieren

13.every() und einige()
logische Beurteilungen des Arrays, sie gelten zu den Array-Elementen Die angegebene Funktion wird beurteilt und gibt true oder false zurück.
every() gibt true zurück, wenn alle Elemente im Array die Filterbedingungen erfüllen.
some() gibt true zurück, wenn es Elemente im Array gibt, die die Filterbedingungen erfüllen ( ) und ReduceRight()

verwenden die angegebene Funktion, um Array-Elemente zu kombinieren, um einen einzelnen Wert zu generieren.
var a =[1,2,3,4,5];
a.every(function(value){return value<10;
})  //true a中所有元素都小于10a.every(function(value){return value%2===0;
});//false a中不是所有元素都是偶数a.some(function(value){return value%2===0;
})//true a中存在偶数
Nach dem Login kopieren
reduce() erfordert zwei Parameter.

Die erste ist die Funktion, die die Vereinfachungsoperation durchführt. Die Aufgabe der Vereinfachungsfunktion besteht darin, zwei Werte auf irgendeine Weise zu einem Wert zu kombinieren oder zu vereinfachen und den vereinfachten Wert zurückzugeben. Der zweite (optionale) Parameter ist ein Anfangswert, der an die Funktion übergeben wird.
reduceRight() wird auf die gleiche Weise wie Reduce() verwendet, außer dass es das Array entsprechend dem Array-Index von hoch nach niedrig (von rechts nach links) verarbeitet.


indexOf() und lastIndexOf()

indexOf() Der Index des ersten qualifizierenden Werts, falls nicht, gibt -1 zurück.
var a=[1,2,3,4,5];var sum=a.reduce(function(x,y){return x+y;},0);
sum //15  数组求和var max=a.reduce(function(x,y){return x>y?x:y});
max // 5求最大值
Nach dem Login kopieren
lastIndexOf() der letzte qualifizierende Wert. Index, falls nicht , gibt -1 zurück


Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Detaillierte Erklärung von Require.js

So implementieren Sie eine Knotenverbindung zu MySQL

So verwenden Sie reguläre JS-Ausdrücke

Javascripts Singleton-Muster

Das obige ist der detaillierte Inhalt vonJavaScript-Arrays mit Sammlungen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Beste grafische Einstellungen
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. So reparieren Sie Audio, wenn Sie niemanden hören können
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Chat -Befehle und wie man sie benutzt
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Empfohlen: Ausgezeichnetes JS-Open-Source-Projekt zur Gesichtserkennung und -erkennung Empfohlen: Ausgezeichnetes JS-Open-Source-Projekt zur Gesichtserkennung und -erkennung Apr 03, 2024 am 11:55 AM

Die Technologie zur Gesichtserkennung und -erkennung ist bereits eine relativ ausgereifte und weit verbreitete Technologie. Derzeit ist JS die am weitesten verbreitete Internetanwendungssprache. Die Implementierung der Gesichtserkennung und -erkennung im Web-Frontend hat im Vergleich zur Back-End-Gesichtserkennung Vor- und Nachteile. Zu den Vorteilen gehören die Reduzierung der Netzwerkinteraktion und die Echtzeiterkennung, was die Wartezeit des Benutzers erheblich verkürzt und das Benutzererlebnis verbessert. Die Nachteile sind: Es ist durch die Größe des Modells begrenzt und auch die Genauigkeit ist begrenzt. Wie implementiert man mit js die Gesichtserkennung im Web? Um die Gesichtserkennung im Web zu implementieren, müssen Sie mit verwandten Programmiersprachen und -technologien wie JavaScript, HTML, CSS, WebRTC usw. vertraut sein. Gleichzeitig müssen Sie auch relevante Technologien für Computer Vision und künstliche Intelligenz beherrschen. Dies ist aufgrund des Designs der Webseite erwähnenswert

Warum ist es schwierig, sammlungsähnliche Funktionen in der Go-Sprache zu implementieren? Warum ist es schwierig, sammlungsähnliche Funktionen in der Go-Sprache zu implementieren? Mar 24, 2024 am 11:57 AM

Es ist schwierig, sammlungsähnliche Funktionen in der Go-Sprache zu implementieren, was viele Entwickler beschäftigt. Im Vergleich zu anderen Programmiersprachen wie Python oder Java verfügt die Go-Sprache nicht über integrierte Sammlungstypen wie Set, Map usw., was Entwickler bei der Implementierung von Sammlungsfunktionen vor einige Herausforderungen stellt. Schauen wir uns zunächst an, warum es schwierig ist, sammlungsähnliche Funktionen direkt in der Go-Sprache zu implementieren. In der Go-Sprache sind die am häufigsten verwendeten Datenstrukturen Slice und Map. Sie können jedoch sammlungsähnliche Funktionen ausführen

PHP- und JS-Entwicklungstipps: Beherrschen Sie die Methode zum Zeichnen von Aktienkerzendiagrammen PHP- und JS-Entwicklungstipps: Beherrschen Sie die Methode zum Zeichnen von Aktienkerzendiagrammen Dec 18, 2023 pm 03:39 PM

Mit der rasanten Entwicklung der Internetfinanzierung sind Aktieninvestitionen für immer mehr Menschen zur Wahl geworden. Im Aktienhandel sind Kerzendiagramme eine häufig verwendete Methode der technischen Analyse. Sie können den sich ändernden Trend der Aktienkurse anzeigen und Anlegern helfen, genauere Entscheidungen zu treffen. In diesem Artikel werden die Entwicklungskompetenzen von PHP und JS vorgestellt, der Leser wird zum Verständnis des Zeichnens von Aktienkerzendiagrammen geführt und es werden spezifische Codebeispiele bereitgestellt. 1. Aktien-Kerzendiagramme verstehen Bevor wir uns mit dem Zeichnen von Aktien-Kerzendiagrammen befassen, müssen wir zunächst verstehen, was ein Kerzendiagramm ist. Candlestick-Charts wurden von den Japanern entwickelt

Einfaches JavaScript-Tutorial: So erhalten Sie den HTTP-Statuscode Einfaches JavaScript-Tutorial: So erhalten Sie den HTTP-Statuscode Jan 05, 2024 pm 06:08 PM

JavaScript-Tutorial: So erhalten Sie HTTP-Statuscode. Es sind spezifische Codebeispiele erforderlich. Vorwort: Bei der Webentwicklung ist häufig die Dateninteraktion mit dem Server erforderlich. Bei der Kommunikation mit dem Server müssen wir häufig den zurückgegebenen HTTP-Statuscode abrufen, um festzustellen, ob der Vorgang erfolgreich ist, und die entsprechende Verarbeitung basierend auf verschiedenen Statuscodes durchführen. In diesem Artikel erfahren Sie, wie Sie mit JavaScript HTTP-Statuscodes abrufen und einige praktische Codebeispiele bereitstellen. Verwenden von XMLHttpRequest

Die Beziehung zwischen js und vue Die Beziehung zwischen js und vue Mar 11, 2024 pm 05:21 PM

Die Beziehung zwischen js und vue: 1. JS als Eckpfeiler der Webentwicklung; 2. Der Aufstieg von Vue.js als Front-End-Framework; 3. Die komplementäre Beziehung zwischen JS und Vue; Vue.

Ein praktischer Leitfaden zur Where-Methode in Laravel-Sammlungen Ein praktischer Leitfaden zur Where-Methode in Laravel-Sammlungen Mar 10, 2024 pm 04:36 PM

Praktischer Leitfaden zur Where-Methode in Laravel-Sammlungen Während der Entwicklung des Laravel-Frameworks stellen Sammlungen eine sehr nützliche Datenstruktur dar, die umfangreiche Methoden zur Datenbearbeitung bereitstellt. Unter diesen ist die Where-Methode eine häufig verwendete Filtermethode, mit der Elemente in einer Sammlung basierend auf bestimmten Bedingungen gefiltert werden können. In diesem Artikel wird die Verwendung der Where-Methode in Laravel-Sammlungen vorgestellt und ihre Verwendung anhand spezifischer Codebeispiele demonstriert. 1. Grundlegende Verwendung der Where-Methode

So erhalten Sie auf einfache Weise HTTP-Statuscode in JavaScript So erhalten Sie auf einfache Weise HTTP-Statuscode in JavaScript Jan 05, 2024 pm 01:37 PM

Einführung in die Methode zum Abrufen des HTTP-Statuscodes in JavaScript: Bei der Front-End-Entwicklung müssen wir uns häufig mit der Interaktion mit der Back-End-Schnittstelle befassen, und der HTTP-Statuscode ist ein sehr wichtiger Teil davon. Das Verstehen und Abrufen von HTTP-Statuscodes hilft uns, die von der Schnittstelle zurückgegebenen Daten besser zu verarbeiten. In diesem Artikel wird erläutert, wie Sie mithilfe von JavaScript HTTP-Statuscodes erhalten, und es werden spezifische Codebeispiele bereitgestellt. 1. Was ist ein HTTP-Statuscode? HTTP-Statuscode bedeutet, dass der Dienst den Dienst anfordert, wenn er eine Anfrage an den Server initiiert

Java Iterator vs. Iterable: Ein Schritt zum Schreiben eleganten Codes Java Iterator vs. Iterable: Ein Schritt zum Schreiben eleganten Codes Feb 19, 2024 pm 02:54 PM

Iterator-Schnittstelle Die Iterator-Schnittstelle ist eine Schnittstelle zum Durchlaufen von Sammlungen. Es bietet mehrere Methoden, darunter hasNext(), next() und remove(). Die Methode hasNext() gibt einen booleschen Wert zurück, der angibt, ob es ein nächstes Element in der Sammlung gibt. Die Methode next() gibt das nächste Element in der Sammlung zurück und entfernt es aus der Sammlung. Die Methode „remove()“ entfernt das aktuelle Element aus der Sammlung. Das folgende Codebeispiel zeigt, wie die Iterator-Schnittstelle zum Durchlaufen einer Sammlung verwendet wird: Listnames=Arrays.asList("John","Mary","Bob");Iterator

See all articles