48

How can I call Function.prototype.bind with an array of arguments, as opposed to hardcoded arguments? (Not using ECMA6, so no spread operator).

I'm trying to put a promises wrapper around a module that uses callbacks and I want to bind all of the arguments passed in to my wrapper method and bind them. Then I want to call the partially applied bound function with my own callback, which will resolve or reject a promise.

var find = function() {
  var deferred, bound;
  deferred = Q.defer();
  bound = db.find.bind(null, arguments);
  bound(function(err, docs) {
    if(err) {
      deferred.fail(err);
    } else {
      deferred.resolve(docs);
    }
  });
  return deferred.promise;
}

But obviously this doesn't work because bind expects arguments rather than an array of arguments. I know I could do this by inserting my callback onto the end of the arguments array and using apply:

arguments[arguments.length] = function(err, docs) { ... }
db.find.apply(null, arguments);

Or by iterating over the arguments array and rebinding the function for each argument:

var bound, context;
for(var i = 0; i < arguments.length; i++) {
   context = bound ? bound : db.find;
   bound = context.bind(null, arguments[i]);
}
bound(function(err, docs) { ... })

But both of these methods feel dirty. Any ideas?

Improve this question
2
  • I believe your last example is wrong. You just keep overwriting bound in each iteration. So you end up with bound bind db.find with the last argument bound to it. Commented Feb 2, 2014 at 5:40
  • Wasn't concentrating when I jotted it down. Cheers for the heads up. Commented Feb 2, 2014 at 5:46

11 Answers 11

Reset to default
82

.bind is a normal function, so you can call .apply on it.
All you have to do is pass the original function as the first param and the desired THIS variable as the first item in the array of arguments:

bound = db.find.bind.apply(db.find, [null].concat(arguments));
//      ^-----^            ^-----^   THIS

Whether that can be considered cleaner or not is left to the reader.

Improve this answer
Sign up to request clarification or add additional context in comments.

19 Comments

Of course. Fantastic! Cleaner in concept, but in practice? I think not.
Yeah, personally I'd find it rather confusing. It would probably help to wrap this in a function, something like function bindArray() { ... }, which makes the intend clearer.
A small note: [null].concat(arguments) yields [null, arguments] because arguments isnt treated like an array. Instead, this worked for me: var argsAsArray = Array.prototype.slice.call(arguments); bound = db.find.bind.apply(db.find, [null].concat(argsAsArray));
@MartijnOtto This is exactly what I wrote in my comment, isn't it? The only difference is that you inlined my definition of argsAsArray (which I wouldn't prefer for the sake of readability).
Magnificent... callback.bind.apply(callback, [this, data]) -- Thx a ton!
|
11

The following is a common snippet of code I use in all my projects:

var bind = Function.bind;
var call = Function.call;

var bindable = bind.bind(bind);
var callable = bindable(call);

The bindable function can now be used to pass an array to bind as follows:

var bound = bindable(db.find, db).apply(null, arguments);

In fact you can cache bindable(db.find, db) to speed up the binding as follows:

var findable = bindable(db.find, db);
var bound = findable.apply(null, arguments);

You can use the findable function with or without an array of arguments:

var bound = findable(1, 2, 3);

Hope this helps.

Improve this answer

3 Comments

Shouldn't this be Function.prototype.bind and Function.prototype.call?
@torazaburo It wouldn't really matter because Function is itself a function. Hence, it inherits bind and call from Function.prototype. Therefore, I used the shorter of the two forms because... I am a lazy sadist who likes to confuse people with terse code.
Bindable is bind,bind,bind ? I feel a song coming on.
9

Felix's answer didn't work for me because the arguments object isn't really an array (as Otts pointed out). The solution for me was to simply switch bind and apply:

bound = db.find.apply.bind(db.find, null, arguments);
Improve this answer

2 Comments

I found this conceptually slightly more difficult (I wanted a bound function call, I have a bound apply call), but it makes sense (I call bound apply, function is called just as well) and is syntactically much clearer :).
I find it easier to understand if written as Function.apply.bind(db.find, null, arguments). The general apply method is bound to execute db.find with context set to null and arguments array set to arguments.
4

For those using ES6, Babel compiles:

db.find.bind(this, ...arguments)

to:

db.find.bind.apply(db.find, [this].concat(Array.prototype.slice.call(arguments)));

I think it's fair to say Babel is pretty definitive. Credit to @lorenz-lo-sauer though, it's almost identical.

Improve this answer

Comments

1

Why not simply bind to the arguments array as per your example, and have the bound() function treat it just like that, as an array?

By the looks of your usage, you are then passing in a function as the final argument to bound(), which means by passing in the actual argument array, you avoid having to separate arguments from callbacks inside bound(), potentially making it easier to play with.

Improve this answer

Comments

1

Generically, this schema suffices:

//obj = db
//fnName = 'find'
var args = [this||null].concat(Array.prototype.slice.apply(arguments);
obj[fnName].bind.apply(obj[fnName], args);
Improve this answer

Comments

1

I find following cleaner than the accepted answers

Function.bind.apply(db.find, [null].concat(arguments));
Improve this answer

1 Comment

I did not know about Function.bind (but i used Function.prototype.bind). Is it part of any standard ?
1

If someone is looking for an abstract sample:

var binded = hello.apply.bind(hello,null,['hello','world']);

binded();

function hello(a,b){
  console.log(this); //null
  console.log(a); //hello
  console.log(b); //world
}
Improve this answer

Comments

0

Just had an alternative idea, partially apply the null value for context and then use apply to call the partially applied function.

bound = db.find.bind.bind(null).apply(null, arguments);

This removes the need for the slightly spooky looking [null].concat() in @Felix's answer.

Improve this answer

2 Comments

Shouldn't it be db.find.bind.bind(db.find, null).apply(null, arguments);?
I guess fn.bind.bind.apply is just as spooky as the [null] concat :-)
0

A definitive and simple answer might be

Function.apply.bind(this.method, this, arguments);

Kinda "hard" to grasp, yet, neat.

Improve this answer

1 Comment

Can you explain?
0

Just a side remark in case someone lands here after reading only the title of the question. I know the OP didn't want to use ES6 spread operators and explicitly asked for a call to bind(), so my answer is apparently twice off-topic.

However, it appears the actual need was to apply bind() to an unbound function (i.e. not a method), which makes bind essentially unnecessary.

bind() has to handle special cases (like enforcing the value of this for a constructor) which costs some computation time that is wasted if you just want to apply some parameters to an ordinary function and don't care about this to begin with.

A naive version of bind() stripped of the sanity checks and OOP-specific fiddling with this could be:

Function.prototype.naive_bind = function (fixed_this, ...fixed_args) {
    const fun = this;
    return function(...free_args) {
        return fun.call(fixed_this, ...fixed_args, ...free_args);
    }
}

So you can write your own pseudo-bind that drops this and does a "partial application" of your actual parameters:

function partial_application (fun, ...applied_args) {
    return function(...free_args) {
        return fun.call(null, ...applied_args, ...free_args);
    }
}

If you want to apply all your arguments and leave room for a last one, you can drop the extra parameters too:

function total_application (fun, ...applied_args) {
    return function(free_arg) {
        return fun.call(null, ...applied_args, free_arg);
    }
}

If your arguments are inside an array, you can destructure them:

function total_application_from_array (fun, [...applied_args]) {
    return function(free_arg) {
        return fun.call(null, ...applied_args, free_arg);
    }
}

I suppose you could use apply instead of call, but you'd have to add the extra free parameter to the array.

function total_application_from_array (fun, applied_args) {
    return function(free_arg) {
        return fun.apply(null, [...applied_args, free_arg]);
    }
}

so you'd use that as:

var a = partial_application (console.log, 1, 2, 3);
a(4,5,6);             // 1, 2, 3, 4, 5, 6
a("hello", "world");  // 1, 2, 3, hello, world

a = total_application (console.log, 1, 2, 3);
a()                  // 1, 2, 3, undefined
a(4, 5, 6)           // 1, 2, 3, 4

a = total_application_from_array(console.log, [1,2,3]);
a(4,5,6)             // 1, 2, 3, 4
Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.