Maison interface Web js tutoriel Tableaux JavaScript utilisant des collections

Tableaux JavaScript utilisant des collections

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

Cette fois je vais vous présenter les tableaux utilisant des collections en JavaScript, quelles sont les précautions lors de l'utilisation de tableaux JavaScript collections, voici des cas pratiques, jetons un coup d'œil ensemble. Jetez un œil.

1.join() Convertit tous les éléments du tableau en chaînes et joignez-les ensemble

var a=[1,2,3,4];
a.join(); //"1,2,3,4"
Copier après la connexion

2.reverser() Inverse l'ordre des éléments du tableau et renvoie l'inverse tableau de commande.

var a[1,2,3,4];
a.reverse(); //[4,3,2,1]
Copier après la connexion

3.sort() Trie les éléments du tableau et renvoie le tableau trié.
Lorsque sort() est appelé sans arguments, les éléments du tableau sont triés par ordre alphabétique.

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"]
Copier après la connexion

4.concat() crée et renvoie un nouveau tableau dont les éléments incluent les éléments du tableau d'origine qui a appelé concat() et chaque paramètre de concat(). Si l'un de ces arguments est lui-même un tableau, les éléments du tableau sont concaténés, pas les tableaux eux-mêmes.

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]]
Copier après la connexion

5.slice() renvoie une tranche ou un sous-tableau du tableau spécifié. Ses deux paramètres précisent respectivement les positions de début et de fin du fragment. Le tableau renvoyé contient tous les éléments de données compris entre la position spécifiée par le premier argument et jusqu'à la position spécifiée par le deuxième argument, mais non incluse.
Si un seul paramètre est spécifié, le tableau renvoyé contient tous les éléments du début à la fin du tableau.
Si un nombre négatif apparaît dans le paramètre, il représente la position par rapport au dernier élément du tableau. Par exemple : le paramètre -1 spécifie le dernier élément et -3 spécifie l'avant-dernier élément.
Notez que slice() ne modifie pas le tableau appelant.

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]
Copier après la connexion

6.splice() Une méthode générale pour insérer ou supprimer des éléments dans un tableau. Contrairement à slice() et concat(), splice() modifie le tableau appelant. Remarque : splice() et slice() ont des noms très similaires, mais leurs fonctions sont essentiellement différentes.
splice() peut supprimer des éléments d'un tableau, insérer des éléments dans un tableau ou effectuer les deux opérations simultanément. Les éléments du tableau après le point d'insertion ou de suppression voient leurs valeurs d'index augmentées ou diminuées si nécessaire, de sorte que le reste du tableau reste contigu. Le premier paramètre de splice() spécifie la position de départ de l'insertion et/ou de la suppression. Le deuxième paramètre spécifie le nombre d'éléments qui doivent être supprimés du tableau. Si le deuxième paramètre est omis, tous les éléments du point de départ à la fin du tableau seront supprimés. splice() renvoie un tableau d'éléments supprimés, ou un tableau vide si aucun élément n'a été supprimé.

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]
Copier après la connexion

7.push() et pop()
push() ajoute un ou plusieurs éléments à la fin du tableau.
pop() supprime le dernier élément du tableau.

8.unshift() et shift()
unshift() ajoute un ou plusieurs éléments en tête du tableau.
shift() supprime le premier élément du tableau.

9.toString() et toLocaleString()

[1,2,3].toString();//"1,2,3"[1,[2,&#39;c&#39;]].toString();//"1,2,c"
Copier après la connexion

toLocaleString() est la version localisée de la méthode toString(). Il appelle la méthode toLocaleString() de l'élément pour convertir chaque élément du tableau en chaîne et concatène ces chaînes à l'aide de délimiteurs localisés pour générer la chaîne finale.

10.forEach() parcourt le tableau du début à la fin et appelle la fonction spécifiée pour chaque élément.
La fonction est passée comme premier argument à forEach(), puis forEach() appelle la fonction avec trois arguments : l'élément du tableau, l'index de l'élément et le tableau lui-même.

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]
Copier après la connexion

11.map() transmet chaque élément du tableau appelé à la fonction spécifiée et renvoie un tableau contenant la valeur de retour de la fonction .
Remarque : La fonction passée à mao() doit avoir une valeur de retour. map() renvoie un nouveau tableau et ne modifie pas le tableau d'origine. Si le tableau d'origine est un tableau clairsemé, le tableau clairsemé renvoyé est de la même manière, avec la même longueur et les mêmes éléments manquants.

var a=[1,2,3];var b=a.map(function(value){return value*value;
});
b// [1, 4, 9]
Copier après la connexion

12 filter() renvoie les éléments du tableau qui remplissent les conditions

var a=[1,2,3,5];var b=a.filter(function(value){return value>2;
});
b  // [3, 5]
Copier après la connexion

13.every() et some()
jugements logiques du tableau, ils s'appliquent aux éléments du tableau La fonction spécifiée est jugée et renvoie vrai ou faux.
every() renvoie true si tous les éléments du tableau répondent aux conditions de filtrage.
some() renvoie true s'il y a des éléments dans le tableau qui répondent aux conditions de filtrage.

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中存在偶数
Copier après la connexion

reduce ; ( ) et réduireRight()
utilisent la fonction spécifiée pour combiner des éléments du tableau afin de générer une valeur unique.
reduce() nécessite deux paramètres.
La première est la fonction qui effectue l'opération de simplification. La tâche de la fonction simplifier est de combiner ou de simplifier deux valeurs en une seule valeur d'une manière ou d'une autre et de renvoyer la valeur simplifiée. Le deuxième paramètre (facultatif) est une valeur initiale transmise à la fonction.
reduceRight() est utilisé de la même manière que réduire(), sauf qu'il traite le tableau de haut en bas (de droite à gauche) en fonction de l'index du tableau.

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求最大值
Copier après la connexion

indexOf() et lastIndexOf()
indexOf() L'index de la première valeur qualificative, sinon, renvoie -1
lastIndexOf() la dernière valeur qualifiante Index, sinon , renvoie -1

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de PHP !

Lecture recommandée :

Explication détaillée de Require.js

Comment implémenter la connexion de nœud à MySQL

Comment utiliser les expressions régulières JS

Javascript modèle singleton

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Commandes de chat et comment les utiliser
4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Recommandé : Excellent projet de détection et de reconnaissance des visages open source JS Recommandé : Excellent projet de détection et de reconnaissance des visages open source JS Apr 03, 2024 am 11:55 AM

La technologie de détection et de reconnaissance des visages est déjà une technologie relativement mature et largement utilisée. Actuellement, le langage d'application Internet le plus utilisé est JS. La mise en œuvre de la détection et de la reconnaissance faciale sur le front-end Web présente des avantages et des inconvénients par rapport à la reconnaissance faciale back-end. Les avantages incluent la réduction de l'interaction réseau et de la reconnaissance en temps réel, ce qui réduit considérablement le temps d'attente des utilisateurs et améliore l'expérience utilisateur. Les inconvénients sont les suivants : il est limité par la taille du modèle et la précision est également limitée ; Comment utiliser js pour implémenter la détection de visage sur le web ? Afin de mettre en œuvre la reconnaissance faciale sur le Web, vous devez être familier avec les langages et technologies de programmation associés, tels que JavaScript, HTML, CSS, WebRTC, etc. Dans le même temps, vous devez également maîtriser les technologies pertinentes de vision par ordinateur et d’intelligence artificielle. Il convient de noter qu'en raison de la conception du côté Web

Pourquoi est-il difficile d'implémenter des fonctions de type collection en langage Go ? Pourquoi est-il difficile d'implémenter des fonctions de type collection en langage Go ? Mar 24, 2024 am 11:57 AM

Il est difficile d’implémenter des fonctions de type collection dans le langage Go, ce qui pose problème à de nombreux développeurs. Comparé à d'autres langages de programmation tels que Python ou Java, le langage Go n'a pas de types de collection intégrés, tels que set, map, etc., ce qui pose certains défis aux développeurs lors de la mise en œuvre des fonctions de collection. Voyons d’abord pourquoi il est difficile d’implémenter des fonctionnalités de type collection directement dans le langage Go. Dans le langage Go, les structures de données les plus couramment utilisées sont les tranches et les cartes. Elles peuvent compléter des fonctions de type collection, mais.

Conseils de développement PHP et JS : maîtrisez la méthode de création de graphiques en bougies boursières Conseils de développement PHP et JS : maîtrisez la méthode de création de graphiques en bougies boursières Dec 18, 2023 pm 03:39 PM

Avec le développement rapide de la finance sur Internet, l'investissement en actions est devenu le choix de plus en plus de personnes. Dans le trading d'actions, les graphiques en bougies sont une méthode d'analyse technique couramment utilisée. Ils peuvent montrer l'évolution des cours des actions et aider les investisseurs à prendre des décisions plus précises. Cet article présentera les compétences de développement de PHP et JS, amènera les lecteurs à comprendre comment dessiner des graphiques en bougies boursières et fournira des exemples de code spécifiques. 1. Comprendre les graphiques en bougies boursières Avant de présenter comment dessiner des graphiques en bougies boursières, nous devons d'abord comprendre ce qu'est un graphique en bougies. Les graphiques en chandeliers ont été développés par les Japonais

Tutoriel JavaScript simple : Comment obtenir le code d'état HTTP Tutoriel JavaScript simple : Comment obtenir le code d'état HTTP Jan 05, 2024 pm 06:08 PM

Tutoriel JavaScript : Comment obtenir le code d'état HTTP, des exemples de code spécifiques sont requis Préface : Dans le développement Web, l'interaction des données avec le serveur est souvent impliquée. Lors de la communication avec le serveur, nous devons souvent obtenir le code d'état HTTP renvoyé pour déterminer si l'opération a réussi et effectuer le traitement correspondant en fonction de différents codes d'état. Cet article vous apprendra comment utiliser JavaScript pour obtenir des codes d'état HTTP et fournira quelques exemples de codes pratiques. Utilisation de XMLHttpRequest

La relation entre js et vue La relation entre js et vue Mar 11, 2024 pm 05:21 PM

La relation entre js et vue : 1. JS comme pierre angulaire du développement Web ; 2. L'essor de Vue.js en tant que framework front-end ; 3. La relation complémentaire entre JS et Vue ; Vue.

Un guide pratique de la méthode Where dans les collections Laravel Un guide pratique de la méthode Where dans les collections Laravel Mar 10, 2024 pm 04:36 PM

Guide pratique de la méthode Where dans les collections Laravel Lors du développement du framework Laravel, les collections constituent une structure de données très utile qui fournit des méthodes riches pour manipuler les données. Parmi elles, la méthode Where est une méthode de filtrage couramment utilisée qui permet de filtrer les éléments d'une collection en fonction de conditions spécifiées. Cet article présentera l'utilisation de la méthode Where dans les collections Laravel et démontrera son utilisation à travers des exemples de code spécifiques. 1. Utilisation de base de la méthode Where

Comment obtenir facilement le code d'état HTTP en JavaScript Comment obtenir facilement le code d'état HTTP en JavaScript Jan 05, 2024 pm 01:37 PM

Introduction à la méthode d'obtention du code d'état HTTP en JavaScript : Dans le développement front-end, nous devons souvent gérer l'interaction avec l'interface back-end, et le code d'état HTTP en est une partie très importante. Comprendre et obtenir les codes d'état HTTP nous aide à mieux gérer les données renvoyées par l'interface. Cet article explique comment utiliser JavaScript pour obtenir des codes d'état HTTP et fournit des exemples de code spécifiques. 1. Qu'est-ce que le code d'état HTTP ? Le code d'état HTTP signifie que lorsque le navigateur lance une requête au serveur, le service

Java Iterator vs Iterable : une étape vers l'écriture de code élégant Java Iterator vs Iterable : une étape vers l'écriture de code élégant Feb 19, 2024 pm 02:54 PM

Interface Iterator L'interface Iterator est une interface utilisée pour parcourir les collections. Il fournit plusieurs méthodes, notamment hasNext(), next() et remove(). La méthode hasNext() renvoie une valeur booléenne indiquant s'il existe un élément suivant dans la collection. La méthode next() renvoie l'élément suivant de la collection et le supprime de la collection. La méthode Remove() supprime l'élément actuel de la collection. L'exemple de code suivant montre comment utiliser l'interface Iterator pour parcourir une collection : Listnames=Arrays.asList("John","Mary","Bob");Iterator

See all articles