關(guān)于js中for in的缺陷淺析
for in 語句用來列舉對象的屬性(成員)，如下
var obj = { name:"jack",
getName:function(){return this.name}
};
//輸出name,getName
for(var atr in obj) {
alert(atr);
}
注意了嗎，沒有輸出obj的toString，valueOf等內(nèi)置屬性（或稱內(nèi)置成員，隱藏屬性和預(yù)定義屬性）。即for in用來列舉對象的顯示成員（自定義成員）。
如果重寫了內(nèi)置屬性呢，下面就重寫obj的toString
var obj = {name:"jack",
getName:function(){return this.name},
toString:function(){return "I'm jack."}
}
for(var atr in obj) {
alert(atr);
}
會輸出什么呢？
1、IE6/7/8 下和沒有重寫toString一樣，仍然只輸出name,getName
2、IE9/Firefox/Chrome/Opera/Safari下則輸出name,getName,toString
如果給內(nèi)置原型添加屬性/方法，那么for in時也是可遍歷的
Object.prototype.clone = function() {}
var obj = {
name: 'jack',
age: 33
}
// name, age, clone
for (var n in obj) {
alert(n)
}
給Object.prototype添加了方法clone，for in時所有瀏覽器都顯示了clone。
這或許還沒什么，因為一般不建議去擴展內(nèi)置構(gòu)造器的原型，這也是Prototype.js走向沒落的原因之一。jQuery和Underscore沒有擴展自原型，前者在jQuery對象上做文章，后者索性將所有方法都掛在下劃線上。
但有時我們?yōu)榱思嫒軪S5或后續(xù)版本，會在不支持ES5的瀏覽器上（IE6/7/8）去擴展內(nèi)置構(gòu)造器的原型，這時for in在各瀏覽器中就不同了。如下
if (!Function.prototype.bind) {
Function.prototype.bind = function(scope) {
var fn = this
return function () {
fn.apply(scope, arguments)
}
}
}
function greet(name) {
alert(this.greet + ', ' + name)
}
for (var n in greet) {
alert(n)
}
IE6/7/8輸出了bind，其它瀏覽器則無。因為現(xiàn)代瀏覽器中bind是原生支持的，for in不到，IE6/7/8則是給Function.prototype添加了bind。
總結(jié)下：在跨瀏覽器的設(shè)計中，我們不能依賴于for in來獲取對象的成員名稱，一般使用hasOwnProperty來判斷下。
- js字符串的各種格式的轉(zhuǎn)換 ToString，F(xiàn)ormat
- javascript 循環(huán)語句 while、do-while、for-in、for用法區(qū)別
- JavaScript中for..in循環(huán)陷阱介紹
- 在Linux上用forever實現(xiàn)Node.js項目自啟動
- JavaScript中for-in遍歷方式示例介紹
- 得到form下的所有的input的js代碼
- 為javascript添加String.Format方法
- js使用for循環(huán)與innerHTML獲取選中tr下td值
- js在指定位置增加節(jié)點函數(shù)insertBefore()用法實例
- Javascript for in的缺陷總結(jié)
相關(guān)文章
這篇文章主要為大家詳細介紹了功能強大的Bootstrap使用手冊，分享了Bootstrap使用步驟和常用用法，感興趣的小伙伴們可以參考一下2016-08-08
js通過iframe加載外部網(wǎng)頁的實現(xiàn)代碼
這篇文章主要介紹了js通過iframe加載外部網(wǎng)頁的實現(xiàn)代碼,需要的朋友可以參考下2015-04-04
&&和||總是傻傻分不清,在這里詳細記錄一下吧,也給你們分享一下,所以這篇文章主要給大家介紹了關(guān)于javascript中&&運算符與||運算符的使用方法,需要的朋友可以參考下2021-11-11
使用JS給靜態(tài)頁面添加搜索功能的實現(xiàn)方法
靜態(tài)頁面通常由HTML、CSS 和 JavaScript 等靜態(tài)文件組成,這些文件在服務(wù)器上不會動態(tài)生成或修改,所以加載速度通常比較快,本文給大家介紹了如何只使用JS給靜態(tài)網(wǎng)頁添加站內(nèi)全局搜索功能,文中有詳細的解決方案,需要的朋友可以參考下2023-11-11
本文主要介紹了js調(diào)用百度分享功能的方法，具有很好的參考價值，下面跟著小編一起來看下吧2017-02-02
在多姿多彩的JavaScript世界,Polyfill如同一座架在瀏覽器兼容性鴻溝之上的橋梁,本文將介紹常見的JavaScript Polyfill兼容方案,并舉例說明它們的應(yīng)用,需要的可以參考下2023-12-12
這篇文章主要介紹了javascript封裝簡單實現(xiàn)方法,涉及javascript中方法與屬性的相關(guān)設(shè)置與使用技巧,非常簡單實用,需要的朋友可以參考下2015-08-08
JavaScript實現(xiàn)將圖片地址轉(zhuǎn)成文件流并上傳
這篇文章主要為大家詳細介紹了如何使用JavaScript實現(xiàn)將圖片地址轉(zhuǎn)成文件流并上傳,感興趣的小伙伴可以跟隨小編一起學習一下2024-04-04
近期為一家企業(yè)開發(fā)小程序,用戶提出了在小程序中增加直播功能,下面這篇文章主要給大家介紹了關(guān)于微信小程序開發(fā)中視頻播放和直播功能的相關(guān)資料,文中通過代碼介紹的非常詳細,需要的朋友可以參考下2024-08-08
文本框輸入數(shù)據(jù)后使用回車進行提交，想必大家都嘗試過吧，在本文有個不錯的示例，喜歡的朋友可以參下2013-09-09