我們知道在javascript中call和apply以及bind都可以改變this指向，那麼它們是怎麼實現的呢？彼此之間有什麼區別呢？首先我們先來分別解析一下它們：
（一）call
首先我們先來看一下如何使用call:

        var value = 'window';
        var obj = {
            value: 'obj'
        }
        function show(num1, num2) {
            console.log(this.value);
            console.log(num1 + num2);
        }
        show(10
 
,100); //window 110
        show.call(obj,10,100); //obj 110
        show.call(null,10，100); //window  110

如上面輸出結果可以看出：
1.call方法的第一個引數用於改變this指向，但是如果傳入null/undefined值，this會指向window
2.call方法需要把實參按照形參的個數傳進去
現在我們已經知道如何使用call以及它的規則，那麼我們來封裝一個自己的call方法

Function.prototype.myCall = function () {
            var ctx = arguments
 
[0] || window;
            ctx.fn = this;//誰呼叫myCall方法，this就指向誰
            //由於使用call方法的時候，引數的個數是不確定的，但是我們現在又想執行fn方法,可以使用eval來實現
            //也就是eval('ctx.fn(arguments[1],arguments[2]....'),這裡使用一個args陣列來拼接arguments[1],arguments[2].....字串
            var args = [];
            for (var i = 1; i < arguments
 
.length; i++) {
                args.push('arguments[' + i + ']');
            }
            var result = eval('ctx.fn(' + args.join(',') + ')');
            delete ctx.fn;
            return result;
        }
        show.myCall(obj, 10, 100);

(二)apply
也是一樣，先來看一下它該如何使用：

show.apply(obj, [10, 100]);//obj 110
show.apply(null, [10, 100]);//window 110

apply方法與call方法十分相似，只是傳參列表不同：
1.apply方法的第一個引數用於改變this指向，但是如果傳入null/undefined值，this會指向window
2.apply方法的第二個引數需要傳入一個實參列表，也就是arguments

 Function.prototype.myApply = function (ctx, arr) {
            ctx = ctx || window;
            ctx.fn = this;
            var result;
            if (arr) {
                var args = [];
                for (var i = 0; i < arr.length; i++) {
                    args.push('arr[' + i + ']');
                }
                result = eval('ctx.fn(' + args.join(',') + ')');
            } else {
                result = ctx.fn();
            }
            delete ctx.fn;
            return result;
        }

（三）bind方法
同樣，先來看一下如何使用它：

       var value = 'window';
        var obj = {
            value: 'obj'
        };
        Parent.prototype.value = 'parent';
        function Parent() {
        }
        Child.prototype = new Parent();
        function Child() {
        }
        function show(name, age) {
            console.log(this.value, name, age);
        }
        show();//window undefined undefined
        var newShow1 = show.bind(obj);
        newShow1();//obj undefined undefined
        var newShow2 = show.bind(null);
        newShow2();//window undefined undefined
        var newShow3 = show.bind(obj, 'test');//函式擁有預設的初始引數
        newShow3();//obj test undefined
        new newShow3();//undefined test  undefined
        var oS = Child.bind(obj);
        var fn = new oS();
        console.log(fn, fn.value);//Child{} "parent" 當使用new 操作符呼叫繫結函式時，引數obj無效。

根據上面的執行結果，我們可以總結一下bind的用法規則：
1.bind() 函式會建立一個新函式（稱為繫結函式），新函式與被調函式（繫結函式的目標函式）具有相同的函式體
2.bind方法的第一個引數也是用於改變this指向，如果傳入null/undefined，this會指向window
3.一個繫結函式也能使用new操作符建立物件：這種行為就像把原函式當成構造器。提供的 this 值被忽略
4.bind方法可以使函式擁有預設的初始引數。這些引數（如果有的話）作為bind()的第二個引數跟在this（或其他物件）後面，之後它們會被插入到目標函式的引數列表的開始位置，傳遞給繫結函式的引數會跟在它們的後面。

現在來封裝一個自己的bind方法吧

Function.prototype.myBind = function (target) {
            target = target || window;//如果沒有傳入,就為window
            var self = this;//誰呼叫myBind，this就指向誰
            var args = [].slice.call(arguments, 1);//args:[arguments[1],arguments[2]....]
            var temp = function () { };
            var fn = function () {
                var fnArgs = [].slice.call(arguments, 0);
                //this 如果new fn()  this 指向構造出來的物件，否則為window ;this instanceof fn看this的原型鏈上有沒有fn的原形
                return self.apply(this instanceof fn ? this : target, args.concat(fnArgs));
            }
            temp.prototype = this.prototype;
            fn.prototype = new temp();  //形成繼續關係  fn.prototype.__proto__ == this.prototype  true
            return fn;
        }
        var newShow5 = show.myBind(obj, 'test1');
        newShow5(1);//obj test1 1
        var test = Child.bind(obj);
        var fn = new test();
        console.log(fn, fn.value);//Child {} "parent"