“回调函数”超难面试题!!

时间: 2018-10-11阅读: 364标签: 函数
<script>
    let app = {
        ary: [],
        use(fn) {
            this.ary.push(fn);
        }
    };
    app.use((next) => {
        console.log(1);
        next();
        console.log(2)
    });
    app.use((next) => {
        console.log(3);
        next();
        console.log(4)
    });
    app.use((next) => {
        console.log(5);
        next();
        console.log(6)
    });
    callBack(0);
    function callBack(index) {
        if (index === app.ary.length)
            return;
        let newAry = app.ary[index];
        newAry(() => {
            callBack(index + 1);
        })
    }
</script>


进来的小伙伴可以先自己思考一下 。对于还属于小白的我来说扫了一眼这些代码的反应是:“这都是什么鬼?”

但是我也比较喜欢钻研~ 仔细看了第二眼的反应是:“这回调函数也太回调了吧!”

又看了第三眼差不多也理解了一星半点,写出解题逻辑的同时也让自己理解的更深刻一点

答案输出:1 3 5 6 4 2;

 app.use((next) => {
 console.log(1);
 next();
 console.log(2)
 });


这一步是让对象app里属性名为use的函数执行,里面的箭头函数作为fn的形参添加到ary空数组中;

以此类推后面两个方法执行里的实参同样作为fn的形参添加到ary数组当中;

callBack(0);
function callBack(index) {
 if (index === app.ary.length)
 return;
 let newAry = app.ary[index];
 newAry(() => {
 callBack(index + 1);
 })
}


函数callback执行传参0,判断不成立继续往下,let newAry = app.ayr[index],可以看成

let newAry = (next)=>{
console.log(1);
next();
console.log(2);
};


紧接着newAry执行里面的参数()=>{callBack(index+1)} 被形参next接收,代码执行 首先输出1

接下来是 next() 就等于传的参数()=>{callBack(index+1)} 执行,里面紧接着是 函数callBack执行;

此时index的参数计算后为 1 ;判断依旧不成立,继续往下执行;按前面原理经过计算后 分别输出 3 5

最后(next) => { console.log(5); next(); console.log(6) }; 输出 5 之后;函数callBack执行此时里面的判断成立不再执行;

紧接着 输出 6 由于上面的方法执行没有执行完,而且因为 newAry 执行回调函数的嵌套,所以需要再从里到外

执行再 分别输出 4 2 ;所以最后 答案是:1 3 5 6 4 2;

来源:http://www.cnblogs.com/wumi/p/9733867.html


js函数式编程-函数合并

函数编程的函数组合:两个纯函数组合之后返回了一个新函数,函数组合可以避免在实现相同需求式而使用嵌套函数,实现可读性。实现一组函数的叠加产生一个新的函数我们可以利用reduce来实现,利用reduce 的累加的特性实现函数的嵌套。

javascript replace高级用法

在前端与后台交互的时候我们通常都需要将后台传递的数据绑定到html中,这个绑定数据的方式我们通常是使用jQuery或者使用原生的innerHTML进行绑定,当然也可以使用artTemplate模板来绑定数据,那么artTemplate模板它绑定数据的原理是什么呢?其实它就是利用了replace()方法。

js函数常见的写法以及调用方法

本文详细的介绍了5种js函数常见的写法以及调用的方法,平时看别人代码的时候总是看到各种不同风格的js函数的写法。不明不白的,找了点资料,做了个总结,需要的小伙伴可以看看,做个参考

js中HttpServletRequest的使用

HttpServletRequest对象代表客户端的请求,当客户端通过HTTP协议访问服务器时,HTTP请求头中的所有信息都封装在这个对象中,开发人员通过这个对象的方法,可以获得客户这些信息。

关于Javascript中的valueOf与toString

以上引申出对象数据的转换的问题:所有对象继承了两个转换方法:toString(): 它的作用是返回一个反映这个对象的字符串,valueOf():它的作用是返回它相应的原始值

js类的constructor中不支持异步函数吗?

如果是普通函数,可以用async 和await来解决你的问题。但你这个是在constructor里,constructor 的作用是返回一个对像实例,如果加了async就变成返回一个promise了,所以这个方法行不通

js函数形参和实参的区别

形参相当于函数中定义的变量,实参是在运行时的函数调用时传入的参数。 形参和实参是存在一种引用关系的,就好比变量中的引用关系。我们都知道,变量中的引用关系跟它们的值有关。形参和实参是存在一种引用关系的,就好比变量中的引用关系。

自定义编写js格式化数字的函数

处理网页时,有时需要显示长数字,但是当数字长度很长时,很难看出数字有多大。在这种情况下,当一些网站正在处理数字时,当数字的长度大于三时,它们用逗号分隔,这是一种常见的方式

关于变量值和函数参数

变量包含了两种不同类型的值:基本类型 (Undefined、null、Boolean、Number、string都属于基本类型),引用类型 (对象),如果在函数内重新给obj变量赋值一个新的对象,obj指向的内存地址改变,那之后更改对象内的属性,对函数外是没影响的

引用类型作为函数参数何解

在向函数传递引用类型的参数时,相当于把引用类型的地址复制给函数内的一个局部变量,所以局部变量和传入的参数会指向内存中的同一个对象。 局部变量的变化也会映射到传入参数

fly63.com版权所有,内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权,请与小编联系!情况属实本人将予以删除!

广告赞助文章投稿关于web前端网站点搜索站长推荐网站地图站长QQ:522607023

小程序专栏: 土味情话心理测试脑筋急转弯