JavaScript_javascript スキルにおける一般的な落とし穴の概要-jsチュートリアル-php.cn

JavaScript_javascript スキルにおける一般的な落とし穴の概要

WBOY

リリース： 2016-05-16 18:28:33

オリジナル

984 人が閲覧しました

作成するすべての関数は大文字と小文字を区別します
JavaScript では単一引用符 ('string') と二重引用符 ("string") の間に特別な違いはなく、どちらも文字列の作成に使用できます。ほとんどの WEB 開発者は、XHTML 仕様ではすべての XHTML 属性値を二重引用符で囲む必要があるため、JavaScript ではオーバーロードがサポートされていません。が実行されると、関数の定義時のパラメータは考慮されず、スコープチェーンで定義された最後の関数が直接使用されます。これは、同じ名前の関数のインスタンスが常に 1 つだけ存在することを意味します。

クロージャは、スコープの後でも内部関数が使用できるという事実を指します。外部関数が実行されて終了すると、そのプロパティには外部関数からアクセスできます。変数またはメソッドが参照されると、JavaScript はオブジェクトの実行パスによって形成される使用ドメインチェーンに沿って使用ドメインを解析し、変数の最後に定義された値を探し、見つかった値を使用します。 function initAnchors(event){

コードをコピーコードは次のとおりです。

for (var i=1 ; i var アンカー = document.GetElementById('anchor' i);
アンカー.attachEvent('onclick', function() {
私のIDはanchor' i);
});
}
}

IDがanchor1からanchor3の3つのA要素があると仮定します。 3 つの A 要素を登録すると、A 番目の要素をクリックすると「私の ID はアンカー X です」と表示されますが、実際の操作は各 A 要素をクリックすると「私の ID はアンカー 4 です」と表示されます。これはなぜでしょうか。クリックイベントの発生時に i の値が実際にドメインチェーンから取得され、initAnchors() が実行され、i の値が 4 に等しいためです。解決策は次のとおりです。

コードをコピーしますコードは次のとおりです。

関数registerAnchorListner(anchor,i) {

anchor.attachEvent('onclick', function() { 
alert('私の ID はアンカーです' i); 
} } 
function initAnchors(event){ 
 for (var i=1; i  var anchor = document.GetElementById('anchor' i); 
registerAnchorListner(anchor,i); > } 

} 

varアンカー = document.GetElementById('anchor' i); 
anchor.attachEvent('onclick', function() { 
alert('my) id はアンカー ' i); 

 反復オブジェクト。次のようにスクリプトを作成するときに反復が使用されます。 : 

コードをコピー

コードは次のとおりです:

var list = [1,2, 3,4]; for(var i = 0;i < list.length; i ){ alert(list) }

別の反復方法for ループを使用して、(in)list にある各属性を反復処理します:

コードをコピー

コードは次のとおりです:

for(var i in list){ alert(list); } この時点では、前のものを使用した場合と同じ結果が得られます。

ただし、for(var i in item) メソッドを使用して、配列に似ているが配列ではないオブジェクトを操作する場合は、次のように注意する必要があります。
 

コードをコピー

コードは次のとおりです。

var all=document.getElementsByTagName('*'); for(var i in all){ //すべての要素に対して特定の操作を実行します}

この反復中、i の値は length と等しくなります、item、namedItem それぞれ、コード内で予期しないエラーが発生する可能性があります。場合によっては、オブジェクトの hasOwnProperty() メソッドを使用して、この問題を回避できます。オブジェクトのプロパティまたはメソッドが継承されていない場合、hasOwnProperty() メソッドは true を返します。つまり、ここでのチェックには他のオブジェクトから継承されたプロパティやメソッドは含まれず、配列に割り当てられた要素など、特定のオブジェクト自体に直接作成されたプロパティのみが含まれます。したがって、このチェックを for ループで使用すると、長さは配列 all の実際の属性ではなく、配列 all

コードをコピー

コードは次のとおりです:

 
var all=document.getElementsByTagName('*'); 
for(var i in all){ 
 if(!all.hasOwnProperty(i)) 
 //コントラストすべての要素は特定の操作を実行します 
} 