Maison > interface Web > js tutoriel > le corps du texte

Comment convertir un objet en tableau en javascript

青灯夜游
Libérer: 2021-06-22 17:44:32
original
23438 Les gens l'ont consulté

Méthodes de conversion d'objets JavaScript en tableaux : 1. Via l'instruction "[].slice.call(object)" 2. En utilisant l'instruction "Array.from(object)", "Array.from( )" Les méthodes peuvent convertir des objets traversables en tableaux (y compris les structures de données Set et Map).

Comment convertir un objet en tableau en javascript

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.

1. Convertir des objets de type tableau en tableaux

1. Que sont les objets de type tableau

.

Par exemple :

let arrayLike = {
    '0':"z",
    '1':"y",
    '2':"k",
    length:3
};
Copier après la connexion

a essentiellement l'attribut length , qui peut être obtenu de la même manière que pour obtenir des éléments d'un tableau arrayLike[0], arrayLike[1 ] élément, vous pouvez également obtenir la longueur du pseudo-tableau via arrayLike.length.

Les pseudo-tableaux courants incluent la collection NodeList obtenue via les opérations DOM (document.querySelectorAll('p')) et les arguments des paramètres formels de la fonction.

2. Méthode de conversion

Méthode 1 : via [].slice.call(arrayLike)

//获取当前dom的span组成的伪数组
let spanDomArr = document.querySelectorAll('span');
 
//通过数组的方法forEach遍历spanDomArr
let arr = [].slice.call(spanDomArr);
 
//因为spanDomArr是伪数组,不支持数组的forEach,所以需要先转换成数组
arr.forEach(function(span){
    console.log(span)
});
Copier après la connexion

Méthode 2 : via Array.from(arrayLike)

//获取当前dom的span组成的伪数组
let spanDomArr = document.querySelectorAll('span');
 
//通过数组的方法forEach遍历spanDomArr
//因为spanDomArr是伪数组,不支持数组的forEach,所以需要先转换成数组
Array.from(spanDomArr).forEach(function(span){
    console.log(span)
});
Copier après la connexion

2. Extend-Array.from( )

1. Fonction :

1-Peut convertir des objets de type tableau en tableaux ;

2-Peut convertir des objets traversables. converti en tableaux (incluant les nouvelles structures de données Set et Map d'ES6)

2 Application pratique :

1-Si le navigateur actuel ne déploie pas cette méthode, vous peut utiliser la méthode Array.prototype.slice à la place

/*
 *  方法名:objectToArray
 *  功能介绍:把类似数组的对象、可遍历的对象转换成数组
 *  参数:obj-需要转换的对象
 */
var objectToArray = function(obj){
   return Array.from ? Array.from(obj) : [].slice.call(obj);
};
Copier après la connexion

2-Si le paramètre est un tableau, un tableau identique sera renvoyé

Array.from(["z","y","k"]);
//打印:["z","y","k"]
Copier après la connexion

3-Les objets avec uniquement des attributs de longueur ne peuvent pas être transmis au tableau Conversion .from

4-Array.from deuxième paramètre : est utilisé pour traiter chaque élément et mettre la valeur traitée Return dans le tableau.

let arrayLike = {
    "0" : "z",
    "1" : "y",
    "2" : "k",
    "length":3
};
Array.from(arrayLike,x=>x+'1');
//等同于
Array.from(arrayLike).map(x=>x+'1');

//打印:["z1","y1","k1"]
Copier après la connexion

[Recommandations associées : Tutoriel d'apprentissage Javascript]

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
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!