在初学Javascript时，我们也许不需要担心函数绑定的问题，但是当我们需要在另一个函数中保持上下文对象this时，就会遇到相应的问题了，我见过很多人处理这种问题都是先将this赋值给一个变量（比如self、_this、that等），尤其是var that = this是我见的最多的，这样当你改变环境之后就可以使用它。这些都是可以的，但是还有一种更好的、更专有的方法，那就是使用Function.prototype.bind，下面进行详尽的讲解。
第一部分：需要解决的问题
首先看下面的代码var myObj = {
specialFunction: function () { }, anotherSpecialFunction: function () { }, getAsyncData: function (cb) { cb(); }, render: function () { this.getAsyncData(function () { this.specialFunction(); this.anotherSpecialFunction(); }); }};myObj.render(); 这里我希望创建一个对象，包含了前面两个普通的方法；第三个方法可以传递一个函数，传入的这个函数立即执行；最后一个方法会调用myObj对象的getAsyncData方法，这里使用了this，然后在getAsyncData方法中传入了一个函数，这个函数继续调用这个对象的前两个方法，仍使用了this，这时很多人实际上就可以看出问题所在了，将上述代码输入控制台，得到下面的结果：
TypeError: this.specialFunction is not a function
第二部分：问题剖析
在对象中render方法中的this的确是指向myObj对象的，所以我们可以通过this.getAsyncData来调用这个对象中的函数，但是当我们给其传递函数作为参数时，这里的this就指向了全局环境window了，因为全局环境中没有对象中的前两个方法，所以才会报错。
第三部分：解决问题的几种方式
所以我们需要做的就是正确调用对象中的前两个方法 ，很多人使用的方法便是首先在对象的环境中获取this赋值给另一个变量，这时就可以在后面的环境中调用了，如下所示：
render: function () { var that = this; this.getAsyncData(function () { that.specialFunction(); that.anotherSpecialFunction(); }); }
虽然这种方法是可行的，但是使用Function.prototype.bind()会使代码更清晰、易懂，如下所示：
render: function () { this.getAsyncData(function () { this.specialFunction(); this.anotherSpecialFunction(); }.bind(this));}
这里我们就成功地把this绑定到了环境中。
下面是另外一个简单的例子：
var foo = { x: 3}var bar = function(){ console.log(this.x);}bar(); // undefinedvar boundFunc = bar.bind(foo);boundFunc(); // 3
下面的例子也是常见的：
this.x = 9; // this refers to global "window" object here in the browservar module = { x: 81, getX: function() { return this.x; }};module.getX(); // 81var retrieveX = module.getX;retrieveX(); // returns 9 - The function gets invoked at the global scope// Create a new function with 'this' bound to module// New programmers might confuse the// global var x with module's property xvar boundGetX = retrieveX.bind(module);boundGetX(); // 81
第四部分：浏览器支持
但是这个方法在IE8及以下是不被支持的，所以我们可以使用来使得IE低版本支持.bind()方法：
if (!Function.prototype.bind) { Function.prototype.bind = function (oThis) { if (typeof this !== "function") { // closest thing possible to the ECMAScript 5 internal IsCallable function throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable"); } var aArgs = Array.prototype.slice.call(arguments, 1), fToBind = this, fNOP = function () {}, fBound = function () { return fToBind.apply(this instanceof fNOP && oThis ? this : oThis, aArgs.concat(Array.prototype.slice.call(arguments))); }; fNOP.prototype = this.prototype; fBound.prototype = new fNOP(); return fBound; };}
bind() 和 apply 与 call之间的转化。
对于apply和call，使用它们一般都是直接调用函数， 而对于bind，往往是对于一个函数bind, 然后返回了一个新的函数， 而没有直接调用。 如下;
var name = "John Zhu"; function foo() { console.log(this.name); } var a = { name: "zzw" }; foo.apply(a);
使用bind可以用下面的替代：
var name = "John Zhu"; function foo() { console.log(this.name); } var a = { name: "zzw" }; var bar = foo.bind(a); bar();
实现一个最简单的bind()函数
迅雷笔试所要求的：
- 新的bind方法返回的函数拷贝需要支持再次改变this的指向
- 新的bind方法需要像ES5标准的bind方法一样处理预设参数和函数拷贝的动态参数
实现如下所示：
var self = nullFunction.prototype.bind = function() { if (self == null){ self = this } var context = [].shift.call(arguments), args = [].slice.call(arguments); return function() { return self.apply(context, [].concat.call(args, [].slice.call(arguments))); }};
可以看到，这里先判断self是否存在，如果self为null，我们就让self指向this，然后，我们在通过[].shift.call(arguments);的方式获取到arguments的第一个元素。 通过[].slice.call(arguments);的方式获取到所有的后面传递进来的参数。最后，在返回一个function的时候，应当注意： 使用self调用，并且传入context环境，接着，传入之前传递的参数以及后面又传进来的参数。 非常好。
一些好的点：
- [].shift.call() 的使用、[].concat.call()的使用、 [].slice.call()的使用等， 即使用数组的方法时，我们可以使用[].slice.call()这种形式，好处是可以保证this的正确指向。
- call和apply的合理使用，比如在返回的function中我们使用apply，因为这样可以直接传入一个数组作为参数，会很方便。