for循環(huán)
最原始的遍歷宫补,自Javascript誕生起就一直用的 就是for循環(huán)檬姥,它用來遍歷數(shù)組
````
var arr = [1,2,3,4]
for(var i = 0 ; i< arr.length ; i++){
console.log(arr[i])
}
````
for循環(huán)中可以使用return粉怕、break等來中斷循環(huán)
forEach
對數(shù)組的每一個元素執(zhí)行一次提供的函數(shù)(不能使用return、break等中斷循環(huán))秉犹,不改變原數(shù)組稚晚,無返回值undefined。
````
let arr = ['a', 'b', 'c', 'd']
arr.forEach(function (val, idx, arr) {
? ? console.log(val + ', index = ' + idx) // val是當前元素鸳劳,index當前元素索引也搓,arr數(shù)組
? ? console.log(arr)
})
````
for…in
循環(huán)遍歷的值都是數(shù)據(jù)結構的鍵值
````
let obj = {a: '1', b: '2', c: '3', d: '4'}
for (let o in obj) {
? ? console.log(o)? ? //遍歷的實際上是對象的屬性名稱 a,b,c,d
? ? console.log(obj[o])? //這個才是屬性對應的值1,2还绘,3,4
}
````
?for in也可以循環(huán)數(shù)組但是特別適合遍歷對象
for…of
它是ES6中新增加的語法抚太,用來循環(huán)獲取一對鍵值對中的值
循環(huán)一個數(shù)組
````
let arr = ['China', 'America', 'Korea']
for (let o of arr) {
? ? console.log(o) //China, America, Korea
}
````
循環(huán)一個普通對象(報錯)
````
let obj = {a: '1', b: '2', c: '3', d: '4'}
for (let o of obj) {
? ? console.log(o)? //Uncaught TypeError: obj[Symbol.iterator] is not a function
}
````
一個數(shù)據(jù)結構只有部署了 Symbol.iterator 屬性, 才具有 iterator接口可以使用 for of循環(huán)昔案。例子中的obj對象沒有Symbol.iterator屬性 所以會報錯。
哪些數(shù)據(jù)結構部署了 Symbol.iteratoer屬性了呢?
1.數(shù)組 Array
2.Map
3.Set
4.String
5.arguments對象
6.Nodelist對象, 就是獲取的dom列表集合
如果想讓對象可以使用 for of循環(huán)怎么辦?使用 Object.keys() 獲取對象的 key值集合后,再使用 for of
````
let obj = {a: '1', b: '2', c: '3', d: '4'}
for (let o of Object.keys(obj)) {
? ? console.log(o) // a,b,c,d
}
````
或者使用內置的Object.values()方法獲取對象的value值集合再使用for of
````
let obj = {a: '1', b: '2', c: '3', d: '4'}
for (let o of Object.values(obj)) {
? ? console.log(o) // 1,2,3,4
}
````
循環(huán)一個字符串
````
let str = 'love'
for (let o of str) {
? ? console.log(o) // l,o,v,e
}
````
循環(huán)一個Map
````
let iterable = new Map([["a", 1], ["b", 2], ["c", 3]]);
for (let [key, value] of iterable) {
? console.log(value);
}
// 1
// 2
// 3
for (let entry of iterable) {
? console.log(entry);
}
// [a, 1]
// [b, 2]
// [c, 3]
````
循環(huán)一個Set
````
let iterable = new Set([1, 1, 2, 2, 3, 3]);
for (let value of iterable) {
? console.log(value);
}
// 1
// 2
// 3
````