JavaScript の Foreach 構文の詳細な説明-jsチュートリアル-php.cn

JavaScript の Foreach 構文の詳細な説明

黄舟

リリース： 2017-11-16 14:45:39

オリジナル

3469 人が閲覧しました

タイトルを見ると、多くの友人が foreach それはただのループステートメントではないかと言うと思います。はい、Foreach は確かにループステートメントですが、多くの友人はそれを使いこなす方法を知りません。詳しく紹介しますJavaScript Foreach構文で！

まず、Foreach 構文と呼ばれていますが、この構文は通常使用される for 構文を単純化したものです。

この構文は通常、配列を走査するために使用されます。このとき、各ループは配列のインデックス (整数) を取得し、配列名 [整数インデックス] を通じて配列内のオブジェクトを取得します。

しかし、この構文はオブジェクトをトラバースするためにも使用でき、得られるのはオブジェクトの属性名 (文字列) であり、オブジェクト名 [属性名] を通じてオブジェクトを取得できます。

したがって、この構文を理解する鍵は、各ループで何が取得されるかを正確に理解することです。

実際、この関数の実現は、JavaScript の配列インデックスが文字列になれるという事実から恩恵を受けます。そうでない場合 (Java を考えてください)、そのようなことはありません。

<html>
<heap>
<script type="text/javascript">
    var mycolors = new Array(&#39;blue&#39;,&#39;red&#39;,&#39;yellow&#39;);
    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() メソッドの説明

それぞれのJavaScript関数実装コード

以上がJavaScript の Foreach 構文の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。