Array沒有indexOf方法,這樣在一個陣列中查找某個元素的索引時比較麻煩,為了呼叫方便,於是透過prototype原型擴展了Array.prototype.indexOf(),這樣用起來就比較方便了。但是這個自訂的indexOf在對陣列進行遍歷的時候卻出現了問題。
Array沒有indexOf方法,這樣在一個數組中查找某個元素的索引時比較麻煩,為了調用方便,於是透過prototype原型擴展了Array.prototype.indexOf(),這樣用起來就比較方便了。
Array.prototype.indexOf = function(item) { 🎜>for (var i = 0; i if (this[i] == item)
return i;
}
return -1;
}
用的時候直接
程式碼如下:
var arr=[1,2,3,4,5];
var index=arr.indexOf(1); //index==0
擴展了以後,用起來很爽很方便,一片和諧景象...
但是某次是遍歷數組元素的時候,使用for..in..循環,引發了其他的問題,打破了這個和諧的氛圍。 複製程式碼
代碼如下:
var a=["張飛","關羽" ,"劉備","呂布"];
for(var p in a){
document.write(p "=" a[p] "
");
}
本來想輸出這四個人的名字,結果輸出的是什麼?
輸出的居然是:
//0=張飛
//1=關羽
//2=劉備
//3=呂布
//indexOf=function( item) { for (var i = 0; i 除了把名字打出來以外,還額外輸出了自己擴充的方法indexOf,但是令人瘋狂的是,firefox卻是「正常」的,只有四個人的人名,為什麼會這樣?
輸出indexOf,自己擴充的,可以理解,畢竟for..in是遍歷一個物件的所有使用者定義的屬性或一個陣列的所有元素。
那麼firefox為什麼不會呢?
後來查了資料才明白,
Array在javascript1.6版本已經支援Array.indexOf(),而我用的firefox是3.5版本,已經支援javascript1.8了,indexOf是其Array本身固有的方法了。
而IE,即使我用的是IE8,也才支援到javascript1.3版本。
所以IE8認為indexOf是“使用者定義的屬性”,而firefox認為是自己原生支援的固有的屬性。
真的是這樣嗎?
做個實驗,把indexOf更名為myIndexOf,再試試,結果IE和firefox都輸出myIndexOf,證明前面的觀點是正確。
那麼又來了個問題,我擴充indexOf很久了,現在不少專案的程式碼都已經在使用這個方法,而現在我非要使用for..in輸出陣列本身的元素,不要其他我自己擴充到俄羅斯方法,怎麼辦?
好在javascript提供了hasOwnProperty方法。
看一下其描述:
Every object descended from Object inherits the hasOwnProperty method. This method can be used to determine whether an object has the specified property as a direct property of that obke inject the like in object property of that inobject like in object, 片片does not check down the object's prototype chain
看描述,就是我們想要的東西。
在for...in..裡面做個判斷就OK了複製程式碼
程式碼如下:
if(a.hasOwnProperty(p)){
document.write(p "=" a[p] "
");
}
另外,附上hasOwnProperty用法範例,來自互聯網: 複製程式碼
程式碼如下:
function Book(title, author) {
this.title = title;
this.author = author;
}
Book.prototype.price = 9.99;
Object.prototype.copyright = "herongyang.com";
var myBook = new Book("JavaScript Tutorials", "Herong Yang");
// Dumping built-in properties at the base prototype level
document.writeln("/nObject.prototype's built-in properties:");
dumpProperty(Object.prototype, "constructor");
dumpProperty(Object.prototype, "hasOwnProperty");
dumpProperty(Object.prototype, "isPrototypeOf");
dumpProperty(Object.prototype, "toString");
dumpProperty(Object.prototype, "valueOf");
dumpProperty(Object.prototype, "copyright");
// Dumping built-in properties at the my prototype level
document.writeln("/n==================/nBook.prototype's built-in properties:");
dumpProperty(Book.prototype, "constructor");
dumpProperty(Book.prototype, "hasOwnProperty");
dumpProperty(Book.prototype, "isPrototypeOf");
dumpProperty(Book.prototype, "toString");
dumpProperty(Book.prototype, "valueOf");
dumpProperty(Book.prototype, "copyright");
// Dumping built-in properties at the object level
document.writeln("/n==================/nmyBook's built-in properties:");
dumpProperty(myBook, "constructor");
dumpProperty(myBook, "hasOwnProperty");
dumpProperty(myBook, "isPrototypeOf");
dumpProperty(myBook, "toString");
dumpProperty(myBook, "valueOf");
dumpProperty(myBook, "copyright");
function dumpProperty(object, property) {
var inheritance;
if (object.hasOwnProperty(property))
inheritance = "Local";
else
inheritance = "Inherited";
document.writeln(property ": " inheritance ": "
object[property]);
}
查看浏览器支持javascript到哪个版本: