关于Javascript回调函数的一个妙用_javascript技巧

前言

其实回调函数简单通俗点就是当有a和b两个函数,当a作为参数传给b,并在b中执行,这时a就是一个回调(callback)函数,如果a是一个匿名函数,则为匿名回调函数那下面们来通过一个实例来具体解释下Javascript回调函数怎么使用。

实例

在很久很久以前,有一个人。

var person;

他是个人,也就是一个对象。

person= {}; // 在JavaScript中,花括号就代表是一个对象

他有个名字叫小明。

person.name = '小明';

看一下是不是真的叫小明。

alert(person.name);

嗯,有一天,小明捡到了10块钱。

person.money = '10块钱';

有了钱就要花,于是他打算把10块钱用掉。

小明有一个花钱的方法 spendMoney ()

person.spendMoney =function(){  alert(this.name +"用 "+this.money +" 块钱买了漫画书!");  }

运行:

person.spendMoney();

弹出提示:小明用10块钱买了漫画书。

好了,问题来了,小明花钱就非得买漫画书吗,肯定不是。

事实情况应该是,这钱怎么办,还是由他自己说了算。因为钱在小明的口袋里。

所以,就可以用回调函数了。

回调函数本身就是一个数据类型。

在javaScript中,函数的地位和java中的Stringintboolean等等都是一样的,都可以看成是一个数据类型。

既然是数据类型,当然可以当成参数传递。

于是就应该这样:

person.spendMoney =function(doSomeThing){  doSomeThing();  }

打了个括号就是执行函数的意思。

没打括号的函数,就是和Stringint一样的玩意儿。

是一个数据类型。

一样的。

JAVA里面会这么写:

String str ="HelloWorld!";

在JavaScript中,函数也是一样的。

var say =function(){ 

   alert('HelloWorld');

}

这时候的say就是一个数据类型。

因为没有打括号,打了括号他才会执行!

小明用十块钱做什么,他自己说了算。

person.spendMoney(function(){});

这样就是把函数传进去了。

把函数传入spendMoney方法的目的就是让函数在里面执行的。

所以:

person.spendMoney =function(doSomeThing){  doSomeThing(); }

里面就打了括号,代表要执行这个函数。

具体做什么,自己决定。

person.spendMoney(function(){  alert('还是把钱存起来吧!'); });

总结

就是可以将函数作为一个参数,传入一个方法内,并且能够在该方法中执行这个函数,这也就是js特有的回调函数的魔力。

以上就是关于Javascript回调函数用法的全部内容,希望对大家的学习和工作能有所帮助。如果有疑问可以留言讨论。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索js回调函数写法
js回调函数例子
javascript 回调函数、javascript的回调函数、javascript中回调函数、javascript 回调、javascript 回调地狱,以便于您获取更多的相关知识。

时间: 2024-08-03 16:25:37

关于Javascript回调函数的一个妙用_javascript技巧的相关文章

Javascript基于AJAX回调函数传递参数实例分析_javascript技巧

本文实例讲述了Javascript基于AJAX回调函数传递参数的方法.分享给大家供大家参考,具体如下: 前面介绍了<javascript实现html页面之间参数传递的四种方法>,这里针对ajax参数传递做一分析. 在Javascript 中,特别是在AJAX中,回调函数常常是一个函数名,没有地方放入参数,如下面的AJAX代码,在成功后将调用回调函数callback,但callback是有参数的,如何把参数传进来呢? var callback = function(p1){ //do somet

JS回调函数的应用简单实例_javascript技巧

JS的回调函数很简单,看代码: 在a.js中 var myback = null; function load(obj){ myback = obj; } function save(){ // 后台请求 $.ajax.post...... // 调用回调函数 myback(); } 在b.js中进行调用 // 就是把要回调的函数当成参数传递过去! load(function(){ this.hide(); }) 以上是小编为您精心准备的的内容,在的博客.问答.公众号.人物.课程等栏目也有的相关

javascript 用函数实现继承详解_javascript技巧

一.知识储备: 1.枚举属性名称的函数: (1)for...in:可以在循环体中遍历对象中所有可枚举的属性(包括自有属性和继承属性) (2)Object.keys():返回数组(可枚举的自有属性) (3)Object.getOwnPropertyNames():所有的自有属性 3.属性的特性:数据属性和存取器属性 (1)数据属性:可写(writable)  可枚举(enumerable)  可配置(configurable)  值(value) 数据属性只有一个简单的值: (2)存取器属性: 写

js 异步操作回调函数如何控制执行顺序_javascript技巧

需求: fun A() { asyn(parm1, parm2, onsuccess(){ }) ;} fun B() {asyn(paem1, parm2, onsuccess(){}) ;} 函数B要求执行在函数A之后 异步执行 如果直接使用 A(); B(); 是不能够满足执行条件的. 考虑将B作为回调函数传递给A,然后A再执行的onsucess中执行B函数 A(B); 即可实现功能需求. js是单线程的. 1.调用函数时,如果参数多于定义时的个数,则多余的参数将会被忽略,如果少于定义时的

JavaScript eval() 函数介绍及应用示例_javascript技巧

eval(String) 函数可计算某个字符串,并执行其中的的 JavaScript 代码. 返回值 通过计算 string 得到的值(如果有的话). 说明 该方法只接受原始字符串作为参数,如果 string 参数不是原始字符串,那么该方法将不作任何改变地返回.因此请不要为 eval() 函数传递 String 对象来作为参数. 如果试图覆盖 eval 属性或把 eval() 方法赋予另一个属性,并通过该属性调用它,则 ECMAScript 实现允许抛出一个 EvalError 异常. 抛出 如

javascript的函数第1/3页_javascript技巧

作者:F. Permadi译者:Sheneyan(子乌)英文原文: INTRODUCTION TO JavaScript Functions中文译文(包括示例):javascript的函数子乌注:一篇相当不错的function入门文章,个人感觉相当经典. 词语翻译列表: function:函数(Function未翻译)declare:定义assign:指派,分配functionbody:函数体(就是函数的内容)object:对象property:属性unnamed:匿名(在这里没翻译成未命名)o

javascript用函数实现对象的方法_javascript技巧

本文实例讲述了javascript用函数实现对象的方法.分享给大家供大家参考.具体实现方法如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>利用函数实现对象(重要)</title&g

不得不分享的JavaScript常用方法函数集(上)_javascript技巧

本文中,收集了一些比较常用的Javascript函数,希望对学习JS的朋友们有所帮助. 1. 字符串长度截取 function cutstr(str, len) { var temp, icount = 0, patrn = /[^\x00-\xff]/, strre = ""; for (var i = 0; i < str.length; i++) { if (icount < len - 1) { temp = str.substr(i, 1); if (patrn.

手写的一个兼容各种浏览器的javascript getStyle函数(获取元素的样式)_javascript技巧

要想获取HTML元素的计算样式一直都存在很多的兼容问题,各浏览器都会存在一些差异,Firefox.webkit(Chrome,Safari)支持W3C标准的方法:getComputedStyle(),而IE6/7/8不支持标准的方法但是有私有的属性来实现:currentStyle,IE9和Opera两个都支持.有了这2个方法和属性基本上可以满足大多数要求了. 复制代码 代码如下: var getStyle = function( elem, type ){ return 'getComputed