前言
數組是一種特殊對象。js中并沒有真正的數組，只是用對象模擬數組。
查看對象屬性的方法在數組身上也同樣適用。值得注意的是:數組的下標類型為字符串，并不是數字。
典型數組和js數組區別
類似c/c++的典型數組特征如下:
- 元素的數據類型相同
- 使用連續的內存存儲
- 通過數字下標獲取元素
js的數組
- 元素的數據類型可以不同
- 內存不一定是連續的(對象是隨機存儲的)
- 不能通過數字下標訪問，而是通過字符串下標進行訪問。(這意味著數組可以有任何key)
上圖說明的是最后一點:數組可以有任何key，想證明數組的下標為字符串，用 Object.keys(arr)
創建數組
創建數組有兩種方式，分別是:
let arr=[1,2,3] let arr=new Array(1,2,3)
字符串轉化為數組 split() Array.from()
可以用這兩種方法將字符串轉化為字符串數組。
偽數組
沒有數組共有屬性的數組就是偽數組(偽數組的原型鏈中并沒有數組的原型)
偽數組中并沒有push,pop等方法(通過 console.dir(divList) 可看出)，我們可以通過 Array.from() 來轉化
轉化之后就可以成功的push啦
合并兩個數組
- concat()
此方法不會改變原數組
let arr1=[1,2,3] let arr2=[4,5,6] arr1.concat(arr2)//[1,2,3,4,5,6] arr1//[1,2,3] arr2//[4,5,6]
截取數組
- slice()
此方法不會改變原數組
let arr=[1,2,3,4,5,6] arr.slice(3) //[4,5,6] arr//[1,2,3,4,5,6]
刪數組元素
刪頭部元素: arr.shift() arr會被修改，并返回被刪元素
let arr=[1,2,3,4,5,6] arr.shift()//1 arr//[2, 3, 4, 5, 6]
刪尾部元素: arr.pop() arr會被修改，并返回被刪元素
let arr=[1,2,3,4,5,6] arr.shift()//6 arr//[1, 2, 3, 4, 5]
刪中間:
arr.splice(index,1) //刪除index的第一個元素,返回被刪元素 arr.splice(index,1,"x") //在刪除位置添加"x" ,返回被刪元素 arr.splice(index,1,"x","y") //在刪除位置添加"x"和"y",返回被刪元素
let arr=[1,2,3,4,5,6,7,8,9] //刪除元素4 arr.splice(3,1)//4 arr//[1, 2, 3, 5, 6, 7, 8, 9] let arr=[1, 2, 3, 5, 6, 7, 8, 9] //刪除下標3并添加3.5和4 arr.splice(2,1,3.5,4)//3 arr//[1, 2, 3.5, 4, 6, 7, 8, 9]
查看數組元素
查看屬性
- Object.keys(arr)
- Object.values(arr)
let arr=[1,2,3,4,5] arr.x="xxx" Object.keys(arr)//["0", "1", "2", "3", "4", "x"] Object.values(arr)// [1, 2, 3, 4, 5, "xxx"]
for in 循環
查看只含數字的元素
for循環
forEach循環
查看某個元素是否在數組里
arr.indexOf(item) 存在則返回數組索引，否則返回-1
let arr=[1,2,3,4,5,6] arr.indexOf(2)//1 arr.indexOf(7)//0
使用條件查找元素
//查找第一個為偶數的元素 let arr=[1,2,3,4,5,6] arr.find(item=>item%2===0)//2 //查找第一個為偶數的下標 let arr=[1,2,3,4,5,6] arr.findIndex(item=>item%2===0)//1
增加數組中的元素
在尾部添加: arr.push(item1,item2)
let arr=[3,4,5,6] arr.push(7,8,9) arr//[3,4,5,6,7,8,9]
頭部添加: arr.unshift(item1,item2)
let arr=[3,4,5,6] arr.unshift(1,2,3) arr//[1, 2, 3, 3, 4, 5, 6]
在中間添加: arr.splice(index,0,"x")
let arr=[1,2,3,4,5,6,7] //在下標為2的位置添加3.33,3.44 arr.splice(2,0,3.33,3.44)//[1, 2, 3.33, 3.44, 3, 4, 5, 6, 7]
總結
到此這篇關于js數組的基本使用總結的文章就介紹到這了,更多相關js數組使用內容請搜索服務器之家以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持服務器之家！
原文鏈接：https://juejin.cn/post/6918316914569641997
