1.for...in是ES6之前的語法，for...of是ES6語法
2. for...in只能獲取物件的鍵名，for...of可以獲取鍵值，
// 使用for...if
var names = ['ming', 'hua', 'li']
for (var name in names) {
console.log(name)
}
// 0
// 1
// 2
// 使用for...in
let names2 = ['ming', 'hua', 'li']
for (let name of names2) {
console.log(name)
}
// ming
// hua
// li
3. for…of只會遍歷具有數字索引的屬性，for…in會便利全部的索引
let arr =[1, 5, 8]
arr.name = 'long'
// 使用for...in
for (let i in arr) {
console.log(i)
}
// 0
// 1
// 2
// name
// 使用for...of
for (let i of arr) {
console.log(i)
}
// 1
// 5
// 8
// 添加數字屬性
arr[5] = 'foo'
// 使用for...in
for (let i in arr) {
console.log(i)
}
// 0
// 1
// 2
// 5
// name
// 使用for...of
for (let i of arr) {
console.log(i)
}
// 1
// 5
// 8
// undefined
// undefined
// foo
4.for…of不能遍歷普通的物件，for…in可以
let obj = {
name: 'long',
age: 18
}
// 使用for...in
for (let i in obj) {
console.log(i)
}
// name
// age
使用for...of
for (let i of obj) {
console.log(i)
}
// VM410:1 Uncaught TypeError: obj is not iterable
總結： for...in主要是為了遍歷物件， for...of是為了遍歷具有Iterator介面的資料結構，比如：Array、Map 、Set、String、TypedArray 、函式的 arguments 物件、NodeList 物件都是原生具備Iterator介面的，
Iterator（遍歷器）：ES6的新特性，是一種介面，為各種不同資料結構提供統一的資料訪問機制，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/291319.html
標籤：其他