Never lose scope again by binding

I hate losing scope in Javascript, however i like that it is quite flexible to what this should be in any situation. There are a few ways to achieve no issues with scope when moving into inner functions.

** Vanilla JS **

var myFoo = function() {
    var parent = this, myBar;

    myBar = function() {
        console.debug( 'parent is', parent, 'i am', this );
    }

    myBar()
}

or

var myFoo = function() {
    var myBar;

    myBar = (function() {
        console.debug( 'i am', this );
    }).bind(this);

    myBar()
}

** Coffeescript **

myFoo = ->
    myBar = ( ->
        console.debug 'i am ', @
    ).bind @

    myBar()

or

myFoo = ->
    myBar =>
        console.debug 'i am', @

    myBar()

I really like the bind solution as it is a way to set binding to the scope and it allows for interesting scenarios, where you can dynamically alter the binding on an anonymous function.

However bind is slower than lexical scope, so i feel that even though i prefer .bind(this) over self = this it will remain the best practice.

Hope this is helpful, i really like the .bind(this) to use over self = this. It saves a lot of issues and keeps my code clear