Determine if a JavaScript function is a bound function

前端 未结 7 1570
梦如初夏
梦如初夏 2020-12-14 16:51

Is there a way to determine if a JavaScript function is a bound function?

Example:

7条回答
  •  慢半拍i
    慢半拍i (楼主)
    2020-12-14 17:06

    Both bound functions and arrow functions do not have a prototype property:

    typeof (function() {}).prototype // 'object' as usual
    typeof (function() {}).bind(null).prototype // 'undefined'!
    typeof (() => {}).prototype // 'undefined'!
    

    This is not 100% safe since you could still manually assign this property (although that'd be weird).
    As such, a simple way to check for bindability would be the following:

    // ES5
    function isBindable(func) {
      return func.hasOwnProperty('prototype');
    }
    
    // ES6
    const isBindable = func => func.hasOwnProperty('prototype');
    

    Usage:

    isBindable(function () {}); // true
    isBindable(() => {}); // false
    isBindable(
      (function () {}).bind(null)
    ); // false
    

    This way you can make sure that the function that has been passed can deal with a dynamic this.

    Here is an example usage for which the above fails:

    const arrowFunc = () => {};
    arrowFunc.prototype = 42;
    
    isBindable(arrowFunc); // true :(
    

    Interestingly, while bound functions do not have a prototype property they can still be used as constructors (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"
    

    In that case, the original function prototype (Animal) is used instead.
    See JS Bin, code and link courtesy of Dmitri Pavlutin.

    This of course won't work with arrow functions since they can't be used as constructors.

    Unfortunately, I don't know if there is a way to distinguish a bound function (usable as constructor) from an arrow function (not usable as constructor) without trying them out with new and checking if it throws (new (() => {}) throws a "is not a constructor" error).

提交回复
热议问题