歌谣学前端之数组的方法-CFANZ编程社区

歌谣学前端之数组的方法
前言

常用数组方法简单使用

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>数组的方法</title>
    <script>

        const arr = [1, 2, 3, 4, 5];

        /*
        *   map()
        *       - 可以根据原有数组返回一个新数组
        *       - 需要一个回调函数作为参数，回调函数的返回值会成为新数组中的元素
        *       - 回调函数中有三个参数：
        *           第一个参数：当前元素
        *           第二个参数：当前元素的索引
        *           第三个参数：当前数组
        *
        *   filter()
        *       - 可以从一个数组中获得符和条件的元素
        *       - 会根据回调函数的结果来决定是否保留元素，true保留，false不保留
        *
        *   find()
        *       - 可以从一个数组中获得符和条件的第一个元素
        *
        *   reduce()
        *       - 可以用来合并数组中的元素
        *       - 需要两个参数：
        *           回调函数（指定运算规则）
        *               四个参数：
        *                   prev 上一次运算结果
        *                   curr 当前值
        *                   index 当前索引
        *                   arr 当前数组
        *           初始值
        *               - 用来指定第一次运算时prev，如果不指定则直接从第二个元素开始计算
        * */
        let result = arr.map((item) => {
            return item + 2;
        });

        result = arr.map((item, index, array) => {
            return item + 2;
        });

        // console.log(result);

        const arr2 = ['孙悟空', '猪八戒', '沙和尚'];
        /*
        *   <li>孙悟空</li>
        *   <li>猪八戒</li>
        *   <li>沙和尚</li>
        * */

        result = arr2.map(item => "<li>" + item + "</li>");


        result = arr.filter(item => item % 2 === 0);
        result = arr.find(item => item % 2 === 0);


        result = arr.reduce((prev, curr, index) => {
            console.log(index, prev, curr);
            return prev + curr
        },0);
        console.log(result);


    </script>
</head>
<body>

</body>
</html>
0 条评论