开发中使用this的坑

59 阅读1分钟

一.this的用法

this代指当前(调用)的这个对象
局部函数this指向的是window
4种绑定规则分别是:默认绑定、隐式绑定、显示绑定、new绑定。优先级从低到高 

二.例子

var man = {
    name:"Jack",
    age:20,
    getName:function(){
        console.log(this.name)  
    },
    getAge:function(){
        function aa(){
            console.log(this) //可以查看this指向
            console.log(this.age)  //undefined,局部函数this指向的是window
        }
        aa();
        console.log(this.age)  //20
    }
}
man.getName();  //谁调用this就指向这个对象->man 输出Jack
man.getAge();  this->man
解决局部函数this指向window的方法:
    getAge:function(){
        var that = this; //将this保留
        function aa(){
            console.log(that.age) //20
        }
    }

三.例子2

var name = "Tom";
var obj = {
    name:"Jack",
    getName:function(){
        console.log(this.name);
    }
}
obj.getName();  //Jack 
var fn = obj.getName;
fn();   //this指向的是window,输出Tom
var fn1 = obj.getName.bind(obj); //把this绑定给obj
fn1();  //this指向的是obj,输出Jack

bind()和call()的区别就是,bind需要变量接收手动调用,call直接调用方法
手写一个bind方法:
    Function.prototype.newBind = function(obj){
        var self = this;
        return function(){
            self.apply(obj)
        }
    }