js和jquery中的回调函数

news/2024/7/10 9:07:56 标签: 回调函数, callback, js, jquery, deferred

 

js中给出关于回调函数的解释为:

 

A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.

 

意思就是说,回调函数是与其他另外一个函数异步进行的,并且该函数是等待其父函数完成以后才进行

举个例子,函数a中调用了函数b,此时a是b的父函数,b函数要等a执行完后再执行。

这个b函数既可以作为参数的形式传给a函数,这样比较灵活,也可以写死在a函数里面,作为a的函数体

b函数是先摆在那里了,但不是立马就执行,是在a执行后,回头再执行b,回调简单理解就是回头调用嘛

 

js中的回调函数

 

 

<html>
<head>
    <meta charset="UTF-8">
    <script language="javascript" type="text/javascript">
        function a(callback)
        {
            alert("我是函数a,我是父函数");
            callback();

        }
        function b(){
            alert("我是函数b,是回调函数");

        }

        function test()
        {
            a(b);
        }
    </script>
</head>

<body>
	<button onClick=test()>click me</button>
</body>
</html> 

 

 

 

 

 

 

 

 

 

本人愚钝,写下疑惑为以后犯糊涂时能醒悟,也希望能帮助和我一样有困惑的人

在理解a,b函数执行先后时出了问题,开始我是这样想的,如果把callback放在a函数第一行,那这不就是先执行了b

函数,然后才执行a函数的么,这算哪门子的回调,后来顿悟,在写a函数的时候,把b函数写在里面,此时没有使用

这个函数,只留了个名字,我未来可以不断的改变这个b函数而相应的改变a函数,这也是回调函数的美妙之处,有点

偏题了,回过来继续说这个,b函数写在a函数体的哪个位置确实会影响b函数和a非b函数的函数体的执行顺序,但是

在开始执行b函数时,已经在执行a函数了。

不知道说明白没有,假如a,b函数都有门,打开a的门已经开始执行a函数了。

 

 

 

 

jquery中的回调函数,引入了Promise的概念,通过$.Deferred处理过的代码,没有像js中回调的嵌套,如果嵌套太

繁琐使用jquery就更加方便了,主要是三个步骤:

 

var dtd = $.Deferred();  //创建
dtd.resolve();          //成功
dtd.then()              //执行回调dtd.then()              //执行回调

 

 

 

下面看一个代码比较

 

 

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>

<body>
    <button>不使用Deferred处理</button>
    <button>使用Deferred处理</button>
<script type="text/javascript">
    // 回调处理
    $('button:first').click(function() {
        alert("不使用Deferred处理");
        callback();
    });

    function callback (){
        alert("我是回调函数 b");
    }

    // jQuery的Deferred处理
    $('button:last').click(function() {

        function a() {
            var dtd = $.Deferred(); // 生成Deferred对象
            alert("使用Deferred处理");
            dtd.resolve();
            return dtd;
        }

        function ba() {
            var dtd = $.Deferred(); // 生成Deferred对象
            alert("我是回调函数 ba");
            dtd.resolve();
            return dtd;
        }

        var anim = a();

        anim.then(function() {
            return b();
        });

    });
    
</script>
</body>
</html>

 

 

 

 

 

 

 

 

 

 

 

【题外话】

jsjquery回调函数让我想起java中利用多态实现的回调函数,也叫钩子函数

整理到一起方便以后回顾,与上文无关

 

 

public class RoomA{
	public void paint(){
		System.out.println("this is roomA---paint");
	}
}

public class Test{
	public static void test(RoomB b){
		b.paint();//钩子
	}
}

public class RoomB extends RoomA{
	public void paint(){ //重写父类的方法
		System.out.println("this is roomB---paint");
	}
}

 

 

 

 

 

 

 

 

 

 

 

 

 


http://www.niftyadmin.cn/n/705588.html

相关文章

CSS3中的animation详解

原文地址&#xff1a;http://www.jb51.net/css/365793.html 在开始介绍Animation之前我们有必要先来了解一个特殊的东西&#xff0c;那就是”Keyframes”,我们把他叫做“关键帧”&#xff0c;玩过flash的朋友可能对这个东西并不会陌生。下面我们就一起来看看这个“Keyframes”是…

libhv交叉编译

export CROSS_COMPILEarm-linux-gnueabihf- ./configure --prefix/home/qldeng/build_libhv-1.2.6 make clean make libhv make install

脚本中调用ffmpeg命令给图片添加水印

#!/bin/bash infileinfile.jpg outfileoutfile.jpg fontSourceHanSansCN-Bold.ttf fontSize40 wm测试-测试-123aB测试1234测试#测试 mf测试-1970-01-01#w、h 表示原图的宽、高&#xff1b;tw、th 表示文本宽高&#xff1b;ffmpeg -i $infile -vf drawtext"fontcolorwhite:…

Js中apply()与call()使用详解

Js apply方法详解 主要我是要解决一下几个问题: 1.apply和call的区别在哪里 2.什么情况下用apply,什么情况下用call 3.apply的其他巧妙用法&#xff08;一般在什么情况下可以使用apply&#xff09; 我首先从网上查到关于apply和call的定义,然后用示例来解…

ajax笔记1--HTTP,HTTPS和HTTP请求概念介绍

HTTP是一种无状态协议&#xff0c;所谓无状态就是客户端和服务器之间不会长时间的建立连接。 HyperText Transfer Protocol&#xff0c;超文本传输协议 所有的www文件都必须遵守这个标准 通俗的来讲&#xff0c;就是让客户端&#xff0c;也就是我们的浏览器&#xff0c;和服务…

windows搭建MQTT服务器

加入C:\Users\Administrator\Downloads\emqx-5.0.8-windows-amd64\bin环境变量&#xff0c; 在终端输入命令启动 emqx.cmd start浏览器访问 http://127.0.0.1:18083/ 默认账号密码admin public 登录dashborad 查看连接客户端 客户端下载MQTTX即可

MySQL登陆时遇到Access denied for user:'root@localhost'错误【解决方案】

博主Mysql版本 5.6.25 &#xff0c;xin8 64位系统 不清楚其他版本是否适用于以下操作 在dos中登陆时&#xff0c;出现下面错误提示&#xff1a; Access denied for user:rootlocalhost (Using Password:Yes) 解决方法&#xff1a;重新设置密码&#xff08;答案来自百度&#…