JS callback

一、定义

Google的解释：

A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.

翻译：

callback函数是一个以参数形式传递给另一个函数的函数，并且该函数（指callback函数）必须等另一个函数执行完才会被调用！（当被调用时，另一个函数就是callback函数的父函数）【即传递参数的变量类型是函数类型的时候会用到callback】

有一个有趣的比喻:

你有事去隔壁寝室找同学，发现人不在，你怎么办呢？

方法 1，每隔几分钟再去趟隔壁寝室，看人在不

方法 2，拜托与他同寝室的人，看到他回来时叫一下你

前者是轮询，后者是回调

二、例子

直接通过例子来说明，可能会比直接通过语言叙述来的简单明了

例一：callbac无参数

<script>
    function parent (callback) {
        console.log('父元素')
        callback()
    }
    function chaildA() {    
        console.log('子元素a')
    }
    parent(chaildA)
</script>

 

例二、callback有参数

<script>
    function parent (callback) {
        var a = 9
        var b = 10
        callback(a, b)
    }
    function chaildA(a, b) {    
      console.log(a + b) // 19
    }
    parent(chaildA)
</script>

<script>
   function A(a,callback){
      console.log(callback) // -3
     console.log(a+callback) // 1
   } 
   function B(c){ 
     return (-c); 
   } 
    A(4,B(3))
</script>

 例三

<div id="div1">原始值：</div>

<script>
  function a(callback) {
    div1.innerHTML += "a"
    callback()  
  }  
  function b(){
    div1.innerHTML+="b"
  }
 
  var div1
  window.onload = function () {
    div1 = document.getElementById("div1")
    setTimeout("a(b);", 0)
  }
</script>

例四：没有可用的接口可以测试，只是凭感觉封装了一下

<script>
    // 封装
   function doAjax(type, url, data, callback){
      $.ajax({
          type: type,
          url:url,
          data:data,
          success:callback
      })
    }
    // 调用
    function showAlert(data){
     alert(data)
    }
    // 使用
    var obj = {
        age: '1',
        name: 'wuyanzhi'
    }
    doAjax('POST', 'http://www.baidu.com', obj, showAlert)
</script>

【暂时先写这些吧，感觉这些还只是callback的皮毛，之后有新的体悟再修改。。。】

借鉴：JS回调函数callback用法-CSDN博客

借鉴：https://www.cnblogs.com/liuwei-0313/p/10053736.html

借鉴：JS中回调函数(callback)理解_js中callback方法-CSDN博客