美文网首页
第三节 JavaScript常用的循环语句

第三节 JavaScript常用的循环语句

作者: _果不其然_ | 来源:发表于2021-01-05 11:28 被阅读0次

    循环语句

    循环结构的执行步骤

     1、声明循环变量;   
     2、判断循环条件;   
     3、执行循环体操作;   
     4、更新循环变量;
     5、然后循环执行2-4,直到条件不成立,跳出循环。
    

    1.基础for循环

    var arr = ["中国","英国","美国","法国"]
    for(var i = 0 ; i < arr.length; i ++){
       document.write(arr[i] + "</br>")
    }
    // 输出
    中国
    英国
    美国
    法国
    

    2.for in循环

    用于遍历对象的属性,数组的索引值也算属性

    var arr = ["中国","英国","美国","法国"]
    var objArr = [{name:"曹雪芹",book:"红楼梦"},{name:"施耐庵",book:"水浒传"}]
    for(x in objArr){
      document.write(x.name) // 曹雪芹 施耐庵
    }
    
       var person = {name:"王辰",age:16}
       for(x in person){
           document.write(person[x]) // 王辰 16
       }
       var objArr = [{name:"曹雪芹",book:"红楼梦"},{name:"施耐庵",book:"水浒传"}]
       for(x in objArr){
         document.write(objArr[x].name) // 曹雪芹 施耐庵
       }
    

    如果接口获取较多的数据 需要一一赋值

      var arr1 = {name : "张新",age : 20, work:"repair"}
      var arr2 = {name : "", age : 0, work : ""}
      for(x in arr1){
      // 如果该属性定义了
        if(arr2[x] !== undefined){
         // 则进行相应赋值
         arr2[x] = arr1[x]
        }
       }
       document.write('赋值后arr2的name的值:' + arr2.name) // 张新
    

    3.foreach

    var countryList = ["中国","英国","美国","法国"]
    // 第一种写法
    countryList.forEach(function(v){
      document.write(v + "</br>")  // 中国 英国 美国 法国
    })
    
    // 第二种写法
    countryList.forEach(v =>{
      document.write(v + "</br>")  // 中国 英国 美国 法国
    })
    

    4.for...of(ES6)

    一个数据结构只要部署了Symbol.iterator属性,就被视为具有iterator接口,就可以用for...of循环遍历它的成员。也就是说,for...of循环内部调用的是数据结构的Symbol.iterator方法。
     for...of循环可以使用的范围包括数组、Set 和 Map 结构、某些类似数组的对象(比如arguments对象、DOM NodeList 对象)、后文的 Generator 对象,以及字符串。

    var arr = ['a','b','c','d']
    for(let a in arr){
       document.write(a); // 1 2 3 4
    }
    for(let a of arr){
      document.write(a) // a b c d
    }
    

    相关文章

      网友评论

          本文标题:第三节 JavaScript常用的循环语句

          本文链接:https://www.haomeiwen.com/subject/lemioktx.html