JS—数组

Dec 06, 2016 am 11:20 AM

数组(Array对象) 
数组是一种对象。数组是值的有序集合。每个值叫做元素(可以是任意类型),每个元素在数组中都有一个位置,以数字表示,称为索引(0—232-2)。 
一、创建数组 
1.使用数组字面量(直接量) 
var empty=[];//空数组 
var misc=[1.1,true,”a”,[1,{x:1,y:2}]];//元素类型不同 
var count=[1,,2];//有3个元素,中间被省略的值为undefined 
var undefs=[,,];//有2个元素,但也会解析为3个,所以不要这样做 
2.调用构造函数Array() 
var a=new Array();//没有参数,相当于空数组 
var a=new Array(10);//指定长度为10的数组 
var a=new Array(10,4,”hhhh”);//指定数组元素,但没有直接使用字面量方法好 
二、数组元素的读和写 
var arr=[1,2,3,4,5]; 
arr[1];//数组的第一个元素——2 
arr[5]=6;//动态地添加(不需要重新定义)第五个元素——6 
delete arr[0];删除了第一个元素,但此时数组长度仍为6,且第一个元素为undefined 
三、稀疏数组 
稀疏数组即包含从0开始的不连续索引的数组。一般length属性值比实际元素个数大   
var arr1=[undefined]; 
var arr2=new Array(1);//等同与var arr2=[,]; 
0 in arr1;// 返回true,索引0处有一个元素 
0 in arr2; // 返回false,索引0处没有元素 
四、数组属性 
length:  arr1.length; 
五、数组遍历 
for(var i=0;i六、多维数组
arr[][]

//创建一个多维数组
var table=new Array(10);//表格有10行
for(var i=0;i table[i]=new Array(10); //每行有10列
//初始化数组
for(var row=0;rowfor(var col=0;coltable[row][col]=row*col;
}
}
//使用多维数组计算
var product=table[5][7];//结果为35
七、数组方法




1.join()
将数组中所有元素转化为字符串并连接在一起,返回字符串,可指定分隔符分隔元素,若不指定默认用“,”隔开。
var arr=[1,2,3];
arr.join();//”1,2,3”
arr.join(“_”);//”1_2_3”


2.reverse()
将数组中元素颠倒顺序,返回逆序数组,且原数组被修改
var arr=[1,2,3];
arr.reverse();//[3,2,1]




3.sort()
将数组中元素排序,返回排序后的数组, 且原数组被修改。若元素有undefined,则会被排到尾部
arr=[“a”,”c”,”b”];
arr.sort();//[“a”,”b”,”c”]若不带参数调用此方法,元素按字母表顺序排序

arr=[13,24,51,3];
arr.sort() ;//[13,24,3,51] 把数字转换成字符串再比较,每个数字的第一位从小到大排序

arr.sort(function(a,b){
return a-b;//根据顺序,[3,13,24,51]
})

arr.sort(function(a,b){
return b-a;//逆序,[51,24,13,3]
})



4.concat()
合并数组,原数组没有被修改

var arr=[1,2,3];
arr.concat(4,5);//[1,2,3,4,5]
arr.concat([4,5],6);//[1,2,3,4,5,6]参数是数组时,数组会被拉平
arr.concat(4,[5,[6,7]]);//[1,2,3,4,5,[6,7]] 参数是数组,数组元素还是数组时,数组不会被拉平两次




5.slice()
返回指定数组的一个片段或子数组,它的两个参数分别指定了片段的始末位置,一般为左闭右开区间,原数组没有被修改

var arr=[1,2,3,4,5];
arr.slice(1,3);//[2,3]
arr.slice(1);//[2,3,4,5]只有一个参数则把此参数看做起始位置,结束位置是数组结尾
arr.slice(1,-1);//[2,3,4]负数表示相对于数组中最后一个元素的位置,-1表示5这个元素
arr.slice(-4,-3);//[2]




6.splice()
在数组中插入或删除元素,原数组被修改

var arr=[1,2,3,4,5]
arr.splice(2);//[3,4,5]删除了从第二个位置到末尾的元素

arr.splice(2,2);//[3,4]第二个参数表示删除元素的个数,即从第二个位置开始删除两个元素

arr.splice(1,1,“a”,”b”);//[2]从第一个位置开始删除一个元素并在此插入”a”和”b”
arr;//[1, “a”,”b”,3,4,5]



7.push()和pop()
将数组当作栈来使用,原数组被修改。
push()在数组尾部添加一至多个元素,返回数组新的长度;
pop()删除数组的最后一个元素,减小数组长度,返回删除的值

var stack=[];
stack.push(1,2);//返回数组长度2
stack.pop();//返回末尾被删除的元素2



8.unshift()和shift()
unshift()在数组头部添加一至多个元素,返回数组新的长度;
shift()删除数组的第一个元素返回删除的值

var arr=[];
arr.unshift(2);//返回数组长度1
arr.unshift(22);//返回数组长度2,此时arr=[22,2]
arr.shift();//返回头部被删除的元素22




9.toString()和toLocaleString()
toString()将数组转换为字符串,且用“,”相隔
toLocaleString()将数组转换为字符串,且使用本地化分隔符

[1,[2,”c”]].toString()//返回”1,2,c”





八、ECMAScript5中的数组方法
ECMAScript5定义了9个新的数组方法来遍历、映射、过滤、检测、简化和搜索数组

1.forEach()
数组遍历,参数是一个函数。可使用3个参数调用该函数:元素、索引、数组本身。

var arr=[1,2,3,4,5];
var sum=0;
arr.forEach(function(value){
sum+=value; //遍历数组将每个值累加到sum上
});
sum;//15

arr.forEach(function(v,I,a){ //使用3个参数调用该函数:元素、索引、数组本身
a[i]=v+1;
})



PS:此方法不能像for一样提前终止遍历,所以要将其放在一个try块中
function foreach(a,f,t){
try{
a.forEach(f,t);
}catch(e){
if(e==foreach.break)return;
else throw e;
}
}
foreach,break=new Error(“StopIteration”);


2.map()
数组映射,原数组未被修改

var arr=[1,2,3];
arr.map(function(x){
return x+10;
});//返回[11,12,13]



3.filter()
数组过滤,原数组未被修改,返回的数组总是稠密的

var arr=[1,2,3,4,5,6,7,8,9,10];
arr.filter(function(x,index){
return index%3==0||x>=8; 
});//[1,4,7,8,9,10]  

4.every()和some() 
数组的逻辑判断,返回true或false,而且一旦确认应该返回的值就会停止遍历数组 
every()相当于逻辑“与”,只有所有元素调用判断函数都返回true,才返回true 
some()相当于逻辑“或”,至少有一个元素调用判断函数都返回true,就返回true  

var arr=[1,2,3,4,5]; 
arr.every(function(x){ 
return x<10; 
});//true 
arr.every(function(x){ 
return x<3; 
});//false 

var arr=[1,2,3,4,5]; 
arr.some(function(x){ 
return x==3; 
});//true 
arr.every(function(x){ 
return x==10; 
});//false 

PS:在空数组上调用时。every()返回true,some()返回false 

5.reduce()和reduceRight() 
使用指定函数将数组元素进行组合,生产单个值,原数组未被修改 
reduce()有两个参数,第一个是执行化简操作的函数,第二个可选是传给函数的初始值 
reduceRight()的化简操作是从右到左,其余和reduce()一样 

var arr=[1,2,3]; 
var sum=arr.reduce(function(x,y){ 
return x+y; 
},0);//返回6,即从左到右0+1=1,1+2=3,3+3=6 

var sum=arr.reduceRight(function(x,y){ 
return x+y; 
});//返回6,即从右到左3+2=5,5+1=6 
6.indexOf()和lastIndexOf() 
数组检索,返回找到的第一个元素的索引,若无则返回-1 
indexOf()从头至尾搜索 
lastIndexOf()从后向前搜索 

var arr=[1,2,3,2,1]; 
arr.indexOf(2);//寻找元素2的索引,返回1 
arr.indexOf(4);//寻找元素4的索引,因为不存在,返回-1 
arr.indexOf(1,1);//寻找元素1的索引,从第一位开始找,返回4 
arr.indexOf(1,-3);//寻找元素1的索引,从倒数第三位开始找,返回4 
arr.lastIndexOf(2,-2);//寻找元素2的索引,从倒数第二位开始找,且从后往前找,返回3 


九、数组类型 
Array.isArray([]);//true 
Array.isArray({});//false 

[]instanceof Array;//true 
({})instanceof Array;//false 

({}).toString.apply([])===”[object Array]”;//true 

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)
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Comment déverrouiller tout dans Myrise
3 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)

Remplacer les caractères de chaîne en javascript Remplacer les caractères de chaîne en javascript Mar 11, 2025 am 12:07 AM

Explication détaillée de la méthode de remplacement de la chaîne JavaScript et de la FAQ Cet article explorera deux façons de remplacer les caractères de chaîne dans JavaScript: le code JavaScript interne et le HTML interne pour les pages Web. Remplacer la chaîne dans le code JavaScript Le moyen le plus direct consiste à utiliser la méthode Remplace (): str = str.replace ("trouver", "remplacer"); Cette méthode remplace uniquement la première correspondance. Pour remplacer toutes les correspondances, utilisez une expression régulière et ajoutez le drapeau global G: str = str.replace (/ fi

Comment créer et publier mes propres bibliothèques JavaScript? Comment créer et publier mes propres bibliothèques JavaScript? Mar 18, 2025 pm 03:12 PM

L'article discute de la création, de la publication et du maintien des bibliothèques JavaScript, en se concentrant sur la planification, le développement, les tests, la documentation et les stratégies de promotion.

Comment optimiser le code JavaScript pour les performances dans le navigateur? Comment optimiser le code JavaScript pour les performances dans le navigateur? Mar 18, 2025 pm 03:14 PM

L'article traite des stratégies pour optimiser les performances JavaScript dans les navigateurs, en nous concentrant sur la réduction du temps d'exécution et la minimisation de l'impact sur la vitesse de chargement de la page.

Comment déboguer efficacement le code JavaScript à l'aide d'outils de développeur de navigateur? Comment déboguer efficacement le code JavaScript à l'aide d'outils de développeur de navigateur? Mar 18, 2025 pm 03:16 PM

L'article traite du débogage efficace de JavaScript à l'aide d'outils de développeur de navigateur, de se concentrer sur la définition des points d'arrêt, de l'utilisation de la console et d'analyser les performances.

10 façons d'augmenter instantanément vos performances jQuerres 10 façons d'augmenter instantanément vos performances jQuerres Mar 11, 2025 am 12:15 AM

Cet article décrit dix étapes simples pour augmenter considérablement les performances de votre script. Ces techniques sont simples et applicables à tous les niveaux de compétence. Restez à jour: utilisez un gestionnaire de packages comme NPM avec un bundler comme Vite pour vous assurer

Utilisation du passeport avec séquelle et mysql Utilisation du passeport avec séquelle et mysql Mar 11, 2025 am 11:04 AM

Sequelize est un ORM Node.js basé sur les promesses. Il peut être utilisé avec PostgreSQL, MySQL, MARIADB, SQLITE et MSSQL. Dans ce tutoriel, nous implémenterons l'authentification pour les utilisateurs d'une application Web. Et nous utiliserons Passport, l'authentification populaire Middlew

Comment construire un simple curseur jQuery Comment construire un simple curseur jQuery Mar 11, 2025 am 12:19 AM

Cet article vous guidera pour créer un carrousel d'image simple à l'aide de la bibliothèque JQuery. Nous utiliserons la bibliothèque BXSLider, qui est construite sur jQuery et offre de nombreuses options de configuration pour configurer le carrousel. De nos jours, Picture Carrousel est devenue une fonctionnalité incontournable sur le site Web - une image vaut mieux que mille mots! Après avoir décidé d'utiliser le carrousel d'image, la question suivante est de savoir comment la créer. Tout d'abord, vous devez collecter des images de haute qualité et haute résolution. Ensuite, vous devez créer un carrousel d'image en utilisant HTML et un code JavaScript. Il existe de nombreuses bibliothèques sur le Web qui peuvent vous aider à créer des carrousels de différentes manières. Nous utiliserons la bibliothèque BXSLider open source. La bibliothèque Bxslider prend en charge la conception réactive, de sorte que le carrousel construit avec cette bibliothèque peut être adapté à n'importe quel

Que dois-je faire si je rencontre l'impression de code brouillé pour les reçus en papier thermique frontal? Que dois-je faire si je rencontre l'impression de code brouillé pour les reçus en papier thermique frontal? Apr 04, 2025 pm 02:42 PM

Des questions et des solutions fréquemment posées pour l'impression de billets thermiques frontaux pour le développement frontal, l'impression de billets est une exigence commune. Cependant, de nombreux développeurs mettent en œuvre ...

See all articles