JavaScript의 주요 루프는 다음과 같습니다. 1. for 루프, 2. "for...in" 루프, 4. forEach 루프, 6. Object.keys는 다음의 속성을 탐색합니다. 개체.
이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.
프로젝트 개발에서는 어떤 프레임워크를 기반으로 하든 데이터 처리가 필요하며 처리 데이터는 다양한 순회 루프에서 분리될 수 없습니다. JavaScript에서 반복하는 방법에는 여러 가지가 있습니다. 다음은 몇 가지 일반적인 js 루프입니다.
1. for 루프
for 루프는 가장 일반적이고 가장 많이 사용되는 루프 순회 방법이므로 가독성과 유지 관리 용이성이 상대적으로 떨어지지만 시간이 지나면 루프에서 벗어날 수 있습니다.
let arr = [1,2,3,4,5,6,7]for(let i = 0;i<arr.length;i++){ console.log(arr[i]) }// 1,2,3,4,5,6,7
2. for...in
for...in 루프는 객체를 순회하는 데 주로 사용됩니다. 객체의 해당 키 값을 얻으려면 for...in을 사용하는 것이 더 편리합니다.
//针对对象来说 //任何对象都继承了Object对象,或者其它对象,继承的类的属性是默认不可遍历的, //for... in循环遍历的时候会跳过,但是这个属性是可以更改为可以遍历的,那么就会造成遍历到不属于自身的属性。 //结合使用hasOwnProperty方法,在循环内部判断一下,某个属性是否为对象自身的属性。否则就可以产生遍历失真的情况。 let obj = {name: 'xiaohua', sex: 'male', age: '28'} for(let key in obj){ if(obj.hasOwnProperty(key)){ console.log(obj[key]) } }
3 , map
map 메소드는 배열의 모든 멤버를 차례로 매개변수 함수에 전달한 다음 각 실행 결과를 새 배열로 반환합니다. 루프는 중간에 멈출 수 없으며 모든 멤버는 항상 순회됩니다.
let arr = [1,2,3,4,5] let arr2 = arr.map((n)=>{ return n+1 }) console.log(arr2) // [2,3,4,5,6] console.log(arr) // [1,2,3,4,5]
맵 메소드는 함수를 매개변수로 받아들입니다. 이 함수가 호출되면 map 메소드는 현재 멤버, 현재 위치 및 배열 자체의 세 가지 매개변수를 전달합니다.
let arrObj = [{ id: 1, name: 'xiaohua' },{ id:2, name: 'xiaomin' },{ id:3, name: 'xiaobai' }] arrObj.map((item,index,arr)=>{ console.log(arr) // arrObj console.log(index) // 0 1 2 console.log(item.name) // xiaohua xiaomin xiaobai })
4. forEach
forEach 메소드는 값을 반환하지 않고 데이터 연산에만 사용되며 루프를 중간에 멈출 수 없다는 점을 제외하면 forEach의 사용법은 map의 사용법과 유사합니다. 모든 멤버는 항상 순회됩니다
let arrObj = [{ id: 1, name: 'xiaohua' },{ id:2, name: 'xiaomin' },{ id:3, name: 'xiaobai' }] arrObj.forEach((item,index,arr)=>{ console.log(arr) // arrObj console.log(index) // 0 1 2 console.log(item.name) // xiaohua xiaomin xiaobai })
5. 필터 필터 루프
필터 메소드는 배열 멤버를 필터링하는 데 사용되며 조건을 충족하는 멤버는 새로운 배열을 구성하여 반환합니다. 그 매개변수는 함수이고, 모든 배열 멤버는 함수를 순차적으로 실행하며, 반환 결과가 true인 멤버는 새로운 배열을 구성하여 반환합니다. 이 방법은 원래 배열을 변경하지 않습니다.
let arrObj = [{ id: 1, name: 'xiaohua' },{ id:2, name: 'xiaomin' },{ id:3, name: 'xiaobai' }] let arr2 = arrObj.filter((item,index,arr)=>{ return (item.name === 'xiaohua') }) console.log(arr2) // [{id:1,name:'xiaohua}]
ECMAScirpt5의 Array 클래스에 있는 필터 메소드는 모든 "false" 유형 요소(false, null, undefine, 0, NaN 또는 빈 문자열)를 제거하는 데 사용됩니다.
let arr = [3, 4, 5, 2, 3, undefined, null, 0, ""]; let arrNew = arr.filter(Boolean); console.log(arrNew) // [3, 4, 5, 2, 3]
Boolean은 요소를 순회하는 함수입니다.
6. 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 중국어 웹사이트의 기타 관련 기사를 참조하세요!