JavaScript中Foreach语法详解-tutorial js-php.cn

JavaScript中Foreach语法详解

黄舟

Lepaskan： 2017-11-16 14:45:39

asal

3417 orang telah melayarinya

看到标题相信很多小伙伴都会说foreach不就是循环语句吗、没错，Foreach确实循环语句，但是很多小伙伴都不知道如何熟悉的掌握，今天我们就带大家详细介绍下JavaScript中Foreach语法！

首先，虽然叫Foreach语法但关键字还是用for哦，这个语法只是对平时用开的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>

Salin selepas log masuk

点击click one后输出：

0: blue
1: red
2: yellow

Salin selepas log masuk

点击click two后输出：

uname: 张三
age: 18

Salin selepas log masuk

当然如果u1中有一个方法：

u1.sai=function(){
   alert("hello");
}

Salin selepas log masuk

那么点击click two后就输出：

uname: 张三
age: 18
sai: function(){ alert("hello"); }

Salin selepas log masuk

总结：

看到最后聪明的你现在应该知道如何遍历一个JSON对象了吧，也应该foreach语句有了一定认识，希望对你有所帮助!

相关推荐：

JavaScript中关于forEach与each的使用详解

javascript forEach() 方法讲解

javascript forEach函数实现代码

Atas ialah kandungan terperinci JavaScript中Foreach语法详解. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Php8, saya datang juga

Ketahui reka letak tapak web dalam masa 30 minit

Tutorial Video Permulaan Shangguan Oracle kepada Mahir

Baris pertama kod UNI-APP anda

Berkibar dari awal ke pelancaran apl

Tutorial Video Linux Baharu Brother Lian

Tutorial Video AXURE 9 (Sesuai untuk UI Reka Bentuk Produk Interaktif Pengurus Produk)

Tutorial Video PS Kemahiran Asas Sifar

Tutorial video UI 16 hari untuk anda bermula

Tutorial Video Teknik PS dan Teknik Menghiris

Tutorial Video Pembinaan Persekitaran Awan Alibaba dan Pelancaran Projek

Gambaran Keseluruhan Rangkaian Komputer - Pengetahuan Asas yang Perlu Dikuasai Pengaturcara

Tutorial Penting untuk Pengaturcara - Penjelasan Protokol HTTP

Tutorial Video Websocket

JavaScript中Foreach语法详解