确定JavaScript函数是否为绑定函数

rob*_*bmj 22 javascript function

有没有办法确定JavaScript函数是否是绑定函数

例:

var obj = {
  x:1  
};

function printX() {
    document.write(this.x);
}

function takesACallback(cb) {
  // how can one determine if this is a bounded function
  // not just a function?
  if (typeof cb === 'function') {
    cb();  
  }
}

takesACallback(printX.bind(obj)); // 1
takesACallback(printX);           // undefined
Run Code Online (Sandbox Code Playgroud)

也许这是一个重点.我不是在问为什么第二个调用打印未定义.

Kyl*_*yll 30

绑定函数和箭头函数都没有prototype属性:

typeof (function() {}).prototype // 'object' as usual
typeof (function() {}).bind(null).prototype // 'undefined'!
typeof (() => {}).prototype // 'undefined'!
Run Code Online (Sandbox Code Playgroud)

这不是100%安全,因为您仍然可以手动分配此属性(虽然这很奇怪).
因此,检查可绑定性的简单方法如下:

// ES5
function isBindable(func) {
  return func.hasOwnProperty('prototype');
}

// ES6
const isBindable = func => func.hasOwnProperty('prototype');
Run Code Online (Sandbox Code Playgroud)

用法:

isBindable(function () {}); // true
isBindable(() => {}); // false
isBindable(
  (function () {}).bind(null)
); // false
Run Code Online (Sandbox Code Playgroud)

这样,您可以确保已传递的函数可以处理动态this.

以下是上述操作失败的示例用法:

const arrowFunc = () => {};
arrowFunc.prototype = 42;

isBindable(arrowFunc); // true :(
Run Code Online (Sandbox Code Playgroud)

有趣的是,虽然绑定函数没有prototype属性,但它们仍然可以用作构造函数(with new):

var Animal = function(name) {
   this.name = name;
};

Animal.prototype.getName = function() {
  return this.name;
};

var squirrel = new Animal('squirrel');
console.log(squirrel.getName()); // prints "squirrel"

var MutatedAnimal = Animal.bind({}); // Radiation :)
console.log(MutatedAnimal.hasOwnProperty('prototype')); // prints "false"

var mutatedSquirrel = new MutatedAnimal('squirrel with two heads');
console.log(mutatedSquirrel.getName()); // prints "squirrel with two heads"
Run Code Online (Sandbox Code Playgroud)

在这种情况下,使用原始函数prototype(Animal)代替.
请参阅JS Bin,代码和链接由Dmitri Pavlutin提供.

这当然不适用于箭头函数,因为它们不能用作构造函数.

不幸的是,我不知道是否有办法区分绑定函数(可用作构造函数)和箭头函数(不能用作构造函数)而不用try它们new并检查它是否抛出(new (() => {})抛出"不是构造函数") "错误).


Fel*_*ing 12

在支持ES6的环境中,您可以检查函数的名称是否以"bound "(单词"bound"后跟空格)开头.

从规格:

19.2.3.2 Function.prototype.bind(thisArg,... args)

[...]

15.执行SetFunctionName(F,targetName,"bound").

当然,如果手动更改函数的名称,则可能导致误报.

  • 这是一个比公认的答案更好的测试,因为本机函数通常也有一个空的原型。例如,[[] .slice.prototype`是未定义的。 (2认同)
  • 检查这两个条件可能是最安全的方法:`function isBound(func) { return func.name.startsWith('bound ') && !func.hasOwnProperty('prototype'); }` (2认同)

Oka*_*Oka 5

可以覆盖现有的原型绑定,标记已绑定的函数。

一个简单的解决方案。但是,由于隐藏的类,这可能会终止 V8(以及可能的其他运行时)中的某些优化。

(function (bind) {
  Object.defineProperties(Function.prototype, {
    'bind': {
      value: function (context) {
        var newf = bind.apply(this, arguments);
        newf.context = context;

        return newf;
      }
    },
    'isBound': {
      value: function () {
        return this.hasOwnProperty('context');
      }
    }
  });
}(Function.prototype.bind));
Run Code Online (Sandbox Code Playgroud)

运动中:

(function (bind) {
  Object.defineProperties(Function.prototype, {
    'bind': {
      value: function (context) {
        var newf = bind.apply(this, arguments);
        newf.context = context;

        return newf;
      }
    },
    'isBound': {
      value: function () {
        return this.hasOwnProperty('context');
      }
    }
  });
}(Function.prototype.bind));

var a = function () {
  console.log(this);
};
var b = {
  b: true
};
var c = a.bind(b);

console.log(a.isBound())
console.log(c.isBound())
console.log(c.context === b);
a();
c();
Run Code Online (Sandbox Code Playgroud)