js陣列及其遍歷方式
阿新 • • 發佈:2020-07-09
JS陣列可以看作一個特殊的物件,有屬性和值
陣列的定義:
let arr=[1,2,"abc",true],JS是弱型別語言,陣列中元素可以是不同型別的,boolean型別放入值就是對應的字串true或false
let arr=[1,"a",true]; for(let i=0;i<arr.length;i++){ console.log(typeof arr[i]); console.log(arr[i]); }
length屬性:
表示陣列的長度,元素的個數,length屬性是可變的,這一點需要特別注意。當length屬性被設定得更大時,整個陣列的狀態事實上不會發生變化,僅僅是length屬性變大;當length屬性被設定得比原來小時,則原先陣列中索引大於或等於length的元素的值全部被丟失
let arr=[1,"a",false]; console.log(arr[2]); arr.length=2; console.log(arr[2]);
可以看出,將length設定到小於定義時,值將丟失,顯示未undefined,同理,增大length,值預設為undefined
陣列的遍歷:
let arr=[1,2,"abc",true],陣列預設的索引是從0開始的數字
方式1:普通for迴圈
for(let i=0;i<arr.length;i++){
console.log(arr[i]);
}
let arr=[1,2,"a",false]; for(let i=0;i<arr.length;i++){ console.log(arr[i]); }
當進行"新增元素"的操作時:
let arr=[1,2,"a",false]; arr[8]=9;//1 arr["8"]=9;//2 arr["adc"]="abc";//3 for(let i=0;i<arr.length;i++){ console.log(arr[i]); }
//1 //2 元素自動補undefined,索引為數字,或者能轉為字串的元素(“3”,“8”,“12”)
//3 普通for不支援非“數字”索引
方式2:for~in
for(let key in arr){
}
將陣列作為物件遍歷其中的屬性,取值arr[key]
let arr=[1,2,"a",false]; arr[8]=9;//1 arr["8"]=9;//2 arr["adc"]="abc";//3 for (let key in arr) { console.log(key+":"+arr[key]); }
可以看出,key為下標,如果是在定義時的元素,那麼下標就是數字索引,如果是“後來增加”的元素(特別注意的是此時不會增加undefinded元素),那麼索引就是“增加”時在方括號內指定的
方式3:for~of(ES6引入)
for(let num of nums){
}
將陣列中的元素直接獲取, 可以遍歷到索引為數字(能轉成數字的字串)的元素,包含undefined,索引的型別是其他的,遍歷不到
let arr=[1,2,"a",false]; arr[8]=9;//1 arr["8"]=9;//2 arr["adc"]="abc";//3 for (let key of arr) { console.log(key); }
效果和普通for相同