ES6中的map和reduce

待我称王封你为后i 2021-07-25 00:20 509阅读 0赞

# 一 实战 #

<!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    
    <body>
        <script>
            /* map函数 */
            // 接收一个函数，将原数组中的所有元素用这个函数处理后放入新数组返回
            let arr = ['1', '20', '-5', '3'];
            arr = arr.map(item => item * 2);
            console.log(arr);   //[2, 40, -10, 6]
    
            /* reduce函数 */
            /*
            为数组中的每一个元素依次执行回调函数，不包括数组中被删除或从未被赋值的元素，
            arr.reduce(callback,[initialValue])
            callback函数可用四个参数:
              1、previousValue （上一次调用回调返回的值，或者是提供的初始值（initialValue））
              2、currentValue （数组中当前被处理的元素）
              3、index （当前元素在数组中的索引）
              4、array （调用 reduce 的数组）
             */
            let arr1 = [2, 40, -10, 6];
            let result = arr1.reduce((a, b, index) => {
                console.log("上一次处理后：" + a);
                console.log("当前正在处理：" + b);
                console.log(index);
                return a + b;
            }, 100);
            console.log(result)
        </script>
    </body>
    
    </html>

# 二 测试 #

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NoZW5ncWl1bWluZw_size_16_color_FFFFFF_t_70][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NoZW5ncWl1bWluZw_size_16_color_FFFFFF_t_70]: /images/20210724/8f06a4ab651247b18bfea02ef995f6a2.png