开发公司JS中的 回调函数(callback)

目录


1.开发公司什么开发公司是回调函数(callback)呢?

开发公司把函数当作一个参数传开发公司到另开发公司外一个函数中,开发公司当需要用这个函数是,开发公司再回调运行()这个函数.

开发公司回调函数是一段可执行的代码段,它开发公司作为一个参数开发公司传递给其他的代码,其作用是开发公司在需要的时候方便调用这段(回调函数)代码。(开发公司作为参数开发公司传递到另外一个函数中,开发公司这个作为参数的函数就是回调函数)

理解:开发公司函数可以作为一个参数传递到另外一个函数中。

  1. <script>
  2. function add(num1, num2, callback) {
  3. var sum = num1 + num2;
  4. callback(sum);
  5. }
  6. function print(num) {
  7. console.log(num);
  8. }
  9. add(1, 2, print); //3
  10. </script>

分析:add(1, 2, print);中,函数print开发公司作为一个参数传入到add函数中,开发公司但并不是马上起作用,而是var sum = num1 + num2;开发公司运行完之后需要打印输出sum开发公司的时候才会调用这个函数。(开发公司这个作为参数传递到另外一个函数中,这个作为参数的函数就是回调函数.

匿名回调函数:

  1. <script>
  2. function add(num1, num2, callback) {
  3. var sum = num1 + num2;
  4. callback(sum);
  5. }
  6. add(1, 2, function (sum) {
  7. console.log(sum); //=>3
  8. });
  9. </script>

2.回调函数有哪些特点?

1.不会立即执行

回调函数作为参数传递给一个函数的时候,传递的只是函数的定义并不会立即执行。和普通的函数一样,回调函数在调用函数数中也要通过()运算符调用才会执行

2.回调函数是一个闭包

回调函数是一个闭包,也就是说它能访问到其外层定义的变量。

3.执行前类型判断

在执行回调函数前最好确认其是一个函数。

  1. <script>
  2. function add(num1, num2, callback) {
  3. var sum = num1 + num2;
  4. //判定callback接收到的数据是一个函数
  5. if (typeof callback === 'function') {
  6. //callback是一个函数,才能当回调函数使用
  7. callback(sum);
  8. }
  9. }
  10. </script>

3.回调函数中this的指向问题

注意在回调函数调用时this的执行上下文并不是回调函数定义时的那个上下文,而是调用它的函数所在的上下文。

举例:

  1. <script>
  2. function createData(callback){
  3. callback();
  4. }
  5. var obj ={
  6. data:100,
  7. tool:function(){
  8. createData(function(n){
  9. console.log(this,1111); //window 1111
  10. })
  11. }
  12. }
  13. obj.tool();
  14. </script>

分析:this指向是 离它最近的或者嵌套级别的 function/方法的调用者,这里离它最近的function是

function(n),会回到上面的callback()中,这时候调用者就不是obj而是window。

 解决回调函数this指向的方法1:

回调函数(若回调函数是普通函数时)当参数传入另外的函数时,若不知道这个函数内部怎么调用回调函数,就会出现回调函数中的this指向不明确的问题(就比如上面例子中this指向的不是obj而是window)。所以 把箭头函数当回调函数,然后作为参数传入另外的函数中就不会出现this指向不明的问题

  1. <script>
  2. function createData(callback){
  3. callback();
  4. }
  5. var obj ={
  6. data:100,
  7. tool:function(){
  8. createData((n)=>{
  9. this.data = n;
  10. })
  11. }
  12. }
  13. obj.tool();
  14. console.log(obj.data);
  15. </script>

 分析:回调函数用箭头函数写之后,this指向很明确,就是 离它最近的或者嵌套级别的 function/方法的调用者,所以这里是 obj 。

解决回调函数this指向的方法2:var self = this;

  1. <script>
  2. function createData(callback){
  3. callback(999);
  4. }
  5. var obj ={
  6. data:100,
  7. tool:function(){
  8. var self = this; //这里的this指向obj,然后当一个变量取用
  9. createData(function(n){
  10. self.data = n;
  11. })
  12. }
  13. }
  14. obj.tool();
  15. console.log(obj.data);
  16. </script>

4.为什么要用到回调函数?

有一个非常重要的原因 —— JavaScript 是事件驱动的语言。这意味着,JavaScript 不会因为要等待一个响应而停止当前运行,而是在监听其他事件时继续执行。来看一个基本的例子:

  1. <script>
  2. function first() {
  3. console.log(1);
  4. }
  5. function second() {
  6. console.log(2);
  7. }
  8. first();
  9. second();
  10. </script>

 分析:正如你所料,first 函数首先被执行,随后 second 被执行 —— 控制台输出:1  2

但如果函数 first 包含某种不能立即执行的代码会如何呢?例如我们必须发送请求然后等待响应的 API 请求?为了模拟这种状况,我们将使用 setTimeout,它是一个在一段时间之后调用函数的 JavaScript 函数。我们将函数延迟 500 毫秒来模拟一个 API 请求,新代码长这样:

  1. <script>
  2. function first() {
  3. // 模拟代码延迟
  4. setTimeout(function () { //所以function(){console.log(1)}是回调函数
  5. console.log(1);
  6. }, 500);
  7. }
  8. function second() {
  9. console.log(2);
  10. }
  11. first();
  12. second();
  13. </script>

分析:这里 function(){console.log(1)}函数当作一个参数传入setTimeout函数中,因为setTimeout是官方提供得一个函数,里面有很多复杂的业务程序,所以函数 function(){console.log(1)}传入后,不一定马上运行,要setTimeout里面要运行到function(){console.log(1)}时才会运行该函数参数,那是不是整个程序就一直等setTimeout运行?不是的!!!

整个程序运行结果为: 2  1 ,并不是原先的1 2 .即使我们首先调用了 first() 函数,我们记录的输出结果却在 second() 函数之后。

这不是 JavaScript 没有按照我们想要的顺序执行函数的问题,而是 JavaScript 在继续向下执行 second() 之前没有等待 first() 响应的问题。回调正是确保一段代码执行完毕之后再执行另一段代码的方式

5.回调函数和异步操作的关系是什么?回调函数是异步么?

定义:函数被认为是一种高级函数,一种被作为参数传递给另一个函数的高级函数。回调函数的本质是一种模式(一种解决常见问题的模式),因此回调函数也被称为回调模式。 

简而言之:一个函数在另一个函数中被调用。而且可以当参数传给其他函数。

所以: 回调函数和异步操作的关系是没有关系!!! 

那为什么很多的异步操作都有回填函数啊??

问:你所知道的异步操作,是回调的作用么???  并不是。

回调:更多的可以理解为一种业务逻辑把           异步编程:JS代码的执行顺序       

简单理解:callback 顾名思义  打电话回来的意思

eg1:你点外卖,刚好你要吃的食物没有了,于是你在店老板那里留下了你的电话,过了几天店里有了,店员就打了你的电话,然后你接到电话后就跑到店里买了。在这个例子里,你的电话号码就叫回调函数,你把电话留给店员就叫登记回调函数,店里后来有货了叫做触发了回调关联的事件,店员给你打电话叫做调用回调函数,你到店里去取货叫做响应回调事件。

eg2:再比如,你发送一个axios 请求,请求成功之后,触发成功的回调函数,请求失败触发失败的回调函数。这里面的回调函数更像是一个工具,后台通过这个工具告诉你,你成功了抑或是失败了。这里面的所有异步操作都和回调没关系,真正的异步是then方法。

网站建设定制开发 软件系统开发定制 定制软件开发 软件开发定制 定制app开发 app开发定制 app开发定制公司 电商商城定制开发 定制小程序开发 定制开发小程序 客户管理系统开发定制 定制网站 定制开发 crm开发定制 开发公司 小程序开发定制 定制软件 收款定制开发 企业网站定制开发 定制化开发 android系统定制开发 定制小程序开发费用 定制设计 专注app软件定制开发 软件开发定制定制 知名网站建设定制 软件定制开发供应商 应用系统定制开发 软件系统定制开发 企业管理系统定制开发 系统定制开发