200字范文,内容丰富有趣,生活中的好帮手!
200字范文 > js中回调函数的学习笔记【javascript】

js中回调函数的学习笔记【javascript】

时间:2022-12-13 04:47:50

相关推荐

js中回调函数的学习笔记【javascript】

web前端|js教程

回调函数

web前端-js教程

回调函数是什么在学习之前还真不知道js回调函数怎么使用及作用了,下面本文章把我在学习回调函数例子给各位同学介绍一下吧,有需了解的同学不防进入参考。

easyui 源码,为什么安装vscode网速很慢,ubuntu 输入i,访问tomcat首页地址,谷歌爬虫语言,php 获取url id,荆州电商seo推广公司排名,易分销网站源码lzw

回调函数原理:

源码测试工具,ubuntu14 wps,深圳买爬虫市场,php reactor,闪电seo silzw

我现在出发,到了通知你”

这是一个异步的流程,“我出发”这个过程中(函数执行),“你”可以去做任何事,“到了”(函数执行完毕)“通知你”(回调)进行之后的流程

网零梦工厂源码,cad如何使用vscode,ubuntu的网卡驱动,tomcat双向认证,git sqlite,网页设计需要费用报价,服务器数据库密码修改,绍兴服务器机房,typecho 代码高亮插件,超市仓库管理系统前端框架,什么是爬虫脑,php套件,南昌seo公司,springboot历史,超链接常用的三个标签,网站上传后后台进不去,vb填写网页表单,盗取dedecms模板,400后台管理,discuz登录页面,学生公寓管理系统开发,ichat聊天程序lzw

例子

1.基本方法

function doSomething(callback) {// … // Call the callbackcallback(stuff, goes, here);} function foo(a, b, c) {// Im the callbackalert(a + " " + b + " " + c);} doSomething(foo);

或者用匿名函数的形式

function dosomething(damsg, callback){ alert(damsg); if(typeof callback == "function") callback(); } dosomething("回调函数", function(){ alert("和 jQuery 的 callbacks 形式一样!"); });

2.高级方法

使用javascript的call方法

function Thing(name) {this.name = name;}Thing.prototype.doSomething = function(callback) {// Call our callback, but using our own instance as the contextcallback.call(this);} function foo() {alert(this.name);} var t = new Thing(Joe);t.doSomething(foo); // Alerts "Joe" via `foo`

传参数

function Thing(name) {this.name = name;}Thing.prototype.doSomething = function(callback, salutation) {// Call our callback, but using our own instance as the contextcallback.call(this, salutation);} function foo(salutation) {alert(salutation + " " + this.name);} var t = new Thing(Joe);t.doSomething(foo, Hi); // Alerts "Hi Joe" via `foo`

使用 javascript 的 apply 传参数

function Thing(name) {this.name = name;}Thing.prototype.doSomething = function(callback) {// Call our callback, but using our own instance as the contextcallback.apply(this, [Hi, 3, 2, 1]);} function foo(salutation, three, two, one) {alert(salutation + " " + this.name + " – " + three + " " + two + " " + one);} var t = new Thing(Joe);t.doSomething(foo); // Alerts "Hi Joe – 3 2 1" via `foo`

例子

//假如提供的数据源是一整数,为某学生的分数,当num0时由高层处理.

//将下面这个函数拷贝下来存盘为1.js

function f(num,callback){ if(num<0) { alert("调用低层函数处理!"); alert("分数不能为负,输入错误!"); }else if(num==0){ alert("调用低层函数处理!"); alert("该学生可能未参加考试!"); }else{ alert("调用高层函数处理!"); callback(); }}

//将下面这个test.html文件存盘与1.js在一个目录下:

无标题文档function test(){ var p=document.getElementById("pp"); pp.innerText=""; var num=document.getElementById("score").value; f(num,function(){ //匿名高层处理函数 if(num<60) alert("未及格!"); else if(num<=90) alert("该生成绩优良!"); else alert("该生成绩优秀!"); }) pp.innerText="by since1978 qq558064!" }

回调函数示例:当学生成绩score0时,由高层处理。

请输入学生成绩

下面是其它网友的补充:

javascript中的回调模式:

形如:

function writeCode(callback){ //执行一些事物, callback(); //... } function intrduceBugs(){ //....引入漏洞 } writeCode(intrduceBugs);

我们传递函数的应用给writeCode(),让writeCode在适当的时候来执行它(返回以后调用)

先看一个不怎么好的例子(后续要对其重构):

//模拟查找页面中的dom节点,将查找到的节点存在数组里面统一返回 //此函数只用于查找不对dom节点做任何的逻辑处理 var findNodes = function(){ var i = 100000;//大量的循环, var nodes = [];//用于存储找到的dom节点 var found; while(i){i -=1;nodes.push(found); } return nodes; } //将查找找到的dom节点全部隐藏 var hide = function(nodes){ var i = 0,max = nodes.length; for(;i<max;i++){ //findNodes后面有括号代表立即执行,先执行findNodes()然后执行hide()< hide(findNodes()); 执行函数 } ; nodes[i].style.display="none"}上面的方法是低效的,以为hide()必须再次遍历有findNodes()返回的数组节点,如何避免这种多余的循环呢。 我们不能直接在findNodes中对查询到的节点进行隐藏(这样检索就可修改逻辑耦合了),那么他就不再是一个通用函数了。 解决方法是用回调模式,可以将节点隐藏逻辑以回调函数方式传递给findNodes()并委托其执行//重构findNodes以接受一个回调函数 var findNodes = fucntion(callback){var i = 100000,nodes = [],found;//检查回调函数是否可用调用的if(typeof callback !== function){callback = false;}while(i){i -= 1;if(callback){ callback(found);}nodes.push(found);}return nodes; }//回调函数 var hide = function(node){node.style.display = one ; } //找到后续节点并在后续执行中对其进行隐藏 findNodes(hide);//先执行findNodes然后执行hide,当然回调函数也可以在调用主函数时创建:findNodes(function(node){node.style.display = one;});

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。