>웹 프론트엔드 >프런트엔드 Q&A >어떤 유형의 자바스크립트 루프 문이 있나요?

어떤 유형의 자바스크립트 루프 문이 있나요?

青灯夜游
青灯夜游원래의
2021-07-16 16:08:308737검색

루프 문에는 다음이 포함됩니다. 1. for 루프, 2. "for...in" 루프, 4. "do...while" 루프, 6. 필터 필터 루프;8. "Object.keys"는 개체의 속성을 탐색합니다.

어떤 유형의 자바스크립트 루프 문이 있나요?

이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

프로젝트 개발에서는 어떤 프레임워크를 기반으로 하든 데이터 처리가 필요하며 처리 데이터는 다양한 순회 루프에서 분리될 수 없습니다. JavaScript에서 반복하는 방법에는 여러 가지가 있습니다. 다음은 몇 가지 일반적인 js 루프입니다.

1. for 루프

for 문은 주로 실행 횟수를 결정하는 루프를 실행하는 데 사용됩니다.

for 문의 기본 구문은 다음과 같습니다.

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

설명:

  • "초기값 표현식": 루프 변수의 초기값을 설정합니다.

  • "조건식": 루프에 들어갈지 여부는 무엇이든 가능하지만 일반적으로 관계식이거나 논리식이며 그 값은 true 또는 false입니다. 루프를 실행하기 전에 매번 조건식 값이 판단됩니다. 값이 true(값이 true이거나 0이 아니거나 비어 있지 않음)이면 루프 본문 문이 실행되고, 그렇지 않으면 루프가 종료되고 루프 문 뒤의 코드가 실행됩니다. ": 이 표현식을 기반으로 업데이트합니다. 루프 변수의 값입니다.

  • 위 3가지 표현은 모두 생략 가능하지만, for()에서는 생략할 수 없다는 점에 유의하세요. 따라서 세 표현식을 모두 생략하면 for 문은 for(;;){loop body 문}이 됩니다. 이때 주의할 점은 루프 본문 내에 루프를 종료하는 명령문이 없으면 무한 루프에 진입하게 된다는 점입니다.

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

2. 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]

3. While 루프

while 문은 가장 일반적으로 사용되는 루프 문으로, 개수에 관계없이 조건에 따라 루프만 실행하면 되는 프로그램에서 자주 사용됩니다. 루프.

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

조건식: 루프 제어 조건으로 괄호 안에 넣어야 합니다. 어떤 식이라도 가능하지만 일반적으로 관계식 또는 논리식이며 값은 true 또는 입니다. 거짓. 참고: true, 0이 아닌 값, 비어 있지 않은 값은 모두 true 값이고, 그렇지 않으면 false 값입니다.

  • 루프 본문: 반복적으로 수행해야 하는 작업을 나타냅니다. 간단한 명령문일 수도 있고 복합 명령문일 수도 있습니다. 단순문인 경우 중괄호 {}를 생략할 수 있으며, 그렇지 않은 경우에는 중괄호 {}를 사용해야 합니다.

  • while 문이 실행되면 조건식의 값을 먼저 판단하고, true이면 루프 본문 문을 실행한 다음, 값이 여전히 true이면 루프를 실행합니다. body 문은 계속 실행됩니다. 그렇지 않으면 while 문 다음의 문이 실행됩니다. 표현식의 값이 처음 평가될 때 false인 경우(false, 0 또는 null 등) 루프 본문은 한 번도 실행되지 않습니다.

  • while 루프가 정상적으로 종료되기 위해서는 루프 조건을 수정하는 명령문이나 루프 본문에 루프를 종료하는 다른 명령문이 있어야 합니다. 그렇지 않으면 while 루프가 무한 루프에 진입하게 됩니다. 즉, 루프 본문이 계속해서 실행됩니다.

예를 들어 다음 루프 문은 무한 루프를 발생시킵니다.

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

위 코드에서 i의 초기값은 1입니다. i 변수의 값은 루프 본문에서 수정되지 않으므로 iedad9836d317b01697515f54ac2ace03{     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高级教程

위 내용은 어떤 유형의 자바스크립트 루프 문이 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.