javascript小算法案例 数组高阶方法的实现

一、数组求和 

1.1for循环实现

        let arr =[1,6,7,9,2,5,7]
        // 定义一个变量它的值为0
        let sum = 0
        for(let i = 0;i < arr.length; i++){
        // arr.length拿到的是数组的长度 这是循环体要循环的次数
        // arr[0] === 1 arr[1] === 6 ... 
        // 在循环的过程中 第一次循环 sum = sum + arr[0] 第一次的sum计算结果为1
                         第二次循环 sum = sum + arr[1] 第一次的sum计算结果为7
                         ...以此来推 循环结束拿到最终的结果
        sum += arr[i] // 相当于sum = sum + arr[i]
        }
        console.log(sum);

1.2forEach实现

        // forEach的本质也是一个for循环
        let arr =[1,6,7,9,2,5,7]
        sum2 = 0
        // forEach参数一是一个函数,还有参数二,可以指定this的指向,这里不列举了,有兴趣的可以查看官方文档
        // forEach的函数参数一:item 循环数组的每一项 1,6,7,9,2,5,7
        // 和上述for循环求和执行过程是一样的
        arr.forEach(item => sum2 += item)
        console.log(sum2);

1.3reduce实现

        let arr = [5,10,52,4]
        // reduce的本质也是实现了一个for循环 特殊实现是它做了一些特殊的处理 可以实现一些特殊的功能
        // reduce的返回值是一个数组
        // 函数参数一是上一次的累加和 === sum = sum + arr[0]  , reduce的参数二就是上述定义的sum的初始值0 
        let sum = arr.reduce((previousValue,item) => {
                    return previousValue+=item
                  },0)

二、把所有status 为true的 过滤出 拿到拼接的name   最终效果  奥特曼1,奥特曼3,奥特曼4

    let arr =  [{

                    name: '奥特曼1',

                    id: 1,

                    status: true,

                }, {

                    name: '奥特曼2',

                    id: 2,

                    status: false,

                }, {

                    name: '奥特曼3',

                    id: 3,

                    status: true,

                }, {

                    name: '奥特曼4',

                    id: 3,

                    status: true,

                }, {

                    name: '奥特曼5',

                    id: 3,

                    status: false,

                }]
        // filter 遍历数组每一项,返回符合结果的数据储存到一个数组中 这个数组作为返回值

        let newArr = arr.filter(item => item.status === true)

        let result = []

        let itemObj = newArr.forEach((item,index)=>{

            result.push(item.name)

        })

        console.log(result);
        // 更简洁的写法
        // map返回一个数组 这个数组的值是循环遍历处出来符合条件的值
        let newArr = arr.filter(item => item.status === true).map(item => item.name)

上述map、filter、reduce、forEach的写法都一样 可以把 map、filter、reduce看做是forEach的变形,他们只是在forEach的基础上会一些特殊技能。

三、拿到 路由重定向这个字符串

还有其它方法的实现,可以查看官方文档ECMA、或者MDN

        let url = 'https://so.csdn.net/so/search?spm=1001.2014.3001.4501&q=路由重定向&t=&u='
        // indexof找到字符串的索引
        let str = url.indexOf('路由重定向')
        console.log(str);
        // slice 参数一:从索引开始截取 参数二:截取几个
        let result = url.slice(str,str+5)
        console.log(result);

四、数组去重

        // 最后结果: [1,2,3,4,6,7,8]  
        let arr = [1,2,3,4,6,8,1,7,6,2]
        let result = arr.filter((item,index)=>{
            // indexof查找元素的索引有则返回索引位置 没有则返回-1  indexof只能查找到第一个
            return arr.indexOf(item) === index
        })
        console.log(result);

五、一个随机数 按顺序插入到数组中

// 产生一个 1-10的随机数  如果说这个随机数是10 那结果就是[2,4,5,10]  
// 产生一个 1-10的随机数  如果说这个随机数是3 那结果就是 [2,3,4,5]  
// 产生一个 1-10的随机数  如果说这个随机数是1 那结果就是 [1,2,4,5]  
let arr = [2,4,5]
function randomNum(number){
    return arr.push(number)
}
let randomNumber = Math.floor(Math.random()*10)
let arr1 = randomNum(randomNumber)
// sort数组排序方法
arr.sort()
console.log(arr);