用来访问对象的this

不可靠的外部变量名访问

let user = {
  name: "John",
  age: 30,

  sayHi() {
    alert(user.name); // "user" 外部变量名
  }

};
user.sayHi();  // TypeError: Cannot read property 'name' of null

如果我们决定将 user 复制给另一个变量，例如 admin = user，并赋另外的值给 user，那么它将访问到错误的对象。

不受限制的this

let user = {
  name: "John",
  age: 30,

  sayHi() {
    // "this" 指的是“当前的对象”
    alert(this.name);
  }

};

user.sayHi(); // John

在 JavaScript 中，this 关键字与其他大多数编程语言中的不同。JavaScript 中的 this 可以用于任何函数，即使它不是对象的方法。
this 的值是在代码运行时计算出来的，它取决于代码上下文。

let user = { name: "John" };
let admin = { name: "Admin" };

function sayHi() {
  alert( this.name );
}
user.f = sayHi;// 在两个对象中使用相同的函数
admin.f = sayHi;// 在两个对象中使用相同的函数
user.f(); // John（this == user）
admin.f(); // Admin（this == admin）

admin['f'](); // Admin（使用点符号或方括号语法来访问这个方法，都没有关系。)

在没有对象的情况下调用：this == undefined
我们甚至可以在没有对象的情况下调用函数：

function sayHi() {
  alert(this);
}

sayHi(); // undefined

在 JavaScript 中，this 是“自由”的，它的值是在调用时计算出来的，它的值并不取决于方法声明的位置，而是取决于在“点符号前”的是什么对象。

特别的箭头函数 = () =>

箭头函数有些特别：它们没有自己的 this。如果我们在这样的函数中引用 this，this 值取决于外部“正常的”函数。
举个例子，这里的 arrow() 使用的 this 来自于外部的 user.sayHi() 方法：

let user = {
  firstName: "Ilya",
  sayHi() {
    let arrow = () => alert(this.firstName);
    arrow();
  }
};

user.sayHi(); // Ilya

补充

• this是被作为函数调用的，而不是通过点符号被作为方法调用。
• 设置 this 的规则不考虑对象定义。只有调用那一刻才重要。

let calculator = {
    read(){
        this.a = +prompt('a?');//必须使用this
        this.b = +prompt('b?');//输入
    },
    sum(){
        return this.a + this.b;
    },
    mul(){
        return this.a * this.b;
    },
  };
  
  calculator.read();
  alert( calculator.sum() );
  alert( calculator.mul() );

• 链式调用[return this;]

let ladder = {
    step: 0,
    up() {
      this.step++;
      return this;//每次调用后返回这个对象本身。
    },
    down() {
      this.step--;
      return this;

    },
    showStep: function() { // 显示当前的 step
      alert( this.step );
      return this;

    }
  };
  ladder
    .up()//1
    .up()//2
    .down()//1
    .showStep()//1
    .down()//0
    .showStep();//0

是下面的简化

let ladder = {
  step: 0,
  up() {
    this.step++;
  },
  down() {
    this.step--;
  },
  showStep: function() { // 显示当前的 step
    alert( this.step );
  }
};
ladder.up();
ladder.up();
ladder.down();
ladder.showStep(); // 1
ladder.down();
ladder.showStep(); // 0

var log = console.log.bind(console)

创建一个全局变量 log，它是一个函数，指向 console.log 方法，并且绑定了 console 对象作为它的 this 值。

在JavaScript中，bind 方法是一个函数原型方法，它用于创建一个新的函数，这个新函数的 this 关键字被绑定到 bind 方法调用时传入的第一个参数。在这个例子中，bind 方法被用来绑定 console.log 函数的 this 值到 console 对象。

这样，无论你在哪里调用 log 函数，它都会像 console.log 一样工作，而不需要担心 this 的值。这意味着你可以直接使用 log 来打印信息，而不需要每次都写 console.log。