javascript
javascript Array学习与使用
一.Javascript數(shù)組是無類型的;數(shù)組元素可以任意類型,并且同一個數(shù)組中的不同元素也可能有不同的類型,javascript數(shù)組是動態(tài)的,會根據(jù)需要增長或者縮減,每一個數(shù)組都有一個length屬性。它不是只讀的,可以通過設(shè)置這個屬性值,從數(shù)組的末尾移除項,或者添加新項
二.創(chuàng)建數(shù)組
(1)數(shù)組字面量表示方法:
?????????Var colors=[true,1,”green”]; //創(chuàng)建包含3個字符串的數(shù)組。
?????????Var arr=[];//創(chuàng)建一個空數(shù)組
?????????Var b=[1,{x:1,y:2},[2,{x:3,y:4}]];//創(chuàng)建包含對象直接量或其他數(shù)組直接量
???(2)調(diào)用構(gòu)造函數(shù)Array(),new 操作符可以省略:
?????????Var a=new Array(); 等同于Var arr=[];//創(chuàng)建一個空數(shù)組
?????????Var b=new Array(10);//創(chuàng)建指定長度的數(shù)組
?????????Var c=new Array(“red”);//創(chuàng)建一個包含1項,及字符串“red”的數(shù)組。
三.數(shù)組元素的讀寫
?????在讀取和設(shè)置數(shù)組值時,使用方括號,方括號中是一個非負整數(shù)值的任意表達式,
???????Var colors=[“red”,”blue”,”green”];//定義一個字符串?dāng)?shù)組
???????alert(colors[0]);//讀取第一項的值
???????colors[2]=”black”;//修改第三項
???????colors[3]=”brown”;//新增第四項
???????Alert(colors.length);//4,數(shù)組的長度值,等于最后一項的索引加1
四.數(shù)組元素的檢測
?????Array.isArray()方法,檢測某個值是不是數(shù)組,而不管它是在哪個全局執(zhí)行環(huán)境中創(chuàng)建的。If(Array.isArray(value)){//對數(shù)組執(zhí)行某些操作}
五.數(shù)組方法:
?????(1)Array.join();將數(shù)組中所有元素都轉(zhuǎn)化為字符串并連接在一起,返回最后生成的字符串。
? ?
<script> var?a=[1,2,3,4]; document.body.innerHTML='<b>'+a.join()+'</b>'+'</br>';//1,2,3,4 document.write('<b>'+typeof(a.join('?'))+'</b>'+'</br>');//string document.write('<b>'+a.join('?')+'</b>'+'</br>');//1?2?3?4 document.write('<b>'+a.join('-')+'</b>');//1-2-3-4</script>?(2)Array.reverse(),將數(shù)組中的元素顛倒順序,返回逆序的數(shù)組
???var?a=[1,2,3,4];document.write('<b>'+a.reverse().join("*")+'</b>');//4*3*2*1(3)Array.sort(),默認(rèn)沒有參數(shù)時將數(shù)組元素按照字母表順序進行排序,要是按照某一規(guī)定進行排序,則必須傳遞一個比較函數(shù)
? ? ??
??var?b=["22","555","44","1"];document.write('<b>'+b.sort()+'</b>'+'</br>');//1,22,44,555var?c=["2","555","44","11"];document.write('<b>'+c.sort(function(a,b){?return?a-b})+'</b>'+'</br>');//2,11,44,555(3)Array.concat(),創(chuàng)建并返回一個新數(shù)組。,它的元素包括調(diào)用contact()的原始數(shù)組的元素和concat()的每個參數(shù)。
? ? ??
??var?d=["2","5","4","1"];document.write('<b>'+d.concat(6,8)+'</b>'+'</br>');//2,5,4,1,6,8(4)Array.slice()方法,返回數(shù)組的一個片段或者子數(shù)組,它的兩個參數(shù)分別指定了片段的開始與結(jié)束,返回的數(shù)組包含第一個參數(shù)指定的位置和所有到不含第二參數(shù)指定的位置之間的所有數(shù)組元素,只有一個參數(shù)時,返回從這個參數(shù)開始到數(shù)組結(jié)尾的的所有元素。? ? ??
???var?e=["2","5","4","1"];document.write('<b>'+e.slice(1,3)+'</b>'+'</br>');//5,4var?f=["2","5","4","1"];document.write('<b>'+f.slice(2)+'</b>'+'</br>'+'<hr>');//4,1(5)棧方法
?????Push()方法可以接收任意數(shù)量的參數(shù),將他們逐個添加到數(shù)組的末尾,并返回修改數(shù)組的新長度,而pop()方法,則是相反的,從數(shù)組末尾移除最后一項,減少數(shù)組的長度,最后返回移除的項。? ?
??var?g=["red","yellow","blue"];document.write('<b>'+"修改后數(shù)組的新長度為:"+g.push("green","pink")+'</b>'+'</br>');//修改后數(shù)組的新長度為:5document.write('<b>'+"刪除的數(shù)組值為:"+g.pop()+'</b>'+'</br>'+'<hr>');//刪除的數(shù)組值為:pink(6)類似隊列的方法
??????Shift(),能夠移除數(shù)組中的一個項,并返回該項,然后把所有隨后的元素下移一個位置來填補數(shù)組頭部的空缺,同時將數(shù)組長度減1;unshift(),在數(shù)組的前端添加任意個項并將已存在的元素移動到更高索引的位置來獲得足夠的空間,最后返回新數(shù)組的長度。??
???var?e=["red","yellow","blue"]; document.write('<b>'+"刪除的數(shù)組的一個元素是:"+e.shift()+'</b>'+'</br>');//刪除的數(shù)組的一個元素是:red document.write('<b>'+"數(shù)組前端添加元素后,數(shù)組的長度:"+e.unshift("red","black")+'</b>'+'</br>'+'<hr>');//數(shù)組前端添加元素后,數(shù)組的長度:4(7)轉(zhuǎn)換方法
????????所有對象都具有toLocaleString(),toString(),valueOf(),
???????調(diào)用數(shù)組的toString() 方法會返回由數(shù)組中每個值的字符串形式拼接而成的字符串,該字符串是以逗號分隔的字符串。與join()方法沒有參數(shù)時,返回的字符串一樣效果。
??????調(diào)用數(shù)組的valueOf() 方法,返回的還是數(shù)組。
??????調(diào)用數(shù)組的toLocaleString(),把數(shù)組轉(zhuǎn)換為本地字符串? ? ??
??var?f=["red","yellow","blue"];document.write('<b>'+"本身的類型為:"+typeof(f)+'</b>'+'</br>');//本身的類型為:objectdocument.write('<b>'+f.toString()+'</b>'+'</br>');//red,yellow,bluedocument.write('<b>'+"使用toString后的類型變?yōu)?#xff1a;"+typeof(f.toString())+'</b>'+'</br>');//使用toString后的類型變?yōu)?#xff1a;stringdocument.write('<b>'+f.valueOf()+'</b>'+'</br>');//red,yellow,bluedocument.write('<b>'+"使用valueOf()后的類型變?yōu)?#xff1a;"+typeof(f.valueOf())+'</b>'+'</br>'+'<hr>');//使用valueOf()后的類型變?yōu)?#xff1a;object(7)位置方法
??????ES5為數(shù)組添加了兩個位置方法:indexOf(),lastIndexOf(),用來搜索整個數(shù)組中具有給定值的元素,返回找到的第一個元素的索引或者如果沒有找到就返回-1,接收兩個參數(shù),第一個參數(shù)為要查找的項,第二個參數(shù)為可選的,表示查找起點位置的索引,indexOf()方法從數(shù)組的開頭向后查找,lastIndexOf()則從數(shù)組末尾開始向前查找。? ?
?var?h=["red","yellow","blue","red"];document.write('<b>'+"red所在數(shù)組的位置是:"+h.indexOf("red")+'</b>'+'</br>');//red所在數(shù)組的位置是:0document.write('<b>'+"從1的位置開始找blue所在數(shù)組的位置是:"+h.indexOf("blue",1)+'</b>'+'</br>');//從1的位置開始找blue所在數(shù)組的位置是:2document.write('<b>'+"使用,lastindexOf(),red所在數(shù)組的位置是:"+h.lastIndexOf("red")+'</b>'+'</br>'+'<hr>');//使用,lastindexOf(),red所在數(shù)組的位置是:3(8)迭代方法
??????ES5為數(shù)組定義了5個迭代方法,每個方法都接收兩個參數(shù),一個參數(shù)是要在每一項上運行的函數(shù),第二個參數(shù)是可選的,運行函數(shù)的作用域?qū)ο蟆6鴮τ诘谝粋€參數(shù),這個函數(shù)會接收三個參數(shù),數(shù)組項的值,該項在數(shù)組中的位置,和數(shù)組對象本身。
1)forEach()從頭到尾遍歷數(shù)組,為每個元素調(diào)用指定的函數(shù),該方法沒有返回值,而且必須得所有元素都傳遞給調(diào)用的函數(shù)之后才能終止遍歷,也就是說沒有break語句隨時退出這個循環(huán),要是真要提前終止,必須把forEach()方法放在一個try塊中。
??var?data=[1,2,3,4,5];var?sum=0;data.forEach(function(value){sum+=value;});document.write('<b>'+"sum的值為:"+sum+'</b>'+'</br>');//sum的值為:15data.forEach(function(v,i,data){data[i]=v+3;});document.write('<b>'+"data中的值為:"+data+'</b>'+'</br>'+'<hr>');//data中的值為:4,5,6,7,8??2)map(),對數(shù)組中的每一項運行給定函數(shù),返回每次函數(shù)調(diào)用的結(jié)果組成數(shù)組,map()返回的是新數(shù)組,它不修改調(diào)用的數(shù)組。? ? ??
?var?data2=[1,2,3,4,5];var?sum=0;data=data2.map(function(x){return?sum+=x});document.write('<b>'+"原來數(shù)組:"+data2+'</b>'+'</br>');//原來數(shù)組:1,2,3,4,5document.write('<b>'+"sum的值:"+sum+'</b>'+'</br>');//原來數(shù)組:15document.write('<b>'+"新數(shù)組中的值為:"+data+'</b>'+'</br>'+'<hr>');//新數(shù)組中的值為:1,3,6,10,15? 3)filter()對數(shù)組中的每一項運行給定的函數(shù),該函數(shù)是用來邏輯判定的,返回true,或者false,返回的數(shù)組元素是函數(shù)會返回true的項組成數(shù)組的一個子集,壓縮空缺并刪除undefined和null元素,可以使用filter()??
??var?data3=[1,2,3,4,5];data33=data3.filter(function(x){return?x<3;});document.write('<b>'+"新數(shù)組中的值為:"+data33+'</b>'+'</br>');//新數(shù)組中的值為:1,2data333=data3.filter(function(x){return?x%2==0;});document.write('<b>'+"新數(shù)組中的值為:"+data333+'</b>'+'</br>'+'<hr>');//新數(shù)組中的值為:2,4?4)every()和some(),是數(shù)組的邏輯判定,對數(shù)組中的每一項運行給定的函數(shù),對于every(),只有數(shù)組中的每一個元素都滿足函數(shù),才返回true,而some()就只要求,有滿足的的項,就返回true,就類似于數(shù)學(xué)中的與/或的邏輯表達式求值? ??
?var?data4=[1,2,3,4,5];data44=data4.every(function(x){return?x<3;});document.write('<b>'+"使用every()的返回值:"+data44+'</b>'+'</br>');//使用every()的返回值:falsedata444=data4.some(function(x){return??x<3});document.write('<b>'+"使用some()的返回值:"+data444+'</b>'+'</br>'+'<hr>');//使用some()的返回值:true(9)歸并方法
?????也是ES5新增的數(shù)組方法,用指定的函數(shù),將數(shù)組元素進行合并
?????1)reduce(),從數(shù)組的第一項開始,逐個遍歷到最后
?????2)reduceRight(),從數(shù)組的最后一項開始,向前遍歷的第一項
???這兩個方法都接收兩個參數(shù),一個在每一項上調(diào)用的函數(shù)和(可選的)作為歸并基礎(chǔ)的初始值,傳給reduce()和reduceRight()的函數(shù)接收4個參數(shù):前一個值,當(dāng)前值,項的索引和數(shù)組對象。這個函數(shù)返回的任何值都會作為第一個參數(shù)自動傳給下一項,第一次迭代發(fā)生在數(shù)組的第二項上,因此第一個參數(shù)是數(shù)組的第一項,第二個參數(shù)就是數(shù)組的第二項。
???var?data5=[1,2,3,4,5];var?sum=data5.reduce(function(x,y){return?x+y},0);document.write('<b>'+"sum的值:"+sum+'</b>'+'</br>');//sum的值:15var?sum1=data5.reduce(function(x,y,index,data5){return?x+y});document.write('<b>'+"sum1的值:"+sum1+'</b>'+'</br>');//sum1的值:15var?sum2=data5.reduce(function(x,y,index,data5){return?x*y},2);document.write('<b>'+"sum1的值:"+sum2+'</b>'+'</br>');//sum2的值:240? ? ?
轉(zhuǎn)載于:https://blog.51cto.com/xiyin001/1761195
總結(jié)
以上是生活随笔為你收集整理的javascript Array学习与使用的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 每周一书-2016年8月28日到9月4日
- 下一篇: 运维经验分享(三)-- 解决Ubuntu