Javascript數(shù)組創(chuàng)建及其常見(jiàn)操作
你對(duì)Javascript數(shù)組的操作是否熟悉,這里和大家簡(jiǎn)單分享一下,主要包括創(chuàng)建,添加,刪除,讀取,以及JavaScript數(shù)組常見(jiàn)方法和屬性等內(nèi)容,相信本文介紹一定會(huì)讓你有所收獲。
Javascript數(shù)組及其操作
本文介紹如下幾個(gè)方面的內(nèi)容:
1.如何創(chuàng)建JavaScript數(shù)組
2.如何對(duì)JavaScript數(shù)組進(jìn)行操作(添加,刪除,讀取)
3.JavaScript數(shù)組常見(jiàn)方法和屬性
◆如何創(chuàng)建一個(gè)數(shù)組,一般地根據(jù)初始化設(shè)定簡(jiǎn)單分為3種:
1.單純創(chuàng)建JavaScript數(shù)組:
vararr=newArray();
要點(diǎn):用new關(guān)鍵字創(chuàng)建數(shù)組對(duì)象Array(),Array()對(duì)象是一個(gè)本地類(lèi),可以用new創(chuàng)建一個(gè)對(duì)象后使用
2.創(chuàng)建JavaScript數(shù)組的同時(shí)規(guī)定數(shù)組大小:
vararr=newArray(10);//這里就創(chuàng)建了一個(gè)初始化大小為10的數(shù)組
注意:當(dāng)使用數(shù)組大小操作初始化大小時(shí),數(shù)組會(huì)自動(dòng)被撐大,不會(huì)像C語(yǔ)言那樣發(fā)生錯(cuò)誤.動(dòng)態(tài)增長(zhǎng)是js數(shù)組的一個(gè)性質(zhì).另外,js中支持最大數(shù)組長(zhǎng)度為4294967295
3.直接初始化:
vararr=newArray("草履蟲(chóng)","愛(ài)","毛毛");//這里就直接初始化了數(shù)組或vararr=["草履蟲(chóng)","愛(ài)","毛毛"];//括號(hào)也可以聲明一個(gè)數(shù)組對(duì)象, 當(dāng)然,類(lèi)似C語(yǔ)言,你也可以定義2維3維和多維的數(shù)組,這里不討論。
JavaScript數(shù)組的屬性:length
arr.length返回?cái)?shù)組arr的長(zhǎng)度,常見(jiàn)于循環(huán)中對(duì)數(shù)組的遍歷,比如:
- for(vari=0;i<arr.length;i++){
- 執(zhí)行部分
- }
數(shù)組元素的訪問(wèn):arr[index],其中index表示索引即數(shù)組基數(shù),從0開(kāi)始,共有arr.length個(gè)元素.比如:arr[0]訪問(wèn)第一個(gè)數(shù)組元素,arr[1]訪問(wèn)第二個(gè)數(shù)組元素....依次類(lèi)推數(shù)組的操作方法:先概覽下下面的這些操作數(shù)組常用的方法(13個(gè))
- toString(),valueOf(),toLocalString(),join(),
- split(),slice(),concat(),
- pop(),push(),shift(),unshift(),sort(),splice()
#p# 下面逐一分析這些方法的功能和用法.
◆toString(),valueOf(),toLocalString():
功能:返回?cái)?shù)組的全部元素
注:JavaScript數(shù)組名也可以返回整個(gè)數(shù)組
代碼:
- varm=["am","bm","cm"];//用括號(hào)聲明一個(gè)數(shù)組對(duì)象
- alert(m.toString());
- //toString()返回?cái)?shù)組對(duì)象的所有內(nèi)容,用逗號(hào)分割,即am,bm,cm
- alert(m.valueOf());//valueOf()也返回?cái)?shù)組對(duì)象的所有內(nèi)容
- alert(m.toLocaleString());
- //toLocaleString()也返回?cái)?shù)組對(duì)象的所有內(nèi)容,但有地區(qū)語(yǔ)言區(qū)別,暫不研究
- alert(m);//數(shù)組名也返回?cái)?shù)組對(duì)象的所有內(nèi)容
- varm=["am","bm","cm"];
- //用括號(hào)聲明一個(gè)數(shù)組對(duì)象alert(m.toString());
- //toString()返回?cái)?shù)組對(duì)象的所有內(nèi)容,用逗號(hào)分割,即am,bm,cmalert(m.valueOf());
- //valueOf()也返回?cái)?shù)組對(duì)象的所有內(nèi)容alert(m.toLocaleString());
- //toLocaleString()也返回?cái)?shù)組對(duì)象的所有內(nèi)容,但有地區(qū)語(yǔ)言區(qū)別,暫不研究alert(m);
- //數(shù)組名也返回?cái)?shù)組對(duì)象的所有內(nèi)容
- 運(yùn)行:<script>varm=["am","bm","cm"];alert(m.toString());
- alert(m.valueOf());alert(m.toLocaleString());</script>
◆join():
功能:把JavaScript數(shù)組各個(gè)項(xiàng)用某個(gè)字符(串)連接起來(lái),但并不修改原來(lái)的數(shù)組
代碼:
- varm=["am","bm","cm"];//用括號(hào)聲明一個(gè)數(shù)組對(duì)象
- varn=m.join("---");//用---連接am,bm,cm.
- alert(m.toString());//m并沒(méi)有被修改,返回am,bm,cm
- alert(n);//n是一個(gè)字符串,為am---bm---cm
- varm=["am","bm","cm"];
- //用括號(hào)聲明一個(gè)數(shù)組對(duì)象varn=m.join("---");
- //用---連接am,bm,cm.alert(m.toString());
- //m并沒(méi)有被修改,返回am,bm,cmalert(n);
- //n是一個(gè)字符串,為am---bm---cm
- 運(yùn)行:<script>varm=["am","bm","cm"];varn=m.join("---");
- alert(m.toString());alert(n);</script>
◆split():
功能:把一個(gè)字符串按某個(gè)字符(串)分割成一個(gè)數(shù)組,但不修改原字符串
代碼:
- varstr="Ilovemaomao,Iamcaolvchong";
- vararr=str.split("o");//按字符o把str字符串分割成一個(gè)數(shù)組
- alert(arr);//輸出整個(gè)數(shù)組
- varstr="Ilovemaomao,Iamcaolvchong";
- vararr=str.split("o");
- //按字符o把str字符串分割成一個(gè)數(shù)組alert(arr);
- //輸出整個(gè)數(shù)組
- 運(yùn)行:<script>varstr="Ilovemaomao,Iamcaolvchong";
- vararr=str.split("o");alert(arr);</script>
◆slice():
功能:返回某個(gè)位置開(kāi)始(到某個(gè)位置結(jié)束)的數(shù)組部分,不修改原JavaScript數(shù)組
代碼:
- varm=["am","bm","cm","dm","em","fm"];
- varn=m.slice(2);//返回第二個(gè)元素bm后面的元素,即cm,dm,em,fm
- varq=m.slice(2,5);//返回第二個(gè)元素后到第五個(gè)元素,即cm,dm,em
- alert(n);
- alert(q);
- varm=["am","bm","cm","dm","em","fm"];
- varn=m.slice(2);
- //返回第二個(gè)元素bm后面的元素,即cm,dm,em,fmvarq=m.slice(2,5);
- //返回第二個(gè)元素后到第五個(gè)元素,即cm,dm,emalert(n);alert(q);
- 運(yùn)行:<script>varm=["am","bm","cm","dm","em","fm"];
- varn=m.slice(2);varq=m.slice(2,5);alert(n);alert(q);</script>
#p#JavaScript數(shù)組對(duì)象的棧操作:
push():數(shù)組末尾添加一個(gè)項(xiàng)
pop():刪除數(shù)組最后一個(gè)項(xiàng)
代碼:
- varm=["am","bm","cm","dm","em","fm"];
- m.push("gm");//在數(shù)組末尾添加元素gm
- alert(m);
- m.pop();//刪除數(shù)組最后一個(gè)元素gm
- alert(m);
- varm=["am","bm","cm","dm","em","fm"];m.push("gm");
- //在數(shù)組末尾添加元素gmalert(m);m.pop();
- //刪除數(shù)組最后一個(gè)元素gmalert(m);
- 運(yùn)行:<script>varm=["am","bm","cm","dm","em","fm"];
- m.push("gm");alert(m);m.pop();alert(m);</script>
JavaScript 數(shù)組對(duì)象的隊(duì)列操作:
unshift():數(shù)組頭添加一個(gè)項(xiàng)
shift():刪除數(shù)組第一個(gè)項(xiàng)
代碼:
- varm=["am","bm","cm","dm","em","fm"];
- m.unshift("gm");//在數(shù)組第一個(gè)元素位置添加元素gm
- alert(m);
- m.shift();//刪除數(shù)組第一個(gè)元素gm
- alert(m);
- varm=["am","bm","cm","dm","em","fm"];m.unshift("gm");
- //在數(shù)組第一個(gè)元素位置添加元素gmalert(m);m.shift();
- //刪除數(shù)組第一個(gè)元素gmalert(m);
- 運(yùn)行:<script>varm=["am","bm","cm","dm","em","fm"];m.unshift("gm");
- alert(m);m.shift();alert(m);</script>
◆ sort():
功能:數(shù)組按字符的ASCII碼進(jìn)行排序,修改數(shù)組對(duì)象
注:即便是數(shù)字?jǐn)?shù)組,也將轉(zhuǎn)化為字符串來(lái)進(jìn)行比較排序
代碼:
- varm=["am","fm","gm","bm","em","dm"];
- m.sort();//按字母序排序
- alert(m);
- varm=["am","fm","gm","bm","em","dm"];m.sort();
- //按字母序排序alert(m);
- 運(yùn)行:<script>varm=["am","fm","gm","bm","em","dm"];
- m.sort();alert(m);</script>
#p# ◆concat():
功能:在JavaScript數(shù)組尾添加元素,但不修改數(shù)組對(duì)象
代碼:
- varm=["am","bm"]
- varn=m.concat("cm");//添加一項(xiàng)cm,并且賦予新數(shù)組對(duì)象
- alert(m);//原數(shù)組沒(méi)有被修改
- alert(n);//輸出新數(shù)組對(duì)象
- varm=["am","bm"]varn=m.concat("cm");
- //添加一項(xiàng)cm,并且賦予新數(shù)組對(duì)象alert(m);
- //原數(shù)組沒(méi)有被修改alert(n);//輸出新數(shù)組對(duì)象
- 運(yùn)行:<script>varm=["am","bm"];varn=m.concat("cm");
- alert(m);alert(n);</script>
◆splice():在數(shù)組的任意位置進(jìn)行添加,刪除或者替換元素,直接修改數(shù)組對(duì)象
細(xì)節(jié):
splice()有三個(gè)參數(shù)或三個(gè)以上參數(shù),前兩個(gè)是必須的,后面參數(shù)是可選的
進(jìn)行添加:splice(起始項(xiàng),0,添加項(xiàng))
進(jìn)行刪除:splice(起始項(xiàng),要?jiǎng)h除的項(xiàng)個(gè)數(shù))
進(jìn)行替換:splice(起始項(xiàng),替換個(gè)數(shù),替換項(xiàng))這個(gè)其實(shí)是添加刪除的共同結(jié)果
代碼:
- varm=["am","bm"]
- m.splice(1,0,"fm","sm");//在第一項(xiàng)后面添加fm和sm,返回am,fm,sm,bm
- alert(m);
- m.splice(2,1);//刪除第二項(xiàng)后面一項(xiàng)(即第三項(xiàng)sm,返回am,fm,bm)
- alert(m);
- m.splice(2,1,"mm");//替換第二項(xiàng)后面一項(xiàng)(即第三項(xiàng),返回am,fm,mm)
- alert(m);
- varm=["am","bm"]m.splice(1,0,"fm","sm");
- //在第一項(xiàng)后面添加fm和sm,返回am,fm,sm,bmalert(m);m.splice(2,1);
- //刪除第二項(xiàng)后面一項(xiàng)(即第三項(xiàng)sm,返回am,fm,bm)alert(m);
- m.splice(2,1,"mm");
- //替換第二項(xiàng)后面一項(xiàng)(即第三項(xiàng),返回am,fm,mm)alert(m);
- 運(yùn)行:<script>varm=["am","bm"];
- m.splice(1,0,"fm","sm");alert(m);m.splice(2,1);
- alert(m);m.splice(2,0,"mm");alert(m);</script>
【編輯推薦】
- JavaScript數(shù)組元素刪除問(wèn)題解決方案
- 深入剖析JavaScript中split()方法的使用
- JavaScript數(shù)組元素刪除問(wèn)題解決方案
- Javascript操作img解決網(wǎng)站提交數(shù)據(jù)異常問(wèn)題
- JavaScript調(diào)試工具解決IE6等多版本共存問(wèn)題