CODEWITHSUNDEEP
javascript
Jas
Jas

Reputation: 15103

How to overcome "potentially invalid usage of this"?

I get potentially invalid usage of this when calling isDataMatchingnamespace how to overcome and how to call isDataMatchingnamespace in a proper way?

function Client() {

    var namespace = "default";

    this.addnamespaceTodata = function(data) {
        data.namespace = namespace;
        return data;
    };

    this.isdataMatchingnamespace = function(data) {
        return data.namespace === namespace;
    };

    this.filterdatasBynamespace = function(datas) {
        var result = [];
        _.forEach(datas, function(data) {
            if (this.isdataMatchingnamespace(data)) { // I get potentially invalid usage of this so how to overcome and how to call isDataMatchingnamespace in a proper way?
                result.push(data);
            }
        });
    }
}

module.exports = Client;

Upvotes: 5

Views: 11041

Answers (4)

swarnim gupta
swarnim gupta

Reputation: 231

es6 arrow functions does that for you automatically !

Just change the syntax to arrow function syntax

data => { your function goes here }

Upvotes: -1

Vaibhav Bajpayee
Vaibhav Bajpayee

Reputation: 502

Another better way would be to declare a variable at a class level like:

export class SomeComponent {someVarible = []; }

someFunction() { const tempVar = []; _.forEach(datas, function(data) { 
                  tempVar.push(data) // now use this variable to pass or
                  assign the data 
               }, this); 
                       this.someVarible = tempVar;
                          // OR
                       otherFunction(tempVar); // where you can use your varuiable
 }

Upvotes: 0

spankajd
spankajd

Reputation: 952

there is other way also by storing this value into variable.

let's say var _thisRef = this; define this below var namespace = "default"; and use _thisRef.isdataMatchingnamespace(data) without changing your code

your updated code as follow :

function Client() {

var namespace = "default";
var _thisRef = this;

this.addnamespaceTodata = function(data) {
    data.namespace = namespace;
    return data;
};

this.isdataMatchingnamespace = function(data) {
    return data.namespace === namespace;
};

this.filterdatasBynamespace = function(datas) {
    var result = [];
    _.forEach(datas, function(data) {
        if (_thisRef.isdataMatchingnamespace(data)) { // I get potentially invalid usage of this so how to overcome and how to call isDataMatchingnamespace in a proper way?
            result.push(data);
        }
    });
}
}

module.exports = Client;

Upvotes: 4

Paul
Paul

Reputation: 141827

That is an invalid usage of this, since this is undefined inside that function.

underscore.js allows you to pass an optional additional argument to forEach to specify what this should be inside the function. If you want it to be the same as this from outside the function, then pass this as the third argument into _.forEach:

    _.forEach(datas, function(data) {
        if (this.isdataMatchingnamespace(data)) {
            result.push(data);
        }
    }, this); // Added ", this"

Upvotes: 7

Related Questions