面试题——请你说说map()和forEach()

持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第3天，点击查看活动详情

面试官问你：

你说一下map()和forEaxh()？

当我们听到这样问的时候，我们第一时间应该是想到，他们有什么相同点。

1，他们都是循环遍历数组的每一项的

2，方法每次都会执行一个匿名函数，并且传入三个参数分别是item（数组的每一项），index（索引值）和 arr（原数组）

3，只能作用于数组

说完相同点，我们来说一下不同点。

map()

有返回值，方法会返回一个新数组，数组中的元素是原来数组经过一个函数处理后的值

它的用法很简单

array.map(function(item,index,arr){},thisValue)

他不会对空数组进行检测，也不会改变原来数组，如果原数组为空，则map方法返回的也是一个空数组

看看下面例子

    <script>
        const arr1 = [];
        const arr2 = [1, 2, 3, 4]

        const newarr1 = arr1.map(function (item, index, arr) {
            return item + 2
        })

        console.log(arr1); // []
        console.log(newarr1); // []
        console.log("**********************************");

        const newarr2 = arr2.map(function (item, index, arr) {
            return item + 1
        })
        console.log(arr2); //[1, 2, 3, 4]
        console.log(newarr2); //[2, 3, 4, 5]
    </script>

forEach()

没有返回值，不可以进行链式调用，这个方法用于调用数组的每一个元素，并将元素传递给回调函数\

用法也很简单

    <script>
        const arr1 = [];
        const arr2 = [1, 2, 3, 4]

        const newarr1 = arr1.forEach(function (item, index, arr) {
            // console.log(arr1);
            return item + 2
        })

        console.log(arr1); // []
        console.log(newarr1); // undefined
        console.log("**********************************");

        const newarr2 = arr2.forEach(function (item, index, arr) {
            // console.log(arr2);  // 遍历4次数组
            console.log(item*2);  // 2,4,6,8
        })
        console.log(arr2); //[1, 2, 3, 4]
        console.log(newarr2); //undefined
    </script>

对于以上用法，要做到非常的熟悉。