this的用法

默认绑定:

当直接调用一个函数的时候 , 就是默认绑定

1 . 非严格模式下,默认绑定到 window上

2 . 严格模式下,没有绑定,返回 undefinde

隐式绑定:

当使用 对象.方法( ) 这种调用方式 , 称之为隐式绑定

this就绑定在调用的对象上

var name = "张三"
    var obj = {
        name : "李四",
        foo : function () {
            console.log(this.name);
        }
    }
    var foo = obj.foo;
    foo()

    //输出张三
    //谁调用指向谁(严格模式下会报错,因为严格模式下没有默认绑定)

new绑定:

使用new来调用构造函数的方式,this是绑定在新创建的那个对象上

在混合绑定中 , new优先级高

显示绑定

call , apply

仅仅这一次调用的时候使用了显示绑定, 对原函数没有任何的影响;

call和apply的区别就是参数传递的方式 :

call的参数是一个个传递参数

    function foo(a, b) {
        console.log(this.name, a, b);
    }

    foo.call({name: "张三"}, a, b);

apply是把函数封装到一个数组中去传递

    function foo(a, b) {
        console.log(this.name, a, b);
    }

    //foo.call({name: "张三"}, a, b);
    foo.apply({name:"张三"},[a,b])

String.prototype.toString.call() 显示内置类型

bind :固定绑定

调用函数对象的bind方法,就可以返回一个固定this绑定的新的函数

对原来的函数没有影响

    var obj = {name:"张三"}
    function foo() {
        console.log(this.name);
    }
    var f = foo.bind(obj)

    var obj2 = {
        name : "李四",
        foo : f
    }
    obj2.foo()

//输出结果给obj中的张三

优先级:固定绑定 -> 显示绑定 > new绑定 > 隐式绑定

回调函数的this绑定丢失问题

var name = "张三"
    var obj = {
        name : "李四",
        show : function () {
            setInterval(function () {
                console.log(this.name)
            },1000)
        }
    }
    obj.show()
#返回张三

解决方案1:

    var name = "张三"
    var obj = {
        name : "李四",
        show : function () {
            var that = this;
            setInterval(function () {
                console.log(that.name)
            },1000)
        }
    }
    obj.show()

解决方案2:

var name = "张三"
    var obj = {
        name : "李四",
        show : function () {
            setInterval(function () {
                console.log(this.name)
            }.bind(this),1000)
        }
    }
    obj.show()

显示绑定的丢失问题:

显示绑定到undefined和null上面的时候,会自动绑定当window上