js中this的深入研究

  this对象是函数在运行时由调用函数的对象决定的：

1、在全局对象中运行函数时，this等于window

2、当函数被作为某个对象的方法调用时， this等于那个对象.

需要注意的几点：

声明函数里的this指向window(不论在哪里声明)

 function ftn01(){
       console.log(this);//window
    function ftn02(){
        console.log(this);//window
    }
   ftn02();
    }
ftn01();

匿名函数里的this指向window(不论在哪里赋值)

var f3=function(){
  console.log(this);//window
  var f4=function(){
    console.log(this);//window
  };
  f4();
};
f3();

属于对象的方法或者说被对象调用时，this属于这个对象

   var obj = {
        name:"sharpxiajun",
        job:"Software",
        show:function(){
            console.log("Name:" + this.name + ";Job:" + this.job);
            console.log(this);// Object { name="sharpxiajun", job="Software", show=function()}
        }
    };
    var otherObj = new Object();
    otherObj.name = "xtq";
    otherObj.job = "good";
    otherObj.show = function(){
        console.log("Name:" + this.name + ";Job:" + this.job);
        console.log(this);// Object { name="xtq", job="good", show=function()}
    };
    obj.show();//Name:sharpxiajun;Job:Software
    otherObj.show();//Name:xtq;Job:good

如果通过new加构造函数（包括对象字面量定义）出来的对象，则对象里的this属于这个对象本身，如果通过这个对象再引用函数，则这个函数里的this属于这个对象

  function Person(name,sex,age,job){
        this.name = name;
        this.sex = sex;
        this.age = age;
        this.job = job;
        this.showPerson = function(){
            console.log("姓名:" + this.name);
            console.log("性别:" + this.sex);
            console.log("年龄:" + this.age);
            console.log("工作:" + this.job);
            console.log(this);// Person { name="马云", sex="男", age=46, 更多...}
        }
    }
    var person = new Person("马云", "男", 46, "董事长");
    person.showPerson();

new操作符的解释

new操作符会让构造函数产生如下变化：

　　1.       创建一个新对象；

　　2.       将构造函数的作用域赋给新对象（因此this就指向了这个新对象）；

　　3.       执行构造函数中的代码（为这个新对象添加属性）；

　　4.       返回新对象

Call和apply是将this指针指向方法的第一个参数。

  var name = "sharpxiajun";
    function ftn(name){
        console.log(name);
        console.log(this.name);
        console.log(this);
    }
    ftn("101");
    var obj = {
      name:"xtq"
    };
    ftn.call(obj,"102");
    /*
    * 结果如下所示：
    *101
     T002.html (第 73 行)
     sharpxiajun
     T002.html (第 74 行)
     Window T002.html
     T002.html (第 75 行)
     102
     T002.html (第 73 行)
     xtq
     T002.html (第 74 行)
     Object { name="xtq"}
    * */

以定义对象里的方法里传入函数为例：

　　情形一：传入的参数是函数的别名，那么函数的this就是指向window；

　　情形二：传入的参数是被new过的构造函数，那么this就是指向实例化的对象本身；

　　情形三：如果我们想把被传入的函数对象里this的指针指向外部字面量定义的对象，那么我们就是用apply和call

var obj={};
obj.f=function(){
  console.log(this);
};
obj.f();
function f2(f){
  f();
}
f2(obj.f);
setTimeout(obj.f,1000);
//obj
//window
//window

 

优先级	情景	this 的值	备注
1	new	new出来的空 object
	apply / call	传入的参数	并列第一，apply / call不能和 new 同时出现 new arr1.show.apply(“1”); // 报错
2	定时器	window
3	事件	发生事件的元素
4	方法	所有者
5	其他(嵌套等)	window || undefined	看是否为严格模式