this和call、apply与bind

JavaScript中有个this，之前用js都是需要什么就搜索一下，基本上也就都能用了，也没系统的研究过这门语言，眼下打算学习前端，js可是得花些功夫才行...

核心原始函数

一个测试例子

function hello(thing) {
  console.log(this + ' says hello ' + thing);
}

hello.call('David', 'gimp')
// -> David says hello gimp

call接收的第一个参数绑定在了this上，然后后面的参数正常传递给hello

这是JavaScript函数调用的主要原始形式，但是如果在编程中一直call，一定会很烦，所以它允许我们用函数调用操作符直接调用函数。

function hello(thing) {
  console.log("Hello " +thing);
}

hello("world")

hello.call(window, "world");

如上的调用缺省把this绑定到了window上(Node.js中，全局关键字为global)

这也就是为设什么常用的函数中没发现this，却可以在函数中使用this的原因，理解了这些，关于this也就不会变的那么难以琢磨它是什么了

在《《JavaScript语言精粹》读书笔记（一）》中记录了函数调用的4种方式。第四个是apply，其实也不是很神秘，apply和call一样，可以用来改变this的值

除了call和apply，还有bind也可以改变，下面来举例看看它们三个的区别

var info1 = {
  name: 'wst',
  say: function (thing) {
    console.log(this.name + ' says hello ' + thing);
  }
}

var info2 = {
  name: 'lcm'
}

info1.say.call(info2, "gimp");
// -> lcm says hello gimp

info1.say.apply(info2, ["fedora"]);
// -> lcm says hello fedora

info1.say.bind(info2, "hexo")();
// -> lcm says hello hexo

从上面的例子可以得知

三个方法的第一个参数都是绑定到this的
call与apply是对函数直接调用，bind方法返回的仍然是一个函数
call与bind的传参是用逗号分隔的，apply传递参数需要数组

PS：因为bind方法返回函数，所以也可以这样调用

info1.say.bind(info2)("hexo");

参考