this 代码输出题

1. 简单函数调用this问题

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

function doFoo() {
  foo();
}

var obj = {
  a: 1,
  doFoo: doFoo
};

var a = 2; 
obj.doFoo()

答案： 2。

obj.doFoo调用doFoo函数执行，执行foo()函数，foo()函数执行时环境为Window（全局），所以this指向window，即this.a = 2;

2.箭头函数的this

var a = 10
var obj = {
  a: 20,
  say: () => {
    console.log(this.a)
  }
}
obj.say() 

var anotherObj = { a: 30 } 
obj.say.apply(anotherObj) 

答案： 10 10。

箭头函数没有this，在定义箭头函数时，箭头函数的this就已经决定了（其他方式不能更改），为箭头函数所处环境所在的上下文，即obj所在的window全局上下文

3.函数用作构造函数

var obj = { 
  name : 'cuggz', 
  fun : function(){ 
    console.log(this.name); 
  } 
} 
obj.fun()     // cuggz
new obj.fun() // undefined

答案： 使用new构造函数时，其this指向的是全局环境window。

4. 普通函数、箭头函数

var obj = {
   say: function() {
     var f1 = () =>  {
       console.log("1111", this);
     }
     f1();
   },
   pro: {
     getPro:() =>  {
        console.log(this);
     }
   }
}
var o = obj.say;
o();
obj.say();
obj.pro.getPro();

答案： 1111 window对象、1111 obj对象、window对象

解析：

1. o和obj.say都指向function(){},内部有箭头函数，箭头函数的this为当前所处环境的this，而o在全局环境里，所以是window，而obj.say在obj对象里，所以this为obj；
2. obj.pro.getPro()，箭头函数是不绑定this的，getPro处于pro中，而对象不构成单独的作用域，所以箭头的函数的this就指向了obj所在的全局作用域window。

5. argument调用

var length = 10;
function fn() {
    console.log(this.length);
}
 
var obj = {
  length: 5,
  method: function(fn) {
    fn();
    arguments[0]();
  }
};
 
obj.method(fn, 1);

答案： 10、2

解析：

1. 第一次执行fn()，this指向window对象，输出10。
2. 第二次执行arguments[0]，相当于arguments调用方法，this指向arguments，而这里传了两个参数，故输出arguments长度为2。

6. window全局

function a(xx){
  this.x = xx;
  return this
};
var x = a(5);

console.log(x.x)


// var y = a(6);
// console.log(y.x);
// console.log(x.x);

答案：window

运行a()函数，this为window，所以window.x = 5，然后返回window，因为是var x来接收 window，所以window.x = 5被替换成window.x = x;

如果继续运行下面语句，会输出什么？

undefined、6

7. this 问题

var name = 222;
var a = {
    name: 111,
    say: function () {
        console.log(this.name);
    }
}
var fun = a.say;
fun();  
a.say();    

var b = {
    name: 333,
    say: function (fn) {
        fn()    
    }
}
b.say(a.say);   
b.say = a.say;
b.say();    

答案：222、111、222、333