回调函数模拟API

回调函数模拟API

• 通过使用回调函数封装的方法,实现常用API的功能.
• 回调函数的概念:
  (1):当发生某种事件时，而由系统或其它函数来调用的函数.
  (2)使用回调函数实际上就是在调用某个函数时，将自己编写的一个函数的地址作为参数传递给那个函数。

回调函数的

reduce的用法及作用

• 一般用于累加或累乘
• 通过例题来进行理解:

    var arr = [1, 2, 3, 4, 5];
    var initialValu = 0;
        var res = reduce(arr, function(pre, current) {
            console.log('-------------');
            console.log(pre, current);
            return pre + current
        }, initialValu)
         console.log('运算结果------', res);
         function reduce(arr, cb, init) {
            for (var i = 0; i < arr.length; i++) {
                init = cb(init, arr[i]);
            }
            return init
        }
思路:本题实现的的是累加的,先声明一个数组,声明一个和的初始值,声明一个名叫reduce,遍历arr这个数组.为了让其运算,在回调函数中做运算作为参数传到reduce,让reduce函数中的cb去接收作为实参的回调函数.   即在函数中做框架,在回调函数中做运算.

模拟split

  var str = ',dasjfweor,faserwe,123,w,rwqer,wqer,rqwer,rwqew45439';
        var arr = split(str, ',');
        console.log(arr);

        function split(str, substr) {
            var res = []; // 初始化返回值
            var str_init = ''; // 初始化字符片段
            str = str + substr; // bug 为了防止 最有一次切割时，丢掉最后一个片段
            for (var i = 1; i < str.length; i++) { // 遍历字符串获取每一个字符
                // 如何是被切割的字符  

                if (str[i] === substr) {
                    // 将拼接好的片段，添加到数组上
                    res.push(str_init)
                        // 清空片段，继续拼接下一个
                    str_init = ''
                        // 跳出本次执行，为了防止 拼接都好
                    continue
                }
                // 将不是 substr 的字符 拼接到  字符片段上
                str_init = str_init + str[i]
            }

            return res
        }
思路:split用法: split();  将字符串分割为数组，不会改变原来的字符串，返回分割之后的数组.
     先定义一个新的空字符串用于下面字符串的拼接,给函数设置两个接收参数,一个是目标字符串,另一个是做分割线的目标字符.第二步是遍历数组,使得在分割目标字符前的每个字符都能一一拼接到新字符串中.然后添加一个条件(  str_init = ''),使得每次切割后都可以使得新字符串成为数组中新的元素,即完成了我们的目的

模拟some

• some 验证 某个数组中 是否存在满足某个条件的元素

var result = some(arr, function (element) {
            return element % 2 === 0;
        })
        console.log(result)

        function some(arr, cb) {
            var res = false; // 初始化结果
            for (var i = 0; i < arr.length; i++) {
                var check = cb(arr[i]);
                if (check) {
                    res = true;
                    break;
                }
                if(i === arr.length-1){
                    res = false;
                }
            }

            return res
        }
思路:和上面的整体运算思路相同,在函数中整理框架,然后把运算部分放在回调函数中,作为实参传回原函数.
     

模拟map

var arr = [1, 4, 9, 16];
         var map_arr = map(arr, function (element) {
             console.log(element);
             return element *2
        })
         console.log(map_arr);
         function map(arr,cb) {
             var res = []
             for(var i = 0;i<arr.length;i++){
                 var result = cb(arr[i])
                 res.push(result)
             }
             return res
         }

模拟slice

• slice(start,end) 截取字符串 包括start 不包括end，返回的是截取下来的字符串

        var str  = slice('afsdfsadfsadf',1,3)
        function slice(str,start,end){
            var res = '';
            for(var i =0;i<str.length;i++){
                if(i>=start&& i<end){
                    res = res + str[i]
                }
            }
            return res
        }
        console.log(str);

测试题

• 让网页每次刷新时.都随机出现八个字符

     var str = "abcdefghijklmnopqrstuvwxyz0123456789";
        var res = '';
        for (var i = 0; i < 8; i++) {
            var random = Math.round(Math.random() * (str.length - 1));
            // res.push(str[random])
            if (res.indexOf(str[random]) == -1) {
                res += str[random]
            } else {
                i--
            }
        }
        console.log(res);