首页 web前端 js教程 jQuery如何自定义一个回调函数

jQuery如何自定义一个回调函数

Jun 16, 2017 pm 02:59 PM
jquery 函数 如何 自定义

首先从callback的字面翻译“回调” 可以理解这是一个函数被调用的机制

当我们遇到一个名词首先可能是百度谷歌搜索看官方是怎么解释的

下面是维基百科对回调的定义:

a callback is a piece of executable code that is passed as an argument to other code which is expected to call back (execute) the argument at some convenient time

硬翻译: 一个回调函数是作为另一个函数的参数的一个可执行的代码段 这个代码段在方便的时间来执行

通俗形象的解释: 把函数f2当做一个参数传给函数f1 并且在f1里适当的时间执行f2(下面的所有例子我都用f1,f2表示)

所以我们可以得到一个这样的回调函数模式

function f1(f2) {    //f1要执行的一些代码
    if (f2 && typeof(f2) === "function") { //对f2做判断是否存在并且是一个函数        f2();
    }
}
登录后复制

这里要注意两点 参数里的f2是一个指向f2这个函数的指针所以f2后面不能加括号

而f1内部的f2后面要有括号 因为这时我们要调用执行f2 ,所以要写f2()

我们把这个模式实例化看下他的执行结果

声明函数function f1(f2) {
alert("我是f1");if (f2 && typeof(f2) === "function") { //写上判断是个好习惯f2()
}
}
执行
f1(function() {
alert("我是f2");
})
结果://"我是f1",“我是f2”
登录后复制

我们看下整个函数执行的过程 当调用 f1(function(){alert("我是f2");})的时候

首先把一个匿名函数传给了f1() 而这个匿名函数就是声明函数里的参数f2 javascript程序是从上到下执行 先执行了alert("我是f1"); 然后执行了f2();

那我们可不可以这样写呢

function f1(f2) {    alert("我是f1");    if (f2 && typeof(f2) === "function") {  
        f2()
    }    alert("我又是f1 哈哈");
}
执行
f1(function(){
    alert("我是f2");
})//结果:我是f1 ,我是f2,我又是1 哈哈
登录后复制

再看对callback的定义 ,我们可以让callback在我们想要执行的时候执行,不影响f1本身的执行流

但为了封装和美观大多数我们会这样写

function f1(f2){ 
if (f2 && typeof(f2) === "function") {  
settimeOut(function(){f2()},1000) ;//f1执行1s后f2执行}
}function f2(){/**/}
f1(f2);
登录后复制

其实回调函数没那么复杂的,在js里面,function你可以当成一个普通的参数。只要后面加上(),就表示调用这个函数了。

再看看下面这个例子

$(function(){
    function funcname(param){
        //do something
         
        //callback
        param.callback();    
    }
 
    //调用
    funcname({
        callback:function(){
            alert('callback do'); 
        }   
    });      
});
登录后复制

从上面的例子也可以看出来,其实每定义一个函数,都将函数入容器的栈,index就是函数名。默认是在window下,因此可以把字符串丢过去,在window下也可以通过字符串调用到这个回调函数。

带参数的话,可以采用上面的方式。

比如jQuery里的一个例子

$("#div1").fadeOut("fast",functin(){
    $("#div2").fadeIn("slow");
})
登录后复制

让#div快速隐藏然后让#div2渐渐显示,在jQuery里有大量的callback函数

并且有一个专门的有一个方法callbacks来管理

jQuery.Callbacks = function( options ) {...}
登录后复制

最后我说下我最近在项目中用到的callback吧

hybrid app 功能大概就是 我向ios发送一个请求 ios返回给我的json数据 然后我将返回的数据解析插入到web页面上

//首先我写一个javascript和ios通信callback函数(简化)getData(callback){
settimeOut(function(){callback(iso_return)},100);
}//然后我向ios发送一个请求function getSinersReuest(){window.location.href="vvmusic://....callback=getSinersData"}/*然后ios截获url中的callback执行getData(getSinersData)返回给我数据;我的getSinersData是我想把ios返回的json插入到页面显示8*/getSinersData(iso_return){
.........
}//当页面加载的时候调用window.onload=function(){
getSinersReuest();
}
登录后复制

以上是jQuery如何自定义一个回调函数的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
2 周前 By 尊渡假赌尊渡假赌尊渡假赌
仓库:如何复兴队友
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
4 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

golang函数动态创建新函数的技巧 golang函数动态创建新函数的技巧 Apr 25, 2024 pm 02:39 PM

Go语言提供了两种动态函数创建技术:closures和反射。closures允许访问闭包作用域内的变量,而反射可使用FuncOf函数创建新函数。这些技术在自定义HTTP路由器、实现高度可定制的系统和构建可插拔的组件方面非常有用。

C++ 函数命名中参数顺序的考虑 C++ 函数命名中参数顺序的考虑 Apr 24, 2024 pm 04:21 PM

在C++函数命名中,考虑参数顺序至关重要,可提高可读性、减少错误并促进重构。常见的参数顺序约定包括:动作-对象、对象-动作、语义意义和遵循标准库。最佳顺序取决于函数目的、参数类型、潜在混淆和语言惯例。

C++ 函数默认参数与可变参数的优缺点比较 C++ 函数默认参数与可变参数的优缺点比较 Apr 21, 2024 am 10:21 AM

C++函数中默认参数的优点包括简化调用、增强可读性、避免错误。缺点是限制灵活性、命名限制。可变参数的优点包括无限灵活性、动态绑定。缺点包括复杂性更高、隐式类型转换、调试困难。

如何在Java中写出高效和可维护的函数? 如何在Java中写出高效和可维护的函数? Apr 24, 2024 am 11:33 AM

编写高效和可维护的Java函数的关键在于:保持简洁。使用有意义的命名。处理特殊情况。使用适当的可见性。

excel函数公式大全 excel函数公式大全 May 07, 2024 pm 12:04 PM

1、 SUM函数,用于对一列或一组单元格中的数字进行求和,例如:=SUM(A1:J10)。2、AVERAGE函数,用于计算一列或一组单元格中的数字的平均值,例如:=AVERAGE(A1:A10)。3、COUNT函数,用于计算一列或一组单元格中的数字或文本的数量,例如:=COUNT(A1:A10)4、IF函数,用于根据指定的条件进行逻辑判断,并返回相应的结果。

C++ 函数返回引用类型有什么好处? C++ 函数返回引用类型有什么好处? Apr 20, 2024 pm 09:12 PM

C++中的函数返回引用类型的好处包括:性能提升:引用传递避免了对象复制,从而节省了内存和时间。直接修改:调用方可以直接修改返回的引用对象,而无需重新赋值。代码简洁:引用传递简化了代码,无需额外的赋值操作。

自定义 PHP 函数和预定义函数之间有什么区别? 自定义 PHP 函数和预定义函数之间有什么区别? Apr 22, 2024 pm 02:21 PM

自定义PHP函数与预定义函数的区别在于:作用域:自定义函数仅限于其定义范围,而预定义函数可在整个脚本中访问。定义方式:自定义函数使用function关键字定义,而预定义函数由PHP内核定义。参数传递:自定义函数接收参数,而预定义函数可能不需要参数。扩展性:自定义函数可以根据需要创建,而预定义函数是内置的且无法修改。

C++ 函数中引用参数和指针参数的高级用法 C++ 函数中引用参数和指针参数的高级用法 Apr 21, 2024 am 09:39 AM

C++函数中的引用参数(本质为变量别名,修改引用修改原始变量)和指针参数(存储原始变量的内存地址,通过解引用指针修改变量)在传递和修改变量时有着不同的用法。引用参数常用于修改原始变量(尤其是大型结构体),传递给构造函数或赋值运算符时避免复制开销。指针参数则用于灵活指向内存位置,实现动态数据结构或传递空指针表示可选参数。

See all articles