for in的詳細講解, for in遍歷陣列的毛病

1.index索引為字串型數字，不能直接進行幾何運算.

2.遍歷順序有可能不是按照實際陣列的內部順序

3.使用for in會遍歷陣列[所有的可列舉屬性]。
包括[原型]。例如上慄的[原型方法]method和[name]屬性

所以for in更適合遍歷物件，儘量不要使用for in遍歷陣列。

for in中index索引為字串型數字

var myArray=[1,2,4,5,6,7]

myArray.name="name陣列"
for (var index in myArray) {
    //這裡可以說明是字串型數字
    console.log("字串型數字===>", index +1)
    //也說明了會遍歷【可列舉屬性】
    console.log(myArray[index]);
}
 

for in中會遍歷所有的可列舉屬性

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

for (var key in myObject) {
    console.log('key值',key);
}

for in不遍歷原型屬性和原型方法

有些時候，不遍歷原型屬性和原型方法。
我們可以使用Object.hasOwnPropery(keyName)
hasOwnProperty()用於判斷一個物件自身(不包括原型鏈)是否具有指定的屬性。如果有，返回true，否則返回false。

Object.prototype.say=function(){
　　console.log('say');
}
var myObject={
　　name:'範輕舟',
　　sex:'男',
　　age:25
}
// 往物件上新增屬性
myObject.likes='寫程式碼'
// 往物件上新增屬性
myObject['height']='1.80cm'
console.log(myObject )
for (var key in myObject) {
　　if(myObject.hasOwnProperty(key)){
　　　　console.log(key);
　　}
}
 

獲取物件上的所有key值

通過ES5的Object.keys(myObject)
獲取[物件例項]【屬性】組成的陣列，不包括原型方法和屬性

Object.prototype.say=function(){
　　console.log('say');
}
var myObject={
　　name:'範輕舟',
　　sex:'男',
　　age:25
}
let allkesy=Object.keys(myObject)
console.log( '獲取物件上的所有key值', allkesy)
輸出  ["name", "sex", "age"]

for-of遍歷陣列物件

let arr=[ 
    {name:'張三',age:13},
    {name:'張三',age:13},
    {name:'張三',age:13}
]

for(let cont of arr){
    //輸出  {name:'張三',age:13},
    console.log(cont);
}
 

for-of遍歷字串

let  strCont="你好啊!Javascript"
for (const item of strCont) {
    console.log(item);
}

for-of遍歷陣列新增一個key值

let arr=[
    {name:'張三',age:13},
    {name:'張三',age:13},
    {name:'張三',age:13}
]

for(let cont of arr){
    cont['newkeys']=''
}

區別

1==》for in遍歷的是陣列的索引（即鍵名）。
而for of遍歷的是陣列元素值。

2==》for in 是es5中有的，for of是es6的

3==》for-in是為遍歷物件而設計的，不適用於遍歷陣列。
它可以正確響應break、continue和return語句
for-in遍歷陣列的缺點：
因為for-in遍歷的index值"0","1","2"等是字串而不是數字
for-in迴圈存在缺陷：會遍歷物件自身的和繼承的可列舉屬性(不含Symbol屬性)

3==》for-of這個方法避開了for-in迴圈的所有缺陷
適用遍歷數/陣列物件/字串/map/set等擁有迭代器物件的集合
它可以正確響應break、continue和return語句

最後一句話

for in遍歷物件
for of比那裡陣列

參考的地址：https://www.cnblogs.com/zjx304/p/10687017.html

想問問題，打賞了卑微的博主，求求你備註一下的扣扣或者微信；這樣我好聯絡你；(っ•̀ω•́)っ✎⁾⁾！

如果覺得這篇文章對你有小小的幫助的話，記得在右下角點個“推薦”哦，或者關注博主，在此感謝！

萬水千山總是情，打賞5毛買辣條行不行，所以如果你心情還比較高興，也是可以掃碼打賞博主(っ•̀ω•́)っ✎⁾⁾！

想問問題，打賞了卑微的博主，求求你備註一下的扣扣或者微信；這樣我好聯絡你；(っ•̀ω•́)っ✎⁾⁾！