Accessing outer scope from inner scope

Question

I have a type that looks a little something like this:

var x = function(){
    this.y = function(){

    }

    this.z = function(){
        ...
        this.A = function(){
            CALLING POINT
        }
    }
}

From calling point, I'm attempting to call function this.y. I don't need to pass any parameters, but when I set some stuff from this.A, I need to call this.y.

Is this possible? I'm OK with passing extra parameters to functions to make it possible.

Answer 1

Is this possible?

Yes, you can assign this reference to another variable and then call function y on it

this.z = function() {
    var self = this;
    this.A = function() {
        self.y();
    }
}

Answer 2

Version with bind , basically this adds a new method a to the object.

 var X = function () { this.y = function () { document.write('y<br>'); } this.z = function () { document.write('z<br>'); this.a = function () { document.write('a<br>'); this.y(); } }.bind(this); }; var x = new X; //xa(); // does not exist xz(); // z xa(); // ay 

Working example with saved inner this .

 var X = function () { var that = this; // <-- this.y = function () { document.write('y<br>'); } this.Z = function () { document.write('Z<br>'); this.a = function () { document.write('a<br>'); that.y(); } } } var x = new X, z = new xZ; // Z za(); // ay 

Answer 3

Instead of function() you can try modern JavaScript or Typescript ()=> . I also like .bind(this) .

Answer 4

You cannot because this.y() is not within the scope that this.A() is in. You can if you set this.y() to a global function y :

var y = function() {};
var x = function() {
    this.y = y;
    this.z = function() {
       ...
       this.A = function() {
           this.y(); // will be successful in executing because this.y is set to the y function.
       };
    }
};