配列にはメソッドのインデックスがないため、配列内の要素のインデックスを見つける方が面倒です。呼び出しを容易にするために、array.prototype.indexof()は、プロトタイプのプロトタイプを介して拡張されます。ただし、このカスタムインデックスには、配列を横断する際に問題があります。
コードコピーは次のとおりです。
array.prototype.indexof = function(item){
for(var i = 0; i <this.length; i ++){
if(this [i] == item)
私を返します。
}
return -1;
}
それを使用するとき、それは簡単です
コードコピーは次のとおりです。
var arr = [1,2,3,4,5];
var index = arr.indexof(1); // index == 0
拡張後、それは非常に爽やかで便利です、そしてそれは調和のとれたシーンです...
しかし、1つのアレイ要素を繰り返して、for..inを使用します。ループは他の問題を引き起こし、調和のとれた雰囲気を壊しました。
コードコピーは次のとおりです。
var a = ["zhang fei"、 "guan yu"、 "liu bei"、 "lu bu"];
for(var p in a){
document.write(p+"="+a [p]+"<br/>");
}
私はもともとこれらの4人の名前を出力したかったのですが、結果は何でしたか?
出力は実際には次のとおりです。
コードコピーは次のとおりです。
// 0 = Zhang Fei
// 1 = Guan Yu
// 2 = Liu Bei
// 3 = lu bu
// indexof = function(item){for(var i = 0; i <this.length; i ++){if(this [i] == item)return i; } return -1; }
名前を入力することに加えて、独自の拡張メソッドインデックスも出力しますが、クレイジーなのは、Firefoxが「通常」であり、4人の名前しかないということです。なぜこれが起こっているのですか?
それ自体で拡張された出力インデックスは理解できます。結局のところ、オブジェクトのすべてのユーザー定義のプロパティまたは配列のすべての要素を反復することです。
では、なぜFirefoxではないのですか?
情報をチェックした後、私はそれを認識しました
ArrayはすでにJavaScript 1.6バージョンでarray.indexof()をサポートしていますが、私が使用するFirefoxはバージョン3.5であり、すでにJavaScript 1.8をサポートしています。 IndexOFは、配列自体の固有の方法です。
IEについては、IE8を使用していても、JavaScript 1.3バージョンのみをサポートします。
したがって、IE8は、IndexOFが「ユーザー定義の属性」であると考えていますが、Firefoxはそれが独自のネイティブサポートによってサポートされる固有の属性であると考えています。
これは本当にそうですか?
実験を行い、MyIndexofにインデックスを変更し、再試行してください。その結果、IEとFirefoxの両方がMyIndexofを出力し、前のポイントが正しいことを証明しました。
それから別の質問が来ます。私は長い間インデックスを拡張してきました。現在、多くのプロジェクトコードがこの方法を使用しています。これで、配列自体の要素を出力するために使用する必要があります。自分でロシアの方法に拡張しないでください。どうすればいいですか?
幸いなことに、JavaScriptはHasownPropertyメソッドを提供します。
その説明を見てください:
コードコピーは次のとおりです。
オブジェクトから下降したすべてのオブジェクトは、HasownPropertyメソッドを継承します。この方法は、オブジェクトがそのオブジェクトの直接プロパティとして指定されたプロパティを持っているかどうかを判断するために使用できます。 in operatorとは異なり、この方法はオブジェクトのプロトタイプチェーンをチェックダウンしません
説明から判断すると、それは私たちが望むものです。
...で判断を下すだけです...
コードコピーは次のとおりです。
if(a.hasownproperty(p)){
document.write(p+"="+a [p]+"<br/>");
}
さらに、HasownPropertyの使用の例が添付されています。これはインターネットから来ています。
コードコピーは次のとおりです。
functionbook(title、著者){
this.title = title;
this.author =著者;
}
book.prototype.price = 9.99;
object.prototype.copyright = "herongyang.com";
var mybook = new Book( "JavaScript Tutorials"、 "Herong Yang");
//ベースプロトタイプレベルでビルトインプロパティをダンプします
document.writeln( "/nobject.prototypeの組み込みプロパティ:");
dumpproperty(object.prototype、 "constructor");
dumpproperty(object.prototype、 "hasownproperty");
dumpproperty(object.prototype、 "isprototypeof");
dumpproperty(object.prototype、 "toString");
dumpproperty(object.prototype、 "valueof");
dumpproperty(object.prototype、 "Copyright");
//私のプロトタイプレベルでビルトインプロパティをダンプします
document.writeln( "/n ===============================================================================================================================
dumpproperty(book.prototype、 "constructor");
dumpproperty(book.prototype、 "hasownproperty");
dumpproperty(book.prototype、 "isprototypeof");
dumpproperty(book.prototype、 "toString");
dumpproperty(book.prototype、 "valueof");
dumpproperty(book.prototype、 "Copyright");
//オブジェクトレベルでビルトインプロパティをダンプします
document.writeln( "/n ======================/nmybookの組み込みプロパティ:");
Dumpproperty(MyBook、 "Constructor");
dumpproperty(mybook、 "hasownproperty");
dumpproperty(mybook、 "isprototypeof");
dumpproperty(mybook、 "tostring");
dumpproperty(mybook、 "valueof");
dumpproperty(mybook、 "Copyright");
function dumpproperty(オブジェクト、プロパティ){
var継承;
if(object.hasownproperty(プロパティ))
継承= "local";
それ以外
継承= "継承";
document.writeln(プロパティ+":"+継承+":"
+オブジェクト[プロパティ]);
}
ブラウザによってサポートされているJavaScriptのバージョンを確認してください。
コードコピーは次のとおりです。
<!doctype html public " - // w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<Meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<Title>ブラウザのJavaScriptバージョンはテストをサポートしています</title>
</head>
<body>
<スクリプト言語= "javascript">
//document.write("your browserタイプ: "+navigator.appname+" <br/> ");
//document.write("browserバージョン: "+navigator.appversion+" <br/> ");
// JavaScript 1.0をサポートするブラウザは、このスクリプトを実行できます
document.write( 'このブラウザはjavascript1.0 <br/>'をサポートしています);
</script>
<スクリプト言語= "javascript1.1">
// JavaScript 1.1をサポートするブラウザは、このスクリプトを実行できます
document.write( 'このブラウザはjavascript1.1 <br/>'をサポートしています);
</script>
<スクリプト言語= "javascript1.2">
// JavaScript 1.2をサポートするブラウザは、このスクリプトを実行できます
document.write( 'このブラウザーはjavascript1.2 <br/>'をサポートしています);
</script>
<スクリプト言語= "javascript1.3">
// JavaScript 1.3をサポートするブラウザは、このスクリプトを実行できます
document.write( 'このブラウザーはjavascript1.3 <br/>'をサポートしています);
</script>
<スクリプト言語= "javascript1.4">
// JavaScript 1.4をサポートするブラウザは、このスクリプトを実行できます
document.write( 'このブラウザーはjavascript1.4 <br/>'をサポートしています);
</script>
<スクリプト言語= "javascript1.5">
// JavaScript 1.5をサポートするブラウザは、このスクリプトを実行できます
document.write( 'このブラウザはjavascript1.5 <br/>'をサポートしています);
</script>
<スクリプト言語= "javascript1.6">
// JavaScript 1.6をサポートするブラウザは、このスクリプトを実行できます
document.write( 'このブラウザーはjavascript1.6 <br/>'をサポートしています);
</script>
<スクリプト言語= "javascript1.7">
// JavaScript 1.7をサポートするブラウザは、このスクリプトを実行できます
document.write( 'このブラウザーはjavascript1.7 <br/>'をサポートしています);
</script>
<スクリプト言語= "javascript1.8">
// JavaScript 1.8をサポートするブラウザは、このスクリプトを実行できます
document.write( 'このブラウザーはjavascript1.8 <br/>'をサポートしています);
</script>
<スクリプト言語= "javascript1.9">
// JavaScript 1.9をサポートするブラウザは、このスクリプトを実行できます
document.write( 'このブラウザーはjavascript1.9 <br/>'をサポートしています);
</script>
</body>
</html>