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

資訊專欄INFORMATION COLUMN

javaScript數(shù)組遍歷方法總結(jié)

shiguibiao / 672人閱讀

摘要：首次調(diào)用回調(diào)函數(shù)時(shí)，和可以是兩個(gè)值之一。否則返回張三男王小毛男李四男李四返回結(jié)果為李四男方法李四對(duì)于數(shù)組中的每個(gè)元素，方法都會(huì)調(diào)用一次回調(diào)函數(shù)采用升序索引順序，直到有元素返回。

數(shù)組遍歷方法 1.for循環(huán)

使用臨時(shí)變量，將長度緩存起來，避免重復(fù)獲取數(shù)組長度，當(dāng)數(shù)組較大時(shí)優(yōu)化效果才會(huì)比較明顯。

for(var j = 0,j < arr.length;j++) {
   //執(zhí)行代碼
}
2.foreach循環(huán)

遍歷數(shù)組中的每一項(xiàng)，沒有返回值，對(duì)原數(shù)組沒有影響，不支持IE

arr.forEach((item,index,array)=>{
    //執(zhí)行代碼
})
//參數(shù)：value數(shù)組中的當(dāng)前項(xiàng), index當(dāng)前項(xiàng)的索引, array原始數(shù)組；
//數(shù)組中有幾項(xiàng)，那么傳遞進(jìn)去的匿名回調(diào)函數(shù)就需要執(zhí)行幾次；
3.map循環(huán)

有返回值，可以return出來map的回調(diào)函數(shù)中支持return返回值；return的是啥，相當(dāng)于把數(shù)組中的這一項(xiàng)變?yōu)樯叮ú⒉挥绊懺瓉淼臄?shù)組，只是相當(dāng)于把原數(shù)組克隆一份，把克隆的這一份的數(shù)組中的對(duì)應(yīng)項(xiàng)改變了)

arr.map(function(value,index,array){
　　//do something
　　return XXX
})
var ary = [12,23,24,42,1]; 
var res = ary.map(function (item,index,ary ) { 
    return item*10; 
}) 
console.log(res);//-->[120,230,240,420,10];  原數(shù)組拷貝了一份，并進(jìn)行了修改
console.log(ary);//-->[12,23,24,42,1]；  原數(shù)組并未發(fā)生變化
4.forof遍歷

可以正確響應(yīng)break、continue和return語句

for (var value of myArray) {
console.log(value);
}
5.filter遍歷

不會(huì)改變?cè)紨?shù)組,返回新數(shù)組

var arr = [
  { id: 1, text: "aa", done: true },
  { id: 2, text: "bb", done: false }
]
console.log(arr.filter(item => item.done))
轉(zhuǎn)為ES5
arr.filter(function (item) {
  return item.done;
});
var arr = [73,84,56, 22,100]
var newArr = arr.filter(item => item>80)   //得到新數(shù)組 [84, 100]
console.log(newArr,arr)
6.every遍歷

every()是對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù)，如果該函數(shù)對(duì)每一項(xiàng)返回true,則返回true。

var arr = [ 1, 2, 3, 4, 5, 6 ]; 
console.log( arr.every( function( item, index, array ){ 
        return item > 3; 
    })); 
false
7.some遍歷

some()是對(duì)數(shù)組中每一項(xiàng)運(yùn)行指定函數(shù)，如果該函數(shù)對(duì)任一項(xiàng)返回true，則返回true。

var arr = [ 1, 2, 3, 4, 5, 6 ]; 
   
    console.log( arr.some( function( item, index, array ){ 
        return item > 3; 
    })); 
true
8.reduce

reduce() 方法接收一個(gè)函數(shù)作為累加器（accumulator），數(shù)組中的每個(gè)值（從左到右）開始縮減，最終為一個(gè)值。

var total = [0,1,2,3,4].reduce((a, b)=>a + b); //10

reduce接受一個(gè)函數(shù)，函數(shù)有四個(gè)參數(shù)，分別是：上一次的值，當(dāng)前值，當(dāng)前值的索引，數(shù)組

[0, 1, 2, 3, 4].reduce(function(previousValue, currentValue, index, array){
 return previousValue + currentValue;
});
9.reduceRight

reduceRight()方法的功能和reduce()功能是一樣的，不同的是reduceRight()從數(shù)組的末尾向前將數(shù)組中的數(shù)組項(xiàng)做累加。
reduceRight()首次調(diào)用回調(diào)函數(shù)callbackfn時(shí)，prevValue 和 curValue 可以是兩個(gè)值之一。如果調(diào)用 reduceRight() 時(shí)提供了 initialValue 參數(shù)，則 prevValue 等于 initialValue，curValue 等于數(shù)組中的最后一個(gè)值。如果沒有提供 initialValue 參數(shù)，則 prevValue 等于數(shù)組最后一個(gè)值， curValue 等于數(shù)組中倒數(shù)第二個(gè)值。

var arr = [0,1,2,3,4];
 
arr.reduceRight(function (preValue,curValue,index,array) {
    return preValue + curValue;
}); // 10
10.find

find()方法返回?cái)?shù)組中符合測試函數(shù)條件的第一個(gè)元素。否則返回undefined

var stu = [
    {
        name: "張三",
        gender: "男",
        age: 20
    },
    {
        name: "王小毛",
        gender: "男",
        age: 20
    },
    {
        name: "李四",
        gender: "男",
        age: 20
    }
]
function getStu(element){
   return element.name == "李四"
}
 
stu.find(getStu)
//返回結(jié)果為
//{name: "李四", gender: "男", age: 20}

ES6方法

stu.find((element) => (element.name == "李四"))
11.findIndex

對(duì)于數(shù)組中的每個(gè)元素，findIndex 方法都會(huì)調(diào)用一次回調(diào)函數(shù)（采用升序索引順序），直到有元素返回 true。只要有一個(gè)元素返回 true，findIndex 立即返回該返回 true 的元素的索引值。如果數(shù)組中沒有任何元素返回 true，則 findIndex 返回 -1。
findIndex 不會(huì)改變數(shù)組對(duì)象。

[1,2,3].findIndex(function(x) { x == 2; });
// 返回索引值1

[1,2,3].findIndex(x => x == 4);
// 返回索引值 -1.
12.keys，values，entries

ES6 提供三個(gè)新的方法 —— entries()，keys()和values() —— 用于遍歷數(shù)組。它們都返回一個(gè)遍歷器對(duì)象，可以用for...of循環(huán)進(jìn)行遍歷，唯一的區(qū)別是keys()是對(duì)鍵名的遍歷、values()是對(duì)鍵值的遍歷，entries()是對(duì)鍵值對(duì)的遍歷

for (let index of ["a", "b"].keys()) {
console.log(index);
}
// 0
// 1
for (let elem of ["a", "b"].values()) {
console.log(elem);
}
// "a"
// "b"
for (let [index, elem] of ["a", "b"].entries()) {
console.log(index, elem);
}
// 0 "a"
// 1 "b"

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

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

相關(guān)文章

  • JavaScript遍歷對(duì)象和數(shù)組的方法總結(jié)

    摘要：日常開發(fā)中我們難免需要對(duì)數(shù)組和對(duì)象進(jìn)行遍歷，今天抽空來總結(jié)下遍歷數(shù)組和對(duì)象常用的方法。使用遍歷對(duì)象注只能遍歷出自身可枚舉的屬性，而不能遍歷出原型鏈上面的屬性。 日常開發(fā)中我們難免需要對(duì)數(shù)組和對(duì)象進(jìn)行遍歷，今天抽空來總結(jié)下遍歷數(shù)組和對(duì)象常用的方法。 Javascript遍歷數(shù)組總結(jié) 我們定義一個(gè)數(shù)組 var arr = [2,4,6]; 1.使用for循環(huán)遍歷 var lengt...

    jiekechoo 評(píng)論0 收藏0

  • Javascript各種數(shù)組遍歷方法歸納總結(jié)和兼容寫法

    摘要：主要用于枚舉對(duì)象數(shù)組遍歷效率最低的方法。當(dāng)前數(shù)組元素的值。傳遞給函數(shù)的初始值注意對(duì)于空數(shù)組是不會(huì)執(zhí)行回調(diào)函數(shù)的。 前言 PS: 2018/04/26 優(yōu)化一下排版,重新梳理一下方法,補(bǔ)充一些信息,刪除JQuery庫用法,只講解Javascript自帶的, for in 語句用于遍歷數(shù)組或者對(duì)象的屬性（對(duì)數(shù)組或者對(duì)象的屬性進(jìn)行循環(huán)操作）。主要用于枚舉對(duì)象, 數(shù)組遍歷效率最低的方法。 va...

    Sanchi 評(píng)論0 收藏0

  • JavaScript數(shù)組循環(huán)遍歷總結(jié)

    摘要：如果省略，則將用作值返回值如果函數(shù)為所有數(shù)組元素返回，則為否則為。不為數(shù)組中缺少的元素調(diào)用該回調(diào)函數(shù)。數(shù)組元素的數(shù)字索引。方法會(huì)為中的每個(gè)元素調(diào)用函數(shù)，直到返回，或直到到達(dá)數(shù)組的結(jié)尾。 這一部分應(yīng)該放在《JavaScript處理數(shù)組函數(shù)總結(jié)》里面的，但是。。。。。。沒有但是。 1. for for循環(huán)最常用的地方是利用索引來遍歷數(shù)組： var arr = [Microsoft,Goog...

    missonce 評(píng)論0 收藏0

  • Javascript基礎(chǔ)之Array數(shù)組API

    摘要：數(shù)組原型提供的方法非常之多，主要分為三種直接修改原數(shù)組原數(shù)組不變，返回新數(shù)組數(shù)組遍歷方法直接修改原數(shù)組的刪除一個(gè)數(shù)組中的最后的一個(gè)元素，并且返回這個(gè)元素添加一個(gè)或者多個(gè)元素到數(shù)組末尾，并且返回?cái)?shù)組新的長度刪除數(shù)組的第一個(gè)元素，并返回這個(gè)元素 Javascript數(shù)組原型提供的方法非常之多，主要分為三種： 直接修改原數(shù)組 原數(shù)組不變，返回新數(shù)組 數(shù)組遍歷方法 直接修改原數(shù)組的API ...

    hsluoyz 評(píng)論0 收藏0

  • javascript遍歷方法總結(jié)

    摘要：總之，是用來循環(huán)帶有字符串的對(duì)象的方法。循環(huán)里引入了一種新的循環(huán)方法，它就是循環(huán)，它既比傳統(tǒng)的循環(huán)簡潔，同時(shí)彌補(bǔ)了和循環(huán)的短板。 forEach 循環(huán) JavaScript誕生已經(jīng)有20多年了，我們一直使用的用來循環(huán)一個(gè)數(shù)組的方法是這樣的： for (var index = 0; index < myArray.length; index++) { console.log(myAr...

    BothEyes1993 評(píng)論0 收藏0

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

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<