bind方法

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <button id="test">click me</button>
</body>
<script>
function bind(context,name){
    return function(){
        return context[name].apply(context,arguments);
  //用apply函数改变函数的上下文，apply函数的第一个参数就是我们需要的上下文对象。
    }
};
/*对比一下*/
//function bind(context){ 
  //self = this;  //保存this，即调用bind方法的目标函数
  //return function(){
    //  return self.apply(context,arguments);
  //};
//};


var button = {
    clicked: false,
    click: function(){
        this.clicked = true;
        console.assert(button.clicked,"The button has been clicked.");
        console.log(this);
    }
};
var elem = document.getElementById("test");
elem.addEventListener("click",bind(button,"click"),false);
//调用bind方法，bind方法的第一个参数就是我们需要的上下文对象；
//addEventListener()三个参数，分别是event,function，false
</script>
</html>

bind方法新增加 17/3/24

<body>
    <button id="button" value="点击"></button>
    <input type="text" id="text">
  </body>
    <script>
        var button = document.getElementById("button"),
        text = document.getElementById("text");
    button.onclick = function() {
        alert(this.id); // 弹出text
    }.bind(text);
    </script>

简写 fn.bind(this);

用途：改变上下文的