ホームページ > 記事 > ウェブフロントエンド > JavaScript の Foreach 構文の詳細な説明
JavaScript の Foreach 構文の詳細な説明
- 黄舟オリジナル
- 2017-11-16 14:45:393391ブラウズ
タイトルを見ると、多くの友人が foreach それはただのループ ステートメントではないかと言うと思います。はい、Foreach は確かにループ ステートメントですが、多くの友人はそれを使いこなす方法を知りません。詳しく紹介しますJavaScript Foreach構文で！
まず、Foreach 構文と呼ばれていますが、この構文は通常使用される for 構文を単純化したものです。
この構文は通常、配列を走査するために使用されます。このとき、各ループは配列のインデックス (整数) を取得し、配列名 [整数インデックス] を通じて配列内のオブジェクトを取得します。
しかし、この構文は オブジェクトをトラバースする ためにも使用でき、得られるのはオブジェクトの属性名 (文字列) であり、オブジェクト名 [属性名] を通じてオブジェクトを取得できます。
したがって、この構文を理解する鍵は、各ループで何が取得されるかを正確に理解することです。
実際、この関数の実現は、JavaScript の配列インデックスが文字列になれるという事実から恩恵を受けます。そうでない場合 (Java を考えてください)、そのようなことはありません。
<html>
<heap>
<script type="text/javascript">
var mycolors = new Array('blue','red','yellow');
function f1(){
var content="";
for(var key in mycolors){
content += key+": "+mycolors[key]+"<br/>";
}
document.getElementById("content").innerHTML = content;
}
function User(){}
function f2(){
var u1=new User();
u1.uname="张三";
u1.age="18";
var content="";
for(var key in u1){
content += key+": "+u1[key]+"<br/>";
}
document.getElementById("content").innerHTML = content;
}
</script>
</heap>
<body>
<input type="button" id="c1" name="c1" onclick="f1();" value="click one"/>
<input type="button" id="c2" name="c2" onclick="f2();" value="click two"/>
<div id="content"></div>
</body>
</html>1 つをクリックすると、出力は次のようになります:
0: blue 1: red 2: yellow
2 つをクリックすると、出力は次のようになります:
uname: 张三 age: 18
もちろん、u1 にメソッドがある場合:
u1.sai=function(){
alert("hello");
}次に、2 つをクリックした後出力は次のとおりです:
uname: 张三
age: 18
sai: function(){ alert("hello"); } 概要:
最後まで賢ければ、JSON オブジェクトをトラバースする方法を知っているはずです。また、foreach ステートメントについてもある程度理解しているはずです。参考になります
関連する推奨事項:
JavaScript での forEach と each の使用方法の詳細な説明
以上がJavaScript の Foreach 構文の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。