首页 > 其他分享 >js方法中回调函数的使用

js方法中回调函数的使用

时间:2023-01-28 11:24:02浏览次数:39  
标签:function 函数 usacs js second USCharts 回调 first

js方法中回调函数的使用

什么是回调函数(Callback)

在JavaScript中,函数是对象。 因此,函数可以将函数作为参数,并且可以由其他函数返回。 执行此操作的函数称为高阶函数。 作为参数传递的任何函数都称为回调函数。

回调函数具体的定义为:函数A作为参数(函数引用)传递到另一个函数B中,并且这个函数B执行函数A。我们就说函数A叫做回调函数。如果没有名称(函数表达式),就叫做匿名回调函数。

为什么我们需要回调?

出于一个非常重要的原因-JavaScript是一种事件驱动语言。这意味着JavaScript不会继续等待响应,而是会在侦听其他事件时继续执行。

让我们看一个基本的例子:

function first(){
console.log(1);
}
function second(){
console.log(2);
}
first();
second();
如你所料,首先执行函数,然后执行第二函数,将以下内容记录到控制台:

// 1
// 2
到目前为止一切都很好。

但是,如果函数包含无法立即执行的某些代码怎么办? 例如,我们必须先发送请求然后等待响应的API请求? 为了模拟此动作,将使用setTimeout,它是一个JavaScript函数,将在设置的时间后调用该函数。 我们将功能延迟500毫秒以模拟API请求。 我们的新代码将如下所示:

function first(){
// Simulate a code delay
setTimeout( function(){
console.log(1);
}, 500 );
}
function second(){
console.log(2);
}
first();
second();
现在了解setTimeout()的工作方式并不重要。重要的是,你看到我们把console.log(1)移到500毫秒延迟内。那么,当我们调用函数时会发生什么呢?

first();
second();
// 2
// 1
即使我们先调用了first()函数,我们在second()函数之后才打印了它的结果。

这并不是说JavaScript没有按照我们想要的顺序执行我们的函数,而是JavaScript在继续执行second()之前没有等待first()的响应。

因为你不能在一个函数后调用另一个另一个函数,而又希望它们以正确的顺序执行。

回调是一种确保某些代码在其他代码已经完成执行之前不会执行的方法。

 

1、调用先执行的方法(usload),在此方法中写上回调方法名(usloaddata)

<script>
    $(function () {
        //执行usload方法,执行完成后执行usloaddata方法
        usload(usloaddata);  
    });
</script>

2、编写usload方法

 

function usload(cb) {
    var wguid = usbasic.q("wguid");
    var url = "/extacs/acs_dash/acsonedashdata?wguid=" + wguid;
    //ushttp.UsAjaxJSON(url, null, true, function (data) {
    ushttp.us_ajax_post_jsonv2(url, null, true, true, function (data) {
        if (data.result == 0) {
            _wdata = data.data;
            cb();
        }
        else {
            usbasic.errorMsg(data.msg);
        }
    });
}

 

3、编写usloaddata方法

function usloaddata() {
    //如果没有选择投影机灯时,则不显示投影机灯时;
    if (_wdata.dataonepage.typeid.indexOf("51") < 0) {
        $("#section4").remove();
        _anchors = ['p1', 'p2', 'p3', 'p5'];
    }

    //USCharts.usacs_listroom();
    //USCharts.usacs_listdetail();
    //USCharts.usacs_listtype();
    //USCharts.usacs_typesum();
    //USCharts.usacs_projectorsum();
    //USCharts.usacs_room();
    //USCharts.usacs_dataonepage();
    //initialization(".autoheighttable");
    //usboxautoheight();
    //fullpage_api.destroy('all');
    //initialization(".autoheighttable2");
};
usloaddata

标签:function,函数,usacs,js,second,USCharts,回调,first
From: https://www.cnblogs.com/ZhuMeng-Chao/p/17069904.html

相关文章

  • vue配置反向代理解决跨域__Vue.js
    正向代理与反向代理正向代理:在客户端和原始服务器(originserver)之间架设一个代理服务器,为了从原始服务器取得内容,客户端向代理发送一个请求并指定目标(原始服务器),然后......
  • js中function的写法
    js文件中function的写法//Js代码functionfoo(){console.log('helloworld');}foo();//用匿名函数:varfoo=function(){console.log('helloworld')......
  • 数论笔记3-素因数分解式和取整函数
    1.素因数分解式的性质在第一篇里面我们证明了算术基本定理.下面我们对素因数分解式进行更细致的考察.首先我们对分解式中相同的素数进行合并,得到\(a=p_1^{\alpha_1}......
  • 读Java8函数式编程笔记03_高级集合类和收集器
    1. 方法引用1.1. 一种引用方法的轻量级语法1.1.1. 提供了一种简短的语法1.1.2. 标准语法为Classname::methodName1.2. 凡是使用Lambda表达式的地方,就可以使用1.......
  • PHP转Go实践:xjson解析神器「开源工具集」
    前言近期会更新一系列开源项目的文章,新的一年会和大家做更多的开源项目,也欢迎大家加入进来。xutil今天分享的文章源自于开源项目jinzaigo/xutil的封装。在封装过程中......
  • 如何从 JS 对象中删除属性?
    问题描述给定一个对象:letobj={name:'echohye',age:'18',hobby:'sleep'}如何删除属性hobby以得到以下obj?letobj={name:'echohye',age:'......
  • 安装配置node.js和npm
    一、安装nodejs环境运行官网下载的【.msi】安装包,全部默认下一步,完成安装。执行命令行node-v验证是否安装成功。二、更改npm默认安装路径在【nodejs】根目录,新建......
  • Angularjs的重要概念
    AngularJS的重要概念MVC模式AngularJS最早按照MVC模式设计,在这种设计模式下,AngularJS组件可以分为:M:Model,即模型,是应用程序中用于处理应用程序数据逻辑的部分,在Angula......
  • STM32-USART打印字符、字符串函数自己犯的错误反思
    voidUART_Send_Byte(USART_TypeDef*USARTx,uint8_tcha){ USART_SendData(USARTx,cha); while(USART_GetFlagStatus(USARTx,USART_FLAG_TXE)==RESET);}其......
  • js对象数组去重
    一个对象数组,根据传入的属性key对应的值来去重,实现方法如下,用双数组法,只要一次循环即可,时间复杂度低//对象数组去重arr=[{a:1},{a:2},{a:1},{a:3}]functiontodo(p......