js數(shù)組操作方法小結(jié)

April 發(fā)布于2019-08-23 14:26 / 1158人閱讀

摘要：操作方法創(chuàng)建數(shù)組類(lèi)數(shù)組將類(lèi)數(shù)組轉(zhuǎn)換真正的數(shù)組修改數(shù)組合并數(shù)組，返回新數(shù)組，原數(shù)組不變數(shù)組轉(zhuǎn)化為字符串以默認(rèn)為逗號(hào)拼接為字符串。

Array操作方法 創(chuàng)建數(shù)組

var arr=[]
var arr = new Array()
var arr1 = ["1", "2", "3"]
var arr2 = ["a", "b", "c"]
var arrLike = [{
    name: "123",
    age: "18"
}, {
    name: "abc",
    age: "12"
}]  //類(lèi)數(shù)組

將類(lèi)數(shù)組轉(zhuǎn)換真正的數(shù)組Array.from(array)

eg:

obj = {"1": "value is 1", length: 2}
a = Array.from(obj)  //[undefined, "value is 1"]

修改數(shù)組

合并數(shù)組，返回新數(shù)組，原數(shù)組不變

Array.prototype.concat(arr1, arr2)  //["1", "2", "3", "a", "b", "c"]
arr1.concat(arr2) //["1", "2", "3", "a", "b", "c"]

數(shù)組轉(zhuǎn)化為字符串

Array.prototype.join(separator)  //以separator（默認(rèn)為逗號(hào)）拼接為字符串。
Array.prototype.toString()   //把數(shù)組轉(zhuǎn)換為字符串, 數(shù)組中的元素之間用逗號(hào)分隔。

eg:

arr1.join() //"1,2,3"
arr1.join("") //"123"
arr1.join("/") //"1/2/3"
arr1.toString() //"1,2,3"

填充

Array.prototype.fill(value,start,end)
//value 為填充值
//start 為填充數(shù)組元素起點(diǎn)坐標(biāo)
//end 為填充數(shù)組元素終點(diǎn)坐標(biāo)

eg:

arr1.fill(0,1,2) // ["1", 0, "3"]

判斷

Array.isArray()
Array.isArray(arr1) //true

篩選

Array.prototype.filter()
Array.prototype.map()

eg:

var words = [
    {
        id: "1",
        name: "123"
    },
    {
        id: "2",
        name: "abc"
    }
]

words.filter(d => d.id === "1") //[{id: "1" , name: "123"}] 返回結(jié)果為true的值
arr1.map(x => x * 2)  // [2,4,6] 返回所有項(xiàng)

排序

Array.prototype.reverse()   //位置顛倒
Array.prototype.sort()

eg:

arr1.reverse() //["3", 2, "1"]
arr1.sort()  //["1", "2", "3"]

遞歸

Array.prototype.reduce()

eg:

const reducer = (accumulation,currentValue)=>{
    accumulation + currentValue
}
arr1.reduce(reducer)       // 1+2+3=6
arr1.reduce(reducer,4)     //4+1+2+3=10

查找

Array.prototype.some(callback)    //執(zhí)行callback函數(shù)，直到callback返回true

var even =  function(element){
    return element % 2 === 0
}

arr1.some(even)  //true

Array.prototype.every(callback) //數(shù)組的所有元素是否都通過(guò)callback函數(shù)

function even(currentValue){
    return currentValue < 5
}

arr1.every(even)

Array.prototype.find(callback) //在數(shù)組中返回符合callback第一個(gè)元素的值

function even(value){
    return even % 2 === 0
}

arr1.find(even) // 2

Array.prototype.findIndex(callback)  //返回?cái)?shù)組中滿足callback的第一個(gè)元素的索引。否則返回-1

function even(value){
    return value % 2 === 0
}

arr1.findIndex(even)   // 1

Array.prototype.includes(searchElement) //是否包含seachElement

arr1.includes(2)  //true

arr1.includes(0)  //false

增刪

pop()

Array.prototype.pop()  //刪除數(shù)組的最后一個(gè)元素，并返回改元素的值

arr1.pop() //  3  arr1=[1,2]

push()

Array.prototype.push()  //增加元素到數(shù)組末尾，返回增加的元素

arr1.push(4) // 4  ?arr1=[1, 2, 3, 4]

shift()

Array.prototype.shift()  //刪除數(shù)組第一個(gè)元素，返回這個(gè)元素值

arr1.shift()  // 1   arr1=[2,3]

unshift()

Array.prototype.unshift()   //增加元素到數(shù)組開(kāi)頭 ，返回?cái)?shù)組長(zhǎng)度  

arr1.unshift(0) //4  arr1=[0,1,2,3]

slice()

Array.prototype.slice(start,end) //返回[start,end]淺拷貝到一個(gè)新數(shù)組，原數(shù)組不會(huì)被修改

arr1.slice(0,2)  //[1,2]  arr1=[1,2,3]

splice()

Array.prototype.splice()  //通過(guò)刪除現(xiàn)有元素或添加新元素來(lái)更改一個(gè)數(shù)組的內(nèi)容，原數(shù)組會(huì)被修改

Array.prototype.slice(replace-index,replace-num,replace-value)

//replace-num = 0 => inserts
arr1.splice(1,0,0)  //arr1=[1,0,2,3]

//replace-num !== 0 => replace
arr1.splice(1,1,4)  //返回被替換的元素 =>2  arr1=[1,4,3]

循環(huán)遍歷

map()

Array.prototype.map(callback)

arr1.map(val=>val*2)  // [2, 4, 6]

forEach()

Array.prototype.forEach(callback)

arr1.forEach(elem =>{
    console.log(elem)
})

// 1
// 2
// 3

entries()

Array.prototype.entries()   //返回一個(gè)新的Array Iterator對(duì)象，該對(duì)象包含數(shù)組中每個(gè)索引的鍵/值對(duì)

arr1 = ["a", "b", "c"]

for( let [index,elem] of (arr1).entries()){
    console.log(index,elem)
}

// 0 "a"
// 1 "b"
// 2 "c"

keys()

Array.prototype.keys()  //返回一個(gè)新的Array迭代器，它包含數(shù)組中每個(gè)索引的鍵

for(let index of(arr1).keys()){
    console.log(index)
}

// 0
// 1
// 2

values()

Array.prototype.values()  //返回一個(gè)新的Array迭代對(duì)象，包含數(shù)組每個(gè)索引值

for(let elem of(arr1).values()){
    console.log(elem)
}

// a
// b
// c

GPU云服務(wù)器云服務(wù)器 js數(shù)組操作方法數(shù)組操作方法 java數(shù)組知識(shí)小結(jié) js數(shù)組方法

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/100613.html

發(fā)表評(píng)論

登陸后可評(píng)論

0條評(píng)論

April

男|高級(jí)講師

我要關(guān)注我要私信

TA的文章

tensorflow

閱讀 2520·2023-04-25 17:37
舍利云：寒冬取暖價(jià)8元月付vps，支持linux系統(tǒng),可選/美國(guó)/新加坡/法國(guó)/加拿大/印度

閱讀 1203·2021-11-24 10:29
速云：香港HGC商寬獨(dú)享云服務(wù)器9折495元/月起(不限月流量、獨(dú)享帶寬)

閱讀 3709·2021-09-09 11:57
spinservers：圣何塞/達(dá)拉斯10Gbps帶寬高配服務(wù)器月付89美元起

閱讀 704·2021-08-10 09:41
Web頁(yè)面中png jpg gif webp svg的區(qū)別和使用

閱讀 2257·2019-08-30 15:55
CSS常見(jiàn)布局與居中

閱讀 2822·2019-08-30 15:54
前端排序算法總結(jié)；前端面試題2.0；JavaScript異步編程

閱讀 1951·2019-08-30 15:53
初識(shí)wkhtmltopdf

閱讀 906·2019-08-30 15:43

成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專(zhuān)欄INFORMATION COLUMN

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！

js數(shù)組操作方法小結(jié)

相關(guān)文章

JS數(shù)組去重方法小結(jié)

【讀書(shū)筆記】《高性能JavaScript》

高性能JavaScript（文檔）

關(guān)于promise的小結(jié)

**面試小結(jié)（二）**

發(fā)表評(píng)論

0條評(píng)論

April

男|高級(jí)講師

TA的文章

tensorflow

舍利云：寒冬取暖價(jià)8元月付vps，支持linux系統(tǒng),可選/美國(guó)/新加坡/法國(guó)/加拿大/印度

速云：香港HGC商寬獨(dú)享云服務(wù)器9折495元/月起(不限月流量、獨(dú)享帶寬)

spinservers：圣何塞/達(dá)拉斯10Gbps帶寬高配服務(wù)器月付89美元起

Web頁(yè)面中png jpg gif webp svg的區(qū)別和使用

CSS常見(jiàn)布局與居中

前端排序算法總結(jié)；前端面試題2.0；JavaScript異步編程

初識(shí)wkhtmltopdf

最新活動(dòng)

資訊專(zhuān)欄INFORMATION COLUMN

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！

js數(shù)組操作方法小結(jié)

相關(guān)文章

發(fā)表評(píng)論

0條評(píng)論

男|高級(jí)講師

TA的文章

最新活動(dòng)

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！