码迷,mamicode.com
首页 > Web开发 > 详细

js回调函数

时间:2018-08-21 01:07:33      阅读:237      评论:0      收藏:0      [点我收藏+]

标签:math   ons   template   ade   opera   功率   线程   line   参数   

js回调函数(第二周)


 

什么是回调函数

在JavaScript中一个函数可以作为另一个函数的参数,这个作为参数的函数就叫回调函数,以回调函数作为参数的函数叫做主函数

 

回调函数简单写法

//含有回调函数的函数
function main(callback){
…………//主函数逻辑
callback(a,b,c……)// 主函数触发某种条件传值到回调函数并执行
}
//调用
main(function callback(a,b,c……){
………………//回调函数中逻辑处理
})


 

回调函数场景运用

场景:我今年18岁,准备找个女朋友,有三个人选(姑娘A、B、C),我表白之后姑娘都会过一段时间给我回复;我最喜欢A姑娘,不过我不知A姑娘是不是也喜欢我,表白成功率为0.4,我次之喜欢B姑娘,表白成功率为0.5,我知道姑娘C很喜欢我,表白成率为1,那么问题来了,谁会成为我最终的女票呢?

场景模拟:用Math.randowm()生成一个[0,1)之间的一个随机数,如果这个随机数小与scale(scale可以表示表白成功的概率),则表示我表白成功了,用setTimeout(),延时1000ms,表示姑娘们需要这么长时间给我回复

用Java习惯实现:

 

function getAmie(woman,scale){//woman我表白的姑娘 scale 表白成功的概率 
   let temp = Math.random();
    console.log(temp);
    if(temp<scale){
        console.log(`${woman}答应做我女朋友`);
        temp = woman;
    }else{
        console.log(`${woman}对我说你是个好人`);
        temp = false;
    }
    setTimeout(() => {
        return temp;
    }, 1000);
}
//调用方法,计算谁最终成为我的女朋友
if(!getAmie("姑娘A",0.5)){
    if(!getAmie("姑娘B",1)){

    }else{
    console.log("最终姑娘B成为了我的女朋友");
    }
}else{
    console.log("最终姑娘A成为了我的女朋友");
}

然而你会发现执行结果是这样的:
技术分享图片

没错这个确实不是我们想要的,因为JavaScript是单线程的,不会等到一个函数执行完才会去执行另一个函数,所以用这种方式写是不行的,用回调方式实现乳腺:

 

function getAmie(woman,scale,callback){//woman我表白的姑娘 scale 表白成功的概率 callback回调函数,callback参数为姑娘名时表示表白成功,为false表示获得好人证一张
   let temp = Math.random();
    console.log(temp);
    if(temp<scale){
        console.log(`${woman}答应做我女朋友`);
        temp = woman;
    }else{
        console.log(`${woman}对我说你是个好人`);
        temp = false;
    }
    setTimeout(() => {
        callback(temp);
    }, 1000);
}
//调用方法,计算谁最终成为我的女朋友
getAmie("姑娘A",0.4,(temp) => {
    if(temp){
        console.log("最终姑娘A成为了我的女朋友");
        return;
    }else{
        getAmie("姑娘B",0.5,(temp) => {
            if(temp){
                console.log("最终姑娘B成为了我的女朋友");
                return;
            }else{
                getAmie("姑娘C",1,(temp) => {
                    if(temp){
                      console.log("最终姑娘C成为了我的女朋友");
                    }else{
                        return;
                    }
                })
            }
        })
    }
})

看效果,刷新了几次
技术分享图片

<完>
20180803
技术分享图片
发挥不广泛

js回调函数

标签:math   ons   template   ade   opera   功率   线程   line   参数   

原文地址:https://www.cnblogs.com/fahuibuguangfan/p/9508946.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!