常用的for 循環(huán)

ES5具有遍歷數(shù)組功能的還有map莉擒、filter、some瘫絮、every涨冀、reduce、reduceRight等麦萤,只不過(guò)他們的返回結(jié)果不一樣

1鹿鳖、map():通過(guò)指定函數(shù)處理數(shù)組的每個(gè)元素,并返回處理后的數(shù)組壮莹。
注意:map不會(huì)改變?cè)瓟?shù)組翅帜,map不會(huì)檢查空數(shù)組

var num = [4, 9, 16, 25];
num.map(Math.sqrt)  // [2, 3, 4, 5]
console.log(num)  // [4, 9, 16, 25]

2、some():用于檢測(cè)數(shù)組中的元素是否滿足指定條件(函數(shù)提供)

  • 如果有一個(gè)元素滿足條件垛孔,則表達(dá)式返回true ,剩余的元素不會(huì)再執(zhí)行檢測(cè)
  • 如果沒(méi)有滿足條件的元素藕甩,則返回false
  • unction形參和map一樣
    some不會(huì)改變?cè)瓟?shù)組,some不會(huì)檢查空數(shù)組
var ages = [3, 10, 18, 20];
ages.some(function(age){ return age>10})  // true
console.log(ages) // [3, 10, 18, 20];

3周荐、every:用于檢測(cè)數(shù)組所有元素是否都符合指定條件(通過(guò)函數(shù)提供)

every和some正好相反:

  • 如果數(shù)組中檢測(cè)到有一個(gè)元素不滿足狭莱,則整個(gè)表達(dá)式返回 false ,且剩余的元素不會(huì)再進(jìn)行檢測(cè)概作。
  • 如果所有元素都滿足條件腋妙,則返回 true。
var ages = [32, 33, 16, 40];

ages.every(checkAdult)  // false

 function checkAdult(age) {
    return age >= 18;
 }

4讯榕、filter:創(chuàng)建一個(gè)新的數(shù)組骤素,新數(shù)組中的元素是通過(guò)檢查指定數(shù)組中符合條件的所有元素

filter會(huì)根據(jù)函數(shù)中的篩選條件將返回的結(jié)果組成一個(gè)新的數(shù)組并返回

var ages = [32, 33, 16, 40];

function checkAdult(age) {
    return age >= 18;
}

function myFunction() {
    console.log(ages.filter(checkAdult));  // 32 33 40
}

5匙睹、forEach:

沒(méi)有返回值,只針對(duì)每個(gè)元素調(diào)用func济竹。
優(yōu)點(diǎn):代碼簡(jiǎn)介痕檬。
缺點(diǎn):無(wú)法使用break,return等終止循環(huán)送浊。

let list = [1, 2, 3, 4, 5];
let other = [];
list.forEach((d, i) => {
    other.push(d * 2);
});
console.log(other);
// print: [2, 4, 6, 8, 10]

6梦谜、for... in 和for... of 的區(qū)別

1、使用for in會(huì)遍歷數(shù)組所有的可枚舉屬性袭景,包括原型
2唁桩、原型方法method和name屬性,所以for in更適合遍歷對(duì)象耸棒,不要使用for in遍歷數(shù)組荒澡。for…in循環(huán)不僅遍歷數(shù)字鍵名,還會(huì)遍歷手動(dòng)添加的其他鍵与殃,甚至包括原型鏈上的鍵单山。
3、for…in遍歷出的結(jié)果是key奈籽;for…of遍歷出的結(jié)果是value

Array.prototype.method=function(){
  console.log(this.length);
}
var myArray=[1,2,4,5,6,7]
myArray.name="數(shù)組"
for (var index in myArray) {
  console.log(myArray[index]);
}
// 1,2,3,4,5,6,7,'數(shù)組'饥侵,function(){console.log(this.length);}

for in 可以遍歷到myObject的原型方法method,如果不想遍歷原型方法和屬性的話,可以在循環(huán)內(nèi)部判斷一下,hasOwnPropery方法可以判斷某屬性是否是該對(duì)象的實(shí)例屬性
只有屬性存在實(shí)例中才會(huì)返回true

for (var key in myObject) {
  if(myObject.hasOwnProperty(key)){
    console.log(key);
  }
}

同樣可以通過(guò)ES5的Object.keys(myObject)獲取對(duì)象的實(shí)例屬性組成的數(shù)組

如果要取得對(duì)象上所有可枚舉的實(shí)例屬性衣屏,可以使用Object.keys(), 返回字符串?dāng)?shù)組。

Object.prototype.method=function(){
  console.log(this);
}
var myObject={
  a:1,
  b:2,
  c:3
}
Object.keys(myObject)

//["a", "b", "c"]

4辩棒、for...of 不會(huì)遍歷原型狼忱,輸出value

Array.prototype.method=function(){
  console.log(this.length);
}
var myArray=[1,2,4,5,6,7]
myArray.name="數(shù)組";
for (var value of myArray) {
  console.log(value);
}
// 1,2,3,4,5,6,7
  • for..of適用遍歷數(shù)/數(shù)組對(duì)象/字符串/map/set等擁有迭代器對(duì)象的集合.但是不能遍歷對(duì)象,因?yàn)闆](méi)有迭代器對(duì)象.與forEach()不同的是,它可以正確響應(yīng)break一睁、continue和return語(yǔ)句

  • for-of循環(huán)不支持普通對(duì)象钻弄,但如果你想迭代一個(gè)對(duì)象的屬性,你可以用for-in循環(huán)(這也是它的本職工作)或內(nèi)建的Object.keys()方法:

for (var key of Object.keys(someObject)) {
  console.log(key + ": " + someObject[key]);
}

for-of循環(huán)首先調(diào)用集合的Symbol.iterator方法者吁,緊接著返回一個(gè)新的迭代器對(duì)象窘俺。迭代器對(duì)象可以是任意具有.next()方法的對(duì)象;for-of循環(huán)將重復(fù)調(diào)用這個(gè)方法复凳,每次循環(huán)調(diào)用一次

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末瘤泪,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子育八,更是在濱河造成了極大的恐慌对途,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,277評(píng)論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件髓棋,死亡現(xiàn)場(chǎng)離奇詭異实檀,居然都是意外死亡惶洲,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,689評(píng)論 3 393
  • 文/潘曉璐 我一進(jìn)店門膳犹,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)恬吕,“玉大人,你說(shuō)我怎么就攤上這事须床”液牵” “怎么了?”我有些...
    開封第一講書人閱讀 163,624評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵侨颈,是天一觀的道長(zhǎng)余赢。 經(jīng)常有香客問(wèn)我,道長(zhǎng)哈垢,這世上最難降的妖魔是什么妻柒? 我笑而不...
    開封第一講書人閱讀 58,356評(píng)論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮耘分,結(jié)果婚禮上举塔,老公的妹妹穿的比我還像新娘。我一直安慰自己求泰,他們只是感情好央渣,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,402評(píng)論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著渴频,像睡著了一般芽丹。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上卜朗,一...
    開封第一講書人閱讀 51,292評(píng)論 1 301
  • 那天拔第,我揣著相機(jī)與錄音,去河邊找鬼场钉。 笑死蚊俺,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的逛万。 我是一名探鬼主播泳猬,決...
    沈念sama閱讀 40,135評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼宇植!你這毒婦竟也來(lái)了得封?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 38,992評(píng)論 0 275
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤当纱,失蹤者是張志新(化名)和其女友劉穎呛每,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體坡氯,經(jīng)...
    沈念sama閱讀 45,429評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡晨横,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,636評(píng)論 3 334
  • 正文 我和宋清朗相戀三年洋腮,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片手形。...
    茶點(diǎn)故事閱讀 39,785評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡啥供,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出库糠,到底是詐尸還是另有隱情伙狐,我是刑警寧澤,帶...
    沈念sama閱讀 35,492評(píng)論 5 345
  • 正文 年R本政府宣布瞬欧,位于F島的核電站贷屎,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏艘虎。R本人自食惡果不足惜唉侄,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,092評(píng)論 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望野建。 院中可真熱鬧属划,春花似錦、人聲如沸候生。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,723評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)唯鸭。三九已至须蜗,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間肿孵,已是汗流浹背唠粥。 一陣腳步聲響...
    開封第一講書人閱讀 32,858評(píng)論 1 269
  • 我被黑心中介騙來(lái)泰國(guó)打工, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留停做,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 47,891評(píng)論 2 370
  • 正文 我出身青樓大莫,卻偏偏與公主長(zhǎng)得像蛉腌,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子只厘,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,713評(píng)論 2 354