this的四个绑定规则

this

有四种绑定规则

1、默认绑定规则 ： 直接调用 test() 指向的是 window

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

2、隐式绑定： 当调用一个对象的方法的时候，就会产生隐式绑定 此时的 this 指向的是 调用该函数的 对象

    var red = {
      name: 'lmj',
      age: 18,
      detail: function (){
        console.log(this.name); // lmj
        console.log(this.age); // 18
        console.log(this);
      }
    }
    red.detail();  // 这里的 this指向的是 red

3、硬绑定： 使用apply /call 来强行绑定某一个对象 this 指向 call/apply(obj) obj

var red = {
  name: 'lmj',
  age: 18,
  detail: function (){
    console.log(this.name); // lmj
    console.log(this.age); // 18
    console.log(this);
  }
}
red.detail();  // 这里的 this指向的是 red

var green = {
  name: 'xyy',
  age: 18
}

var blue = {
  name: 'ljl',
  age: 18
}

red.detail.call(green); // 这里输出的就是 xyy, 18 green
red.detail.apply(blue); // 这里输出的就是 ljl, 18 blue

4、构造函数绑定： 在一个对象中，使用构造函数样子的绑定后，this 将一直指向 该对象

function Lover(name) {
  this.name = name;
  this.sayName = function () {
    console.log('姓名是： ', this.name);
    console.log(this);  // 指向 person
  }
}
var name = '刘明杰'
var xiaohong = new Lover('小红')
xiaohong.sayName();  // 打印 小红  person

习题：

var name = '小红'
function a(){
  var name = '小白'
  console.log(this.name);
}

function d(i){
  return i()
}

var b = {
  name: '小黄',
  detail: function (){
    console.log(this.name);
  },
  bibi: function (){
    return function (){
      console.log(this.name);
    }
  }
}

var c = b.detail;
b.a = a;
var e = b.bibi();
a(); // 小红
c(); // 小红
b.a(); // 小黄
d(b.detail); // 小红
e(); // 小红