this指向、call、apply、bind

// 简单来说,this总是指向它所在函数的直接调用者。this永远指向的是最后调用它的对象,也就是看它执行的时候是谁调用的
function aaa(){
    var user = 'huangrong';
    console.log(this.user);
    console.log(this);
}
aaa();    //undefined、window
window.a();    //undefined、window

var o = {
    user: 'qingtian',
    fn: function(){
        console.log(this.user);
        console.log(this);
    }
}
o.fn();    //qingtian、对象o
window.o.fn();    //qingtian、对象o

var obj = {
    a: 10,
    x: 3
    b: {
        a: 12,
        fn: function(){
            console.log(this.a);
            console.log(this.x);
            console.log(this);
        }
    }
};
obj.b.fn();    //12、undefined、对象b
var j = obj.b.fn;
j();    //undefined、undefined、window

// new关键字可以改变this的指向,将这个this指向对象a
function Fn(){
    this.user = "追梦子";
}
var a = new Fn();
console.log(a.user); //追梦子

// 当this碰见return,如果返回值是一个对象,那么this指向的就是那个返回的对象,如果返回值不是一个对象那么this还是指向函数的实例
function fn(){
    this.user = '追梦子';
    return {};    //undefined
    // return function(){};    //undefined
    // return 1; //追梦子
    // return undefined;    //追梦子
    // return null;    //追梦子
}
var a = new fn; 
console.log(a.user);


// call和apply都是改变上下文中的this并立即执行这个函数,bind方法可以让对应的函数想什么时候调就什么时候调用,并且可以将参数在执行的时候添加
var a = {
    user: 'guojing',
    fn: function(x,y,z){
        console.log(this.user);
        console.log(`${x},${y},${z}`);
    }
}
a.fn(2,3,11);
var b = a.fn;

b.call(a,12,3,4);
b.call(null);

b.apply(a,[12,3,4]);
b.apply(null);

var c = b.bind(a,13);
c(14,15);

function aaa(){
    var name = 'guojing';
    this.user = 'huangrong';
    console.log('1==',this.name);
    console.log('2==',this.user);
    console.log('3==',this);
}
console.log('4==',aaa.name);
console.log('5==',aaa.user);
var b = new aaa();
console.log('6==',b.name);
console.log('7==',b.user);

// 执行结果:(不难,但是你猜到了吗?)

4== aaa
5== undefined
1== undefined
2== huangrong
3== aaa { user: 'huangrong' }
6== undefined
7== huangrong
工欲善其事 必先利其器
原文地址:https://www.cnblogs.com/fengyouqi/p/9553049.html