Maison > interface Web > js tutoriel > Explication détaillée des étapes d'utilisation de la méthode tableau JS

Explication détaillée des étapes d'utilisation de la méthode tableau JS

php中世界最好的语言
Libérer: 2018-05-24 16:06:22
original
1984 Les gens l'ont consulté

Cette fois, je vais vous apporter une explication détaillée des étapes pour utiliser la méthode tableau JS. Quelles sont les précautions lors de l'utilisation de la méthode tableau JS. Voici des cas pratiques, jetons un coup d'oeil.

1.join

Fonction : Épissez le tableau à travers les caractères spécifiés en un chaîne .
Syntaxe : string arr.join([separator = ',']);
Paramètres : le séparateur est disponible En cas d'omission, est par défaut une virgule . Si seprator est une chaîne vide , alors tous les éléments du tableau seront concaténés directement .
Valeur de retour : La chaîne concaténée.

<script>
        var arr=[2,3,4,5];
        console.log(arr.join());//"2,3,4,5"
        console.log(arr.join(""));//"2345"
        console.log(arr.join("+"));//"2+3+4+5"
        console.log(arr);//[2,3,4,5]
</script>
Copier après la connexion

2.push

Fonction : Ajouter un ou plusieurs éléments à la fin du tableau.
Syntaxe : number arr.push(element1, ..., elementN);
Paramètres : elementN, un ou plusieurs éléments.
Valeur de retour : La longueur du nouveau tableau.
Remarque : modifiera le tableau d'origine.

 <script>
        var att=[1,2,3,4];
        console.log(att.push("a","b"));//6
        console.log(att);//[1,2,3,4,"a","b"];
 </script>
Copier après la connexion

3.unshift

Fonction : Ajouter un ou plusieurs éléments à la tête du tableau.
Syntaxe : number arr.push(element1, ..., elementN);
Paramètres : elementN, un ou plusieurs éléments.
Valeur de retour : La longueur du nouveau tableau.
Remarque : modifiera le tableau d'origine.

 <script>
        var att=[1,2,3,4];
        console.log(att.unshift("a","b"));//6
        console.log(att);//["a","b",1,2,3,4];
 </script>
Copier après la connexion

4.pop

Fonction : SupprimertableauEnfin un élément .
Syntaxe : mixed arr.pop();
Valeur de retour : L'élément supprimé.
Remarque : modifiera le tableau d'origine.

<script>
    var arr=[1,2,3,4];
    console.log(arr.pop());//4
    console.log(arr);//[1,2,3]
</script>
Copier après la connexion

5.shift

Fonction : Supprime le premier élément du tableau.
Syntaxe : mixed arr.pop();
Valeur de retour : L'élément supprimé.
Remarque : modifiera le tableau d'origine.

<script>
    var arr=[1,2,3,4];
    console.log(arr.shift());//1
    console.log(arr);//[2,3,4]
</script>
Copier après la connexion
6.concat

Fonction : Convertit le tableau entrant ou la valeur non-tableau en original array Fusionner pour former un nouveau tableau et renvoyer .
Syntaxe : array array.concat(value1, value2, ..., valueN);
Paramètre : valueN fait référence au tableau ou à la valeur non-tableau qui doit être fusionnée avec le tableau d'origine.
Valeur de retour : Tableau fusionné
Remarque : ne modifiera pas le contenu du tableau d'origine.

<script>
        var att=[1,2,3];
        var attO=["a","b"];
        var attT=[5,true];
        console.log(att.concat(10,attO,attT));//[1,2,3,10,"a","b",5,tru]
        console.log(att);//[1,2,3]
</script>
Copier après la connexion
7.reverse

Fonction :Inverser la position des éléments dans le tableau .
Syntaxe : array arr. reverse()
Valeur de retour : Le tableau après avoir inversé l'ordre
Remarque : changer le tableau d'origine .

<script>
    var arr = [1,2,3,6,5,4];
    var res = arr.reverse();
    res.push( "a" );
    console.log( res );//[4,5,6,3,2,1,"a"]
    console.log( arr );//[4,5,6,3,2,1,"a"]
</script>
Copier après la connexion
8.slice

Fonction :Intercepter une partie du ** tableau et renvoyer ce nouveau tableau.
Syntaxe : array arr.slice([begin[,end]]);
Valeur de retour : Le nouveau tableau de après interception
Remarque : inclut la position de départ de , n'inclut pas la position de fin de et ne changera pas l'original array. Ne transmettez rien dans , alors c'est le tableau d'origine.

<script>
    var arr = ["a","b","c","d"];
//    var res = arr.slice( 1,3 );//["b","c"]
//    var res = arr.slice( 3,1 );//[]
    var res = arr.slice( -3,-1 );//["b","c"]
    var res = arr.slice();//["a","b","c","d"]
    console.log( res );
    console.log( arr );//["a","b","c","d"]
</script>
Copier après la connexion
9.splice

Fonction : Remplacer les anciens éléments par de nouveaux éléments pour modifier le contenu du tableau
Syntaxe : array array.splice(start, deleteCount[, item1[, item2[, ...]]])
Paramètres :

    - start    起始位置
    - deleteCount    删除长度
    - item    添加的内容
Copier après la connexion

Valeur de retour : Un tableau composé d'éléments supprimés
Remarque : modifie l'original Le contenu de le tableau.

<script>
    var att="Liangzhifang".split("");
    console.log(att.splice(2,4,["a"]));//["a","n","g","z"]
    console.log(att);//["L","i",["a"],"h","i","f","a","n","g"]
</script>
Copier après la connexion

10.sort

作用: 对数组的元素进行排序。
语法: array arr.sort([compareFunction]);
参数: compareFunction可选。用来指定按某种顺序进行排列的函数。如果省略,元素按照转换为的字符串的诸个字符的Unicode位点进行排序。
返回值: 排序后的数组.

<script>
    //当什么都不传入的时候,sort()默认由小到大排列。
    var attr=[9,5,4,3,2];
    console.log(attr.sort());//[2, 3, 4, 5, 9]
    //传入function的时候,sort()内的function返回值大于0,由小到大排列。
    var attrO=[9,5,4,3,2];
    console.log(attrO.sort(function () {
        return 1;
    }));//[2, 3, 4, 5, 9]
    //传入function的时候,sort()内的function返回值小于或者等于0,数组序列不变。
    var attrT=[9,5,4,3,2];
    console.log(attrT.sort(function () {
        return -1;
    }));// [9, 5, 4, 3, 2]
    //由于sort内部是随机抽取两个值,我们在利用function函数的返回值,大于0的时候,交换位置。小于或者等于0的时候不变,来排序。
    //以下是由小到大排序
    var attrTh=[9,5,4,3,2];
    console.log(attrTh.sort(function (a,b) {
        return a-b;
    }));// [2, 3, 4, 5, 9]
    //以下是由大到小排序
    var attrF=[9,5,4,3,2];
    console.log(attrF.sort(function (a,b) {
        return b-a;// [9, 5, 4, 3, 2]
    }));
</script>
Copier après la connexion

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

使用js变量作用域遇到的bug

自定义搭建前端脚手架

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!

Étiquettes associées:
source:php.cn
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal