JavaScript數(shù)組筆記3:ES5中新增Array方法(二)

3粒蜈、some蚀狰、every

some : some() 方法測試數(shù)組中的某些元素是否通過由提供的函數(shù)實現(xiàn)的測試

語法: arr.some(callback[, thisArg])

some 為數(shù)組中的每一個元素執(zhí)行一次 callback 函數(shù),直到找到一個使得 callback 返回一個“真值”(即可轉(zhuǎn)換為布爾值 true 的值)襟铭。如果找到了這樣一個值,some 將會立即返回 true。否則碎绎,some 返回 false

demo

function isBigEnough(element, index, array) {
  return  element >= 10;
}

var pass1 = [2, 5, 8, 1, 4].some(isBigEnough);
var pass2 = [12, 5, 8, 1, 4].some(isBigEnough);

console.log(pass1)      //false
console.log(pass2)      //true

every: every() 方法測試數(shù)組的所有元素是否都通過了指定函數(shù)的測試。

語法: arr.some(callback[, thisArg])

every 方法為數(shù)組中的每個元素執(zhí)行一次 callback 函數(shù)抗果,直到它找到一個使 callback 返回 false(表示可轉(zhuǎn)換為布爾值 false 的值)的元素筋帖。如果發(fā)現(xiàn)了一個這樣的元素,every 方法將會立即返回 false冤馏。否則日麸,callback 為每一個元素返回 true,every 就會返回 true逮光。

demo

function isBigEnough(element, index, array) {
  return  element >= 10;
}

var pass1 = [12, 15, 8, 11, 4].every(isBigEnough);
var pass2 = [12, 15, 18, 11, 14].every(isBigEnough);

console.log(pass1)      //false
console.log(pass2)      //true

4代箭、indexOf、lastIndexOf

indexOf()方法返回在數(shù)組中可以找到一個給定元素的第一個索引涕刚,如果不存在嗡综,則返回-1。

語法: arr.indexOf(searchElement[, fromIndex = 0])

  • searchElement : 要查找的元素
  • fromIndex: 可選參數(shù)副女,開始查找的位置

demo1:找出指定元素出現(xiàn)的所有位置

var arr = ['a','b','a', 'c', 'a', 'd']
var element = 'a'
var index = arr.indexOf(element)

var indices = []
while( index!=-1 ) {
  indices.push(index);
  index = arr.indexOf(element,index+1)
}

console.log(indices);  //[0,2,4]

lastIndexOf和indexOf類似蛤高,只不過是從后面開始索引蚣旱,詳細可參考MDN的lastIndexOf

4、reduce戴陡、reduceRight

reduce: reduce() 方法對累加器和數(shù)組中的每個元素 (從左到右)應(yīng)用一個函數(shù)塞绿,將其“減少”為單個值,其實功能更接近于“迭代恤批、遞歸”

語法: arr.reduce(callback,[initialValue])

callback包含四個參數(shù)

  • accumulator
    上一次調(diào)用回調(diào)返回的值异吻,或者是提供的初始值(initialValue)
  • currentValue
    數(shù)組中正在處理的元素
  • currentIndex
    數(shù)據(jù)中正在處理的元素索引,如果提供了 initialValue 喜庞,從0開始诀浪;否則從1開始
  • array
    調(diào)用 reduce 的數(shù)組

initialValue為可選參數(shù),其值用于第一次調(diào)用 callback 的第一個參數(shù)

如何調(diào)用:

reduce 為數(shù)組中的每一個元素依次執(zhí)行回調(diào)函數(shù)延都,回調(diào)函數(shù)callback第一次執(zhí)行時雷猪,accumulator 和 currentValue 的取值有兩種情況:
1、調(diào)用 reduce 時提供initialValue晰房,accumulator 取值為 initialValue 求摇,currentValue 取數(shù)組中的第一個值;
2殊者、沒有提供 initialValue 与境,accumulator 取數(shù)組中的第一個值,currentValue 取數(shù)組中的第二個值猖吴。

demo1:一個簡單的例子

var arr= [0,1,2,3,4]
var a = arr.reduce(function(accumulator, currentValue, currentIndex, array){
  return accumulator + currentValue;
});

console.log(a)      //10

callback 被調(diào)用四次,其每次調(diào)用各參數(shù)的取值和返回值如下:

callback調(diào)用拆解分析

demo2:二維數(shù)組的扁平化

var matrix = [
  [1, 2],
  [3, 4],
  [5, 6]
];

var flat = matrix.reduce(function(a,b)  {
  return a.concat(b)
});

console.log(flat);       //output : [1, 2, 3, 4, 5, 6]

reduceRight于reduce相比摔刁,用法類似array.reduceRight(callback[, initialValue]),差異在于reduceRight是從數(shù)組的末尾開始實現(xiàn),更多可參考MDN的reduceRight

5、進一步的應(yīng)用

可以將數(shù)組的這些方法應(yīng)用到其他對象上海蔽,這里舉一個forEach遍歷DOM元素的例子

var ele = document.querySelectorAll('div');
//這里相當于借用了Array.prototype.forEach方法
Array.prototype.forEach.call(ele  function(div) {
    console.log("該div類名是:" + (div.className || "空"));
});

這些我們可以拓展我們平時遇到的一些類數(shù)組都可以通過這樣的原理來賦予其數(shù)組的方法共屈,哇JavaScript是不是很靈活、很強大

參考鏈接:MDN標準党窜、張鑫旭的文章

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末趁俊,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子刑然,更是在濱河造成了極大的恐慌寺擂,老刑警劉巖,帶你破解...
    沈念sama閱讀 216,372評論 6 498
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件泼掠,死亡現(xiàn)場離奇詭異怔软,居然都是意外死亡,警方通過查閱死者的電腦和手機择镇,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,368評論 3 392
  • 文/潘曉璐 我一進店門挡逼,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人腻豌,你說我怎么就攤上這事家坎≈瞿埽” “怎么了?”我有些...
    開封第一講書人閱讀 162,415評論 0 353
  • 文/不壞的土叔 我叫張陵虱疏,是天一觀的道長惹骂。 經(jīng)常有香客問我,道長做瞪,這世上最難降的妖魔是什么对粪? 我笑而不...
    開封第一講書人閱讀 58,157評論 1 292
  • 正文 為了忘掉前任,我火速辦了婚禮装蓬,結(jié)果婚禮上著拭,老公的妹妹穿的比我還像新娘。我一直安慰自己牍帚,他們只是感情好儡遮,可當我...
    茶點故事閱讀 67,171評論 6 388
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著暗赶,像睡著了一般峦萎。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上忆首,一...
    開封第一講書人閱讀 51,125評論 1 297
  • 那天,我揣著相機與錄音被环,去河邊找鬼糙及。 笑死,一個胖子當著我的面吹牛筛欢,可吹牛的內(nèi)容都是我干的浸锨。 我是一名探鬼主播,決...
    沈念sama閱讀 40,028評論 3 417
  • 文/蒼蘭香墨 我猛地睜開眼版姑,長吁一口氣:“原來是場噩夢啊……” “哼柱搜!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起剥险,我...
    開封第一講書人閱讀 38,887評論 0 274
  • 序言:老撾萬榮一對情侶失蹤聪蘸,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后表制,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體健爬,經(jīng)...
    沈念sama閱讀 45,310評論 1 310
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,533評論 2 332
  • 正文 我和宋清朗相戀三年么介,在試婚紗的時候發(fā)現(xiàn)自己被綠了娜遵。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,690評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡壤短,死狀恐怖设拟,靈堂內(nèi)的尸體忽然破棺而出慨仿,到底是詐尸還是另有隱情,我是刑警寧澤纳胧,帶...
    沈念sama閱讀 35,411評論 5 343
  • 正文 年R本政府宣布镰吆,位于F島的核電站,受9級特大地震影響躲雅,放射性物質(zhì)發(fā)生泄漏鼎姊。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,004評論 3 325
  • 文/蒙蒙 一相赁、第九天 我趴在偏房一處隱蔽的房頂上張望相寇。 院中可真熱鬧,春花似錦钮科、人聲如沸唤衫。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,659評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽佳励。三九已至,卻和暖如春蛆挫,著一層夾襖步出監(jiān)牢的瞬間赃承,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,812評論 1 268
  • 我被黑心中介騙來泰國打工悴侵, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留瞧剖,地道東北人。 一個月前我還...
    沈念sama閱讀 47,693評論 2 368
  • 正文 我出身青樓可免,卻偏偏與公主長得像抓于,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子浇借,可洞房花燭夜當晚...
    茶點故事閱讀 44,577評論 2 353

推薦閱讀更多精彩內(nèi)容