js中关于this指向试题

js中关于this指向试题

可能有很多一开始接触js的小白也有被this指向弄得傻傻分不清，下面我给大家分享一个有关于this指向的简单易懂的试题。

  fn: function fn(b) {
            console.log(this)
            this.b = b;
            console.log(this.a);
        }
        var obj = {
            a: 4,
            fn: fn
        };
        fn();
        obj.fn();
        fn.call(obj);
        fn.apply(null);

具体步骤如下：

//关于fn（）的求解过程
  fn: function fn(b) {
            console.log(this)//全部函数this指向window
            this.b = b;
            console.log(this.a);//因为a不存在，所以undefined
        }     
      fn();//关于fn的求解过程
   

//关于obj.fn（）的求解过程
  fn: function fn(b) {
            console.log(this)//全部函数this指向window
            this.b = b;
            console.log(this.a);//因为a不存在，所以undefined
        }     
         var obj = {
            a: 4,
            fn: fn
        };
        obj.fn();
        //obj相当于：
         var obj = {
            a: 4,
            fn: function fn(b) {
            console.log(this)//this指向该对象obj,如果是箭头函数就指向window（箭头函数没有自己的this，则向上级找）
            this.b = b;
            console.log(this.a);//4（相当于obj.a）
        }   
        };
        
   

//关于fn.call(obj)的求解过程
  fn: function fn(b) {
            console.log(this)
            this.b = b;
            console.log(this.a);
        }     
         var obj = {
            a: 4,
            fn: fn
        };
       fn.call(obj);
      //call可以改变this指向，即将原先的this指向window变为obj
      //过程跟obj.fn()相同。     
   

//关  fn.apply(null)的求解过程
  fn: function fn(b) {
            console.log(this)
            this.b = b;
            console.log(this.a);
        }          
      fn.apply(null)
      //apply也可以改变this指向，当this指向为空时，即指向window
      //过程跟fn()相同   

归纳总结
apply,call均可以在调用时改变this的指向：
1）相同点：
  a）第一个参数为this的指向
  b）后面的参数为传的值
2）区别：call接受一个参数列表，apply接受一个包含多个参数的数组。