首先要明確一點(diǎn)，JS其實(shí)沒有真正的數(shù)組，只是用對象來模擬數(shù)組。以下是典型數(shù)組與JS數(shù)組之間的不同。
典型的數(shù)組
- 元素的數(shù)據(jù)類型相同
- 使用連續(xù)的內(nèi)存存儲
- 通過數(shù)字下標(biāo)獲取元素
JS數(shù)組
- 元素的數(shù)據(jù)類型可以不同
- 內(nèi)存不一定是連續(xù)的（對象是隨機(jī)存儲的）
- 不能通過數(shù)字下標(biāo)，而是通過字符串下標(biāo)
例如
let arr = [1,2,3]
arr ['xxx'] = 1
創(chuàng)建數(shù)組
新建一個(gè)數(shù)組
let arr = [1,2,3]
let arr = new Array(1,2,3)
把不是數(shù)組的轉(zhuǎn)化成為一個(gè)數(shù)組
可以利用split()方法
split()方法通過在指定分隔符字符串的每個(gè)實(shí)例處分離字符串，將String轉(zhuǎn)換為字符串?dāng)?shù)組.
let arr = '1,2,3'.split(',')
let arr = '123'.split('')
Array.from('123')
合并兩個(gè)數(shù)組，得到新的數(shù)組
arr1.concat(arr2)
截取一個(gè)數(shù)組的一部分
arr1.slice(1) //注意是從第二個(gè)元素開始的
arr1.slice(0) //全部拷貝
擴(kuò)展
偽數(shù)組 : 沒有數(shù)組共用屬性的數(shù)組，即偽數(shù)組的原型鏈中并沒有數(shù)組的原型。
例如
let divList = document.querySelectorAll('div')
增刪改查（指的是數(shù)組中的元素）
刪除元素
刪除元素與刪除對象的方法差不多，只不過刪除數(shù)組中的元素之后數(shù)組的長度并沒有什么變化
例如:運(yùn)行以下代碼
let arr = ['a','b','c']
delete arr['0']
會得到這樣的結(jié)果
雖然刪除了第一個(gè)元素，但是在第一個(gè)元素的位置上有一個(gè)empty元素，數(shù)組的長度其實(shí)并沒有改變。
所以基于此，一般采取這樣的方式來進(jìn)行數(shù)組元素的刪除操作
- 刪除頭部元素
arr.shift() //arr被修改，并返回被刪元素
- 刪除尾部元素
arr.pop() //arr被修改，并返回被刪元素
- 刪除中間元素
例如
let arr = [1,2,3,4,5]
arr.splice(2,1) //刪除arr數(shù)組中位置是2的一個(gè)元素
arr.splice(2,1,'x') //并在刪除位置添加'x'
arr.splice(2,1,'x','y') //并在刪除位置添加'x','y'
查看所有元素
- 查看所有屬性名
let arr = [1,2,3,4,5]; arr.x = 'xxx'
Object.keys(arr)
for(let key in arr){console.log(`${key}:${arr[key]}`)}
- 查看數(shù)字（字符串）屬性名和值
for(let i = 0;i<arr.length;i++){
console.log(`${i}:${arr[i]}`)
}
注意：要自己讓i從0增長到length-1
- 也可以用forEach/map等原型上的函數(shù)
arr.forEach(function(item,index){
console.log(`${index}:${item}`)
})
查看單個(gè)屬性
- 跟對象一樣
let arr = [111,222,333]
arr[0]
（這樣寫的話一般會出現(xiàn)問題）
- 索引越界
arr[arr.length] ===undefined
arr[-1] ===undefined
例如:如下代碼
for(let i=0; i<=arr.length; i++){
console.log(arr[i].toString())
}
會出現(xiàn)報(bào)錯(cuò) : Cannot read property 'toString' of undefined
意思如下：你讀取了undefined的toString屬性，不是toString是undefined
注意 : x.toString()其中x如果是undefined就報(bào)這個(gè)錯(cuò)。
所以一般采取如下方式進(jìn)行單個(gè)元素的查看
- 查找某個(gè)元素是否在數(shù)組里
arr.indexOf(item) //存在返回索引，否則返回-1
- 使用條件查找元素
arr.find(item => item % 2 ===0) //找第一個(gè)偶數(shù)
- 使用條件查找元素的索引
arr.findIndex(item => item % 2 ===0) //找第一個(gè)偶數(shù)的索引
擴(kuò)展
function forEach(array,fn){
for(let i=0; i<array.length;i++){
fn(array[i] , i , array)
}
}
- forEach用for訪問array的每一項(xiàng)
- 對每一項(xiàng)調(diào)用fn(array[i], i , array)
增加數(shù)組中的元素
- 在尾部加元素
arr.push(newItem) //修改arr,返回新長度
arr.push(item1,item2) //修改arr,返回新長度
- 在頭部加元素
arr.unshift(newItem) //修改arr,返回新長度
arr.unshift(item1,item2) //修改arr,返回新長度
- 在中間添加元素
arr.splice(index,0,'x') //在index處插入'x'
arr.splice(index,0,'x','y')
修改數(shù)組中的元素
- 反轉(zhuǎn)順序
arr.reverse() //修改原來數(shù)組
- 自定義順序
arr.sort((a,b) => a-b)
數(shù)組變換
- map : n變n
通過arr.map把數(shù)字變成星期
let arr = [0,1,2,2,3,3,3,4,4,4,4,6]
let arr2 = arr.map(item=>{return{0:'周日',1:'周一',2:'周二',3:'周三',4:'周四',6:'周六'}[item]})
console.log(arr2)
- filter : n變少
通過filter找出所有大于 60 分的成績
let scores = [95,91,59,55,42,82,72,85,67,66,55,91]
let scores2 = scores.filter(item=>item-60>0?true : false)
console.log(scores2)
或者
let scores = [95,91,59,55,42,82,72,85,67,66,55,91]
let scores2 = scores.filter(n => n>= 60)
console.log(scores2) // [95,91,82,72,85,67,66, 91]
- reduce : n變1
通過reduce算出所有奇數(shù)之和
let scores = [95,91,59,55,42,82,72,85,67,66,55,91]
let sum = scores.reduce((sum, n)=>{
if(n%2===1){
return sum+n
}else{
return sum
}
},0)
console.log(sum)
或者可以這樣寫
let scores = [95,91,59,55,42,82,72,85,67,66,55,91]
let sum = scores.reduce((sum, n)=>{
return n%2===0?sum:sum+n
},0)
console.log(sum) // 奇數(shù)之和：598
