Rumah  >  Artikel  >  hujung hadapan web  >  javascript循环语句哪几种

javascript循环语句哪几种

青灯夜游
青灯夜游asal
2021-07-16 16:08:308696semak imbas

循环语句有:1、for循环;2、“for...in”循环;3、while循环;4、“do…while”循环;5、forEach循环;6、map;7、filter过滤循环;8、“Object.keys”遍历对象的属性。

javascript循环语句哪几种

本教程操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。

项目开发中,不管是建立在哪个框架基础上,对数据的处理都是必须的,而处理数据离不开各种遍历循环。javascript中循环遍历有很多种方式,记录下几种常见的js循环遍历。

一、for循环

for 语句主要用于执行确定执行次数的循环。

for 语句的基本语法如下:

for([初始值表达式];[条件表达式];[增量表达式]){
   循环体语句;
}

说明:

  • “初始值表达式”:为循环变量设置初始值;

  • “条件表达式”:作为是否进入循环的依据,可以是任意表达式,但一般为关系表达式或逻辑表达式,取值为真或假。每次要执行循环之前,都会进行条件表达式值的判断。如果值为真(值为 true 或非 0 或非空),则执行循环体语句;否则就退出循环并执行循环语句后面的代码;

  • “增量表达式”:根据此表达式更新循环变量的值。

上述 3 个表达式中的任意一个都可以省略,但需要注意的是,for() 中的;不可以省略。所以如果 3 个表达式都省略时,for 语句变为:for(;;){循环体语句}。此时需要注意的是,如果循环体内没有退出循环的语句,将会进入死循环。

示例:

     var sum = 0;
     for(var i = 1; i <= 100;i++){        //在for语句中使用var声明循环变量,使代码更简洁
         sum += i;
     }
     alert("1~100的累加和sum=" + sum);

二、for...in

for...in循环主要针对于对象的遍历,当想要获取对象的对应键值时,使用for...in还是比较方便的

var a = [1, 2, ,,,,,,true,,,,,,, "a",,,,,,,,,,,,,,,4,,,,,56,,,,,,"b"];  //定义数组
var b = [], num = 0;
for (var i = 0; i < a.length; i ++) {  //遍历数组
    if (typeof a[i] == "number")  //如果为数字,则返回该元素的值
        b.push(a[i]);
    num ++;  //计数器
}
console.log(num);  //返回42,说明循环了42次
console.log(b);  //返回[1,2,4,56]

三、while循环

while 语句是最常用的一种循环语句,在程序中常用于只需根据条件执行循环而不需关心循环次数的情况。

while 语句的基本语法如下:
while(条件表达式){
     循环体;
}

说明:

  • 条件表达式:为循环控制条件,必须放在圆括号中,可以是任意表达式,但一般为关系表达式或逻辑表达式,取值为真或假。注意:值为 true、非 0、非空的都是真值,反之则为假值。

  • 循环体:代表需要重复执行的操作,可以是简单语句,也可以是复合语句。当为简单语句时,可以省略大括号{},否则必须使用大括号{}。

while 语句在执行时,首先判断条件表达式的值,如果为真,则执行循环体语句,然后再对条件表达式进行判断,如果值还是为真,则继续执行循环体语句;否则执行 while 语句后面的语句。如果表达式的值在第一次判断就为假(为 false 或 0 或为 null 等值),则一次也不会执行循环体。

需要注意的是,为了使 while 循环能正常结束,循环体内应该有修改循环条件的语句或其他终止循环的语句,否则 while 循环将进入死循环,即会一直循环不断地执行循环体。

例如,下面的循环语句就会造成死循环。

var i=1,s=0;
whiel(i<=5){
    s+=i;      
}

上述代码中 i 的初始值为 1,由于循环体内没有修改 i 变量的值,所以表达式 ifa62aa002b3b5dee0e57fe6a3649126e{     console.log(arr) // arrObj     console.log(index)  // 0 1 2     console.log(item.name) // xiaohua xiaomin xiaobai })

七、filter过滤循环

filter方法用于过滤数组成员,满足条件的成员组成一个新数组返回。它的参数是一个函数,所有数组成员依次执行该函数,返回结果为true的成员组成一个新数组返回。该方法不会改变原数组。

let arrObj = [{
    id: 1,
    name: &#39;xiaohua&#39;
},{
    id:2,
    name: &#39;xiaomin&#39;
},{
    id:3,
    name: &#39;xiaobai&#39;
}]
let arr2 = arrObj.filter((item,index,arr)=>{
    return (item.name === &#39;xiaohua&#39;)
})
console.log(arr2)  // [{id:1,name:&#39;xiaohua}]

 ECMAScirpt5 中 Array 类中的 filter 方法使用目的是移除所有的 ”false“ 类型元素  (falsenullundefined0NaN or an empty string):

let arr = [3, 4, 5, 2, 3, undefined, null, 0, ""];
let arrNew = arr.filter(Boolean);
console.log(arrNew)  //  [3, 4, 5, 2, 3]

Boolean 是一个函数,它会对遍历数组中的元素,并根据元素的真假类型,对应返回 true 或 false.

八、Object.keys遍历对象的属性

Object.keys方法的参数是一个对象,返回一个数组。该数组的成员都是该对象自身的(而不是继承的)所有属性名,且只返回可枚举的属性。

let obj = {name: 'xiaohua', sex: 'male', age: '28'}
console.log(Object.keys(obj))
// ["name", "sex", "age"]

判断一个对象是否是空对象,可以用Object.keys(obj).length>0

【推荐学习:javascript高级教程

Atas ialah kandungan terperinci javascript循环语句哪几种. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn