Binding Arguments with Bind

By  on  

One of my favorite and most essential Function method is bind, a function we added to MooTools when it wasn't featured in the JavaScript language itself. We often think of using bind to simply bind a method's call to its host object, but did you know you can also bind arguments with the host object?

You've probably done something like this:

this._onTargetAvailable = this._onTargetAvailable.bind(this);

That pattern is frequently used, especially in classed-based code or when passing callback functions. What you may not often see is bound arguments:

this._onTargetAvailable = this._onTargetAvailable.bind(
    this,
    arg1,
    arg2,
    arg3
);

Binding arguments gives you more power in how your bound function is used! Whenever onTargetAvailable is called, the arguments you provide will be in that order, and any additional arguments will be added to the end of the argument list!

Recent Features

  • By
    CSS @supports

    Feature detection via JavaScript is a client side best practice and for all the right reasons, but unfortunately that same functionality hasn't been available within CSS.  What we end up doing is repeating the same properties multiple times with each browser prefix.  Yuck.  Another thing we...

  • By
    Vibration API

    Many of the new APIs provided to us by browser vendors are more targeted toward the mobile user than the desktop user.  One of those simple APIs the Vibration API.  The Vibration API allows developers to direct the device, using JavaScript, to vibrate in...

Incredible Demos

  • By
    Simple Image Lazy Load and Fade

    One of the quickest and easiest website performance optimizations is decreasing image loading.  That means a variety of things, including minifying images with tools like ImageOptim and TinyPNG, using data URIs and sprites, and lazy loading images.  It's a bit jarring when you're lazy loading images and they just...

  • By
    Highlight Table Rows, Columns, and Cells Using MooTools 1.2.3

    Row highlighting and individual cell highlighting in tables is pretty simple in every browser that supports :hover on all elements (basically everything except IE6). Column highlighting is a bit more difficult. Luckily MooTools 1.2.3 makes the process easy. The XHTML A normal table. The cells...

Discussion

    Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!