this的七种指向问题

this的七种指向问题

1. 普通函数中，this指向window

function fn() {
       console.log(this);   // window
     }
     fn();  //  window.fn（),此处默认省略window

2. 构造函数中，this指向实例化对象

function Person(age, name) {
         this.age = age;
         this.name = name
         console.log(this)  // 此处 this 分别指向 Person 的实例对象 p1 p2
     }
    var p1 = new Person(18, '张三')
    var p2 = new Person(18, '李四')
    console.log(p1)
    console.log(p2)

3. 对象函数中，this指向当前的对象

var obj = {
       fn: function () {
         console.log(this); // obj
       }
     }
    obj.fn();

4. 事件函数中，this指向事件源

btn.onclick = function() {
       console.log(this); // btn
     }

5. 在定时器函数中this指向window

setInterval(function () {
       console.log(this); // window
     }, 1000);

6. 原型对象的函数中：
   a. 如果是实例对象调用，this指向实例对象

   	function Person(name,age){
       this.name = name;
       this.age = age;
       console.log("输出");
       console.log(this);
   }
   Person.prototype.hobby = function(){
       console.log("输出");
       console.log(this);
   }
   var per = new Person("小明",20);
   per.hobby();
   

   b. 如果是原型对象调用，this指向原型对象

   function Person(name,age){
   	this.name = name;
   	this.age = age;
   }
   Person.prototype.hobby = function(){
   	console.log("理解性学习");
   }
   function Student(sex){
   	this.sex = sex; 
   }
   Student.prototype.like = function(){
   	console.log("打篮球");
   }
   Student.prototype = new Person("小明",20);
   var stu = new Student("男");
   console.dir(stu);
   stu.hobby();
   

7. 在数组函数中，this指向当前数组

var name_1 = "小明";
 function obj(){
     var name_1 = "小红";
     console.log(this);
     console.log(this.name_1);
     console.log(this[0].name_1);//打印数组第0个元素name_1属性
 }
 var arr = [{name_1:"我是arr[0]的name"},obj];//新建以数组对象
 arr.name_1 = "我是arr的name";//为数组对象添加name_1属性
 arr[1]();//数组下标方式调用函数