真的了解forEach？

forEach

forEach((value, index, arr) => {})
作用：遍历数组，增强版/简化版的for循环
返回：无返回值
语法： array.forEach((value, index, arr) => { value: 数组中的每项元素 index：数组中元素的下标值 array：数组本身 })
查看数组的实例方法： Array.prototype
不会改变原数组！不会改变原数组！不会改变原数组！

遍历简单数组

const beauty = ['小红', '小黄', '小蓝', '小绿']

beauty.forEach((value, index, arr) => {
    console.log('元素：' + value, '下标：' + index, '本身：' + arr)
    // 元素：小红 下标：0 本身：小红,小黄,小蓝,小绿
    // 元素：小黄 下标：1 本身：小红,小黄,小蓝,小绿
    // 元素：小蓝 下标：2 本身：小红,小黄,小蓝,小绿
    // 元素：小绿 下标：3 本身：小红,小黄,小蓝,小绿
})

遍历对象

const boys = [
    {
        name: '杜兰特',
        height: 200
    },
    {
        name: '库里',
        height: 192
    },
    {
        name: '巴特勒',
        height: 205
    },
    {
        name: '科比',
        height: 233
    }
]
boys.forEach((value, index) => {
    console.log('元素：' + value.name, '下标：' + index)
})
// 元素：杜兰特 下标：0
// 元素：库里 下标：1
// 元素：巴特勒 下标：2
// 元素：科比 下标：3

手写个forEach

Array.prototype._forEach = function (callback) {
    for (let i = 0; i < this.length; i++) {
        callback(this[i], i, this)
    }
}

const boys = [
    {
        name: '杜兰特',
        height: 200
    },
    {
        name: '库里',
        height: 192
    },
    {
        name: '巴特勒',
        height: 205
    },
    {
        name: '科比',
        height: 233
    }
]

boys._forEach((value, index) => {
    // this就是调用_forEach的数组对象，拿到之后，内部for循环实现
    console.log('元素：' + value.name, '下标：' + index)
})

// 元素：杜兰特 下标：0
// 元素：库里 下标：1
// 元素：巴特勒 下标：2
// 元素：科比 下标：3

往期相关精彩文章链接

水平有限，还不能写到尽善尽美，希望大家多多交流，跟春野一同进步！！！

ES5数组实例方法【forEach】

forEach

遍历简单数组

遍历对象

手写个forEach

往期相关精彩文章链接