JavaScript Callback

2024-02-26 09:32
文章标签 java script callback

本文主要是介绍JavaScript Callback,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

如果你对Jquery没有足够的经验,但是你又用过JQuery,这么来说没你已经用过了毁掉函数了。但是你可能不知道它是如何工作和实现的。
这篇文章主要基于我所了解的回调函数,我试图启发大家基于最常规的 JavaScript技术之上。也许一些Javascript的专家可以告诉我那些遗漏了。
什么是回调函数?
下面是维基百科文章定义的回调函数:
"A reference to executable code, or a piece of executable code, that is passed as an argument to other code."
下面是一段大家都熟悉的JQuery代码:
$('#element').fadeIn('slow', function() {  // callback function  
});

  
这里是调用了JQuery里的fadeIn()方法,这个方法接受两个参数:淡入的速度和一个可选的回调方法。
在这个回调函数里你可以做任何你想干的事。当fadeIn()方法执行完后,回调函数会被执行。你可以通过传入
第一个参数的值来延迟回调函数的执行。
如何写回调函数?
如果自己在写一个方法或函数,你有可能会遇到需要一个回调函数。下面就是一个简单的常见回调函数例子:
function mySandwich(param1, param2, callback) {  alert('Started eating my sandwich.\n\nIt has: ' + param1 + ', ' + param2);  callback();  
}  mySandwich('ham', 'cheese', function() {  alert('Finished eating my sandwich.');  
});

  
我们有一个叫mySandwich的函数,它接受三个参数。第三个参数就是回调函数。当执行这个方法的时候,它会弹出
一个对话框,然后才执行回调函数。注意这里第三个参数是一段函数声明,这段声明在mySandwich里面被执行。
这个参数就是回调函数。
这个回调函数是定义在第三个参数被传入的,而且里面有一个alert来告诉这个函数被执行了。你可以看到下面这个例子,让一个函数作为传入,这使回调成为可能。例子a JSBin
让回调函数成为可选?
有一件事也许大家都知道,就是JQuery中的回调函数都是可选的,这就意味着如果一个方法接受回调函数,
当我们不传值给这个回调函数,它应该不会报错。但是在我们的下面例子里,如果没有传参:
function mySandwich(param1, param2, callback) {  alert('Started eating my sandwich.\n\nIt has: ' + param1 + ', ' + param2);  callback();  
}  mySandwich('ham', 'cheese');  


控制台会报错:“undefined is not a function” 。为了让它不报错就有如下代码:
function mySandwich(param1, param2, callback) {  alert('Started eating my sandwich.\n\nIt has: ' + param1 + ', ' + param2);  if (callback) {  callback();  }  
}  mySandwich('ham', 'cheese');  


现在我们检测了回调函数是否传入了,就不会报错了
让回调函数必须是一个Function?
如果你想让第三个参数无论如何都要传一个Functon,可以按下方法实现:
 
function mySandwich(param1, param2, callback) {  alert('Started eating my sandwich.\n\nIt has: ' + param1 + ', ' + param2);  if (callback && typeof(callback) === "function") {  callback();  }  
}  mySandwich('ham', 'cheese', 'vegetables');  


注意这里用到typeof运算符,来确保传入值是一个方法,如果不是就会抛异常,这里有一个例子Here’s a JSBin
对于延时的注意
尽管回调函数总是最后被执行,但这不总是这样的。举个例子,如果含有回调函数里有一个异步的方法调用(AJAX or an animation),这时候回调会在异步方法调用后执行,但也可能在异步方法返回之前返回。下面就是一个JQuery animate例子:
function mySandwich(param1, param2, callback) {  alert('Started eating my sandwich.\n\nIt has: ' + param1 + ', ' + param2);  $('#sandwich').animate({  opacity: 0  }, 5000, function() {  // Animation complete.  });  if (callback && typeof(callback) === "function") {  callback();  }  
}  mySandwich('ham', 'cheese', function() {   alert('Finished eating my sandwich.');  
});  


尽管回调在异步函数调用之后执行,但是在异步函数返回之前,回调函数就已经结束了。为了解决这种问题,我建议把回调
函数放入animate的回调函数里面。虽然这不能覆盖所有的方法,但是回调函数最基本的意义就在于最后执行。

这篇关于JavaScript Callback的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/748410

相关文章

Java中Map的五种遍历方式实现与对比

《Java中Map的五种遍历方式实现与对比》其实Map遍历藏着多种玩法,有的优雅简洁,有的性能拉满,今天咱们盘一盘这些进阶偏基础的遍历方式,告别重复又臃肿的代码,感兴趣的小伙伴可以了解下... 目录一、先搞懂:Map遍历的核心目标二、几种遍历方式的对比1. 传统EntrySet遍历(最通用)2. Lambd

Spring Boot 中 RestTemplate 的核心用法指南

《SpringBoot中RestTemplate的核心用法指南》本文详细介绍了RestTemplate的使用,包括基础用法、进阶配置技巧、实战案例以及最佳实践建议,通过一个腾讯地图路线规划的案... 目录一、环境准备二、基础用法全解析1. GET 请求的三种姿势2. POST 请求深度实践三、进阶配置技巧1

springboot+redis实现订单过期(超时取消)功能的方法详解

《springboot+redis实现订单过期(超时取消)功能的方法详解》在SpringBoot中使用Redis实现订单过期(超时取消)功能,有多种成熟方案,本文为大家整理了几个详细方法,文中的示例代... 目录一、Redis键过期回调方案(推荐)1. 配置Redis监听器2. 监听键过期事件3. Redi

Spring Boot 处理带文件表单的方式汇总

《SpringBoot处理带文件表单的方式汇总》本文详细介绍了六种处理文件上传的方式,包括@RequestParam、@RequestPart、@ModelAttribute、@ModelAttr... 目录方式 1:@RequestParam接收文件后端代码前端代码特点方式 2:@RequestPart接

SpringBoot整合Zuul全过程

《SpringBoot整合Zuul全过程》Zuul网关是微服务架构中的重要组件,具备统一入口、鉴权校验、动态路由等功能,它通过配置文件进行灵活的路由和过滤器设置,支持Hystrix进行容错处理,还提供... 目录Zuul网关的作用Zuul网关的应用1、网关访问方式2、网关依赖注入3、网关启动器4、网关全局变

SpringBoot全局异常拦截与自定义错误页面实现过程解读

《SpringBoot全局异常拦截与自定义错误页面实现过程解读》本文介绍了SpringBoot中全局异常拦截与自定义错误页面的实现方法,包括异常的分类、SpringBoot默认异常处理机制、全局异常拦... 目录一、引言二、Spring Boot异常处理基础2.1 异常的分类2.2 Spring Boot默

基于SpringBoot实现分布式锁的三种方法

《基于SpringBoot实现分布式锁的三种方法》这篇文章主要为大家详细介绍了基于SpringBoot实现分布式锁的三种方法,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录一、基于Redis原生命令实现分布式锁1. 基础版Redis分布式锁2. 可重入锁实现二、使用Redisso

SpringBoot的全局异常拦截实践过程

《SpringBoot的全局异常拦截实践过程》SpringBoot中使用@ControllerAdvice和@ExceptionHandler实现全局异常拦截,@RestControllerAdvic... 目录@RestControllerAdvice@ResponseStatus(...)@Except

Springboot配置文件相关语法及读取方式详解

《Springboot配置文件相关语法及读取方式详解》本文主要介绍了SpringBoot中的两种配置文件形式,即.properties文件和.yml/.yaml文件,详细讲解了这两种文件的语法和读取方... 目录配置文件的形式语法1、key-value形式2、数组形式读取方式1、通过@value注解2、通过

Java 接口定义变量的示例代码

《Java接口定义变量的示例代码》文章介绍了Java接口中的变量和方法,接口中的变量必须是publicstaticfinal的,用于定义常量,而方法默认是publicabstract的,必须由实现类... 在 Java 中,接口是一种抽象类型,用于定义类必须实现的方法。接口可以包含常量和方法,但不能包含实例