es6에서 배열을 순회하는 방법은 무엇입니까?

ES6 배열 탐색 방법: 1. forEach()를 사용하여 배열의 각 요소에 대해 함수를 호출합니다. 2. map()을 사용하여 배열의 각 요소에 대해 지정된 콜백 함수를 호출합니다. ), 콜백 함수가 호출되어 배열의 요소를 필터링하고 조건을 충족하는 모든 요소를 ​​반환합니다. 4. some()을 사용하여 배열을 탐색하여 배열에 지정된 조건이 있는 요소가 있는지 검색합니다. Every(), 모든 배열 요소가 조건을 만족하는지 판단할 수 있습니다. 6. Reduce()를 사용합니다.

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

ES6

• forEach
• map
• filter
• some
• every
의 일반적인 배열 순회(반복) 방법
• reduce

순회가 필요하다고 선언합니다. 객체

다음 코드는 모두 이 객체를 참조합니다

 let data = {
                code: 1,
                list: [{
                        id: 23,
                        title: "女装1",
                        price: 300
                    },
                    {
                        id: 24,
                        title: "女装2",
                        price: 200
                    },
                    {
                        id: 27,
                        title: "男装1",
                        price: 100
                    },
                    {
                        id: 29,
                        title: "男装2",
                        price: 400
                    },
                    {
                        id: 230,
                        title: "女装3",
                        price: 600
                    },
                    {
                        id: 40,
                        title: "童装1",
                        price: 700
                    }
                ]
            }

forEach

forEach는 break 및 continue 문을 사용할 수 없습니다.

    // 有二个参数 第一个参数是数值 第二个参数是索引值 
     data.list.forEach(function(item,index){
    console.log(item,index)
    
 //输出结果是{
//   {id: 23, title: "女装1", price: 300} 0
//  {id: 24, title: "女装2", price: 200} 1
//  {id: 27, title: "男装1", price: 100} 2
//  {id: 29, title: "男装2", price: 400} 3
//  {id: 230, title: "女装3", price: 600} 4
//  {id: 40, title: "童装1", price: 700} 5
//     }
    
     })

map

    //map 映射
    //遍历数据并返回一个新的数组 对数据的处理会返回原先对应的位置

    let arr = [2, 3, 6];
    let newArr = arr.map(function (val, index) {
        // 第一个参数是值 第二个参数是索引值
        console.log(arr)
    })

**데이터를 탐색하고 새 배열 쌍을 반환합니다. 데이터는 원래 해당 위치로 돌아갑니다

코드 블록 맵을 추가하려면 동일한 블록 수준 범위를 구문 분석할 수 없습니다

{}{}는 다른 블록 수준 범위를 나타내며 다른 위치에 작성됩니다**

// 浅拷贝
// 浅拷贝是指a把值 给了b 当b的值改变 a b 的值同时改变。
{
        let arr = [2, 3, 6];
        let newArr = arr.map(function (index, val) {
            // 第一个参数是索引值 第二个参数是值        })
        console.log(arr)// 0: 2
                        // 1: 3
                         // 2: 6    }
    {
        // 浅拷贝
        // 浅拷贝是指a把值 给了b 当b的值改变 a b 的值同时改变。
        let newArr = data.list.map((item, index) => {
            item.price = item.price * .6
            return item;
        });
        console.log(newArr)//打印的结果价格都是改变的，一样的{
        // 0: {id: 23, title: "女装1", price: 180}
        // 1: {id: 24, title: "女装2", price: 120}
        // 2: {id: 27, title: "男装1", price: 60}
        // 3: {id: 29, title: "男装2", price: 240}
        // 4: {id: 230, title: "女装3", price: 360}
        // 5: {id: 40, title: "童装1", price: 420}
        // }
        console.log(data.list)//同上    }

출력 결과의 Deep Copy, a b의 값이 변경되더라도 최종 결과는 b의 변경에 따라 변경되지 않습니다.

// Deep copy 2 (간단하고 조잡한)

filter filter

filter는 콜백 함수를 호출하여 배열의 요소를 필터링하고 조건을 충족하는 모든 요소를 ​​반환합니다.

가격이 300 미만인 항목을 필터링하고 인쇄합니다.

some

이 함수는 배열에 지정된 조건의 요소가 있는지 여부를 감지하는 것입니다. 지정된 요소가 존재하면 반환된 결과는 true입니다. 지정된 요소가 존재하지 않으면 반환된 결과도 false입니다. 콜백 함수의 함수 본문에서 완료되고 콜백 함수는 부울 값을 반환합니다. 특정 시점에 콜백 함수가 false를 반환하면 Every 메소드 전체가 false를 반환하고 순회가 종료됩니다.

출력 정보입니다

reduce를 사용하여 누적 효과를 얻습니다

출력 합은 sum+val(숫자 값)

// reduce 用来实现累加的效果 (常用于写购物车价格的累加)
// 声明一个数组 数组里面放数字 让其里面的数字显示为累加的总和
//  let arr=[200,200,100]
//  let result =arr.reduce((sum,val,index)=>{
//                          200+200 index 
//                          400+100 index
// sum是总加后的和 val是变量里面的值 index为索引值 
//     console.log(sum,val,index)
//     return sum +val;
//  })
//  console.log(result)

[관련 권장 사항: javascript 비디오 튜토리얼

,

웹 프론트엔드

】

위 내용은 es6에서 배열을 순회하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!