Function.prototype.bind用法示例

复制代码 代码如下:

  //ECMAScript 5 Function.prototype.bind函数兼容处理

  (function(){

  if ( !Function.prototype.bind ) { //function(){}.bind

  Function.prototype.bind = function ( o, /*参数列表*/ ) {

  var self = this, boundArgs = Array.prototype.slice.call(arguments, 0);

  return function(){

  var args = [], i;

  for ( i = 1; i < boundArgs.length; i++ ) args.push(boundArgs[i]);

  for ( i = 0; i < arguments.length; i++ ) args.push(arguments[i]);

  return this.apply(o, args);

  }

  }

  }

  })();

  用法示例:

  1、简单调用示例

  

复制代码 代码如下:

  /*example 1*/

  function f1(y, z){ return this.x + y + z;}

  //调用 1

  var g1 = f1.bind({x:1}, 2); //this.x = 1; y = 2;

  console.loog( g1(3) ); //this.x + y + 3 = 6;

  //调用 2

  var g2 = f1.bind({x:1}); //this.x = 1;

  console.log( g2(2,3) ); //this.x + 2 + 3 = 6

  /*example 2*/

  var f2(x, y){ return x + y; }

  //调用

  var g3 = f2.bind(null, 1); //x = 1

  console.log( g3(2) ); //x + 2 = 3

  2、DOM调用示例

  

复制代码 代码如下:

  var eleBtn = document.getElementById("button")

  , eleText = document.getElementById("text");

  eleBtn.onclick = function(color) {

  color = color || "#003399";

  this.style.color = color; //此时的this指向eleText

  }.bind(eleText, "#cd0000");