回调函数

回调函数(回调)，当我们把某个函数作为参数传递给另一个函数的时候，这个函数就是回调函数

回调函数的基本写法

<script>
    function func (callBack){

        // 处理其它操作
        callBack();
    }
    function demo(){
        console.log("这是一个回调函数");
    }
    func(demo);
</script>

demo01 this丢失

如果回调函数是某个对象的方法,而该对象方法中使用了this指针,那么该方法作为回调函数来使用的时候,需要注意this
001 提供一个对象,该对象中永远showName方法
002 提供一个函数,该函数接受一个参数(函数引用)
003 函数回调

<script>
//    把对象的方法作为函数的参数来进行传递
//    this丢失的问题:函数的调用方式发生了改变
    var obj = {
        name : "hello",
        age : 18,
        showName : function(){
            console.log(this.name);
        },
        showAge : function(){
            console.log(this.age);
        }
    }

    function demo(callBack){
        callBack();
    }

    demo(obj.showName); // 空
    demo(obj.showAge);  //undefined
</script>

demo02 回调函数(解决this的问题)

<script>
    var obj = {
        name : "张空",
        age : 18,
        showName : function(){
            console.log(this.name);
        },
        showAge : function(){
            console.log(this.age);
        }
    }

    function demo(callBack, callBack_obj){
        callBack.call(callBack_obj);
    }

    demo(obj.showName, obj);
    demo(obj.showAge, obj);
</script>

demo03 回调函数(兼容字符串方式)

<script>
    var obj = {
        name : "hello",
        age : 18,
        showName : function(){
            console.log(this.name);
        },
        showAge : function(){
            console.log(this.age);
        }
    }

    function demo(callBack, callBack_obj){

        if(typeof callBack == 'string')
        {
            callBack = callBack_obj[callBack];
        }

        if (typeof callBack == "function") {
            callBack.call(callBack_obj);
        }
    }

    console.log('==============')

    demo(obj.showName, obj);
    demo("showAge", obj);
</script>