Using the 'this' value inside an object

Question

Basicly I'm trying to add an object with my own functions inside the object.prototype.

Object.prototype.personalTest = {
  sum: function () {
    return this.something + this.other;
  }
};
var numbers = {
  something: 1,
  other: 2
};
console.log(numbers.personalTest.sum());

Problem is I can't get the value from the original object. The 'this' keyword uses my object as the 'this'.

How can I change the value of the 'this' or pass it to the object?

Edit I did this and it kind of worked but not as I wanted

var personalAccess = function () {
  var self = this;
  this.PersonalTools = {
    sum: function () {
      return self.something + self.other;
    },
    minus: function () {
      return self.something - self.other;
    }
  };
};
Object.prototype.personalTest = personalAccess;
var numbers = {
  something: 1,
  other: 2
};
console.log(numbers.personalTest());

The objects aren't part of the prototype anymore but that's not a problem. The problem is that for each variable i have to build the objects using the function.

console.log(numbers.personalTest());

..........Solution...........

I ended up learning a bit more tricks on javascript and used factory functions to solve my issue.

(function () {
var myTools = function () {
    var self = this;
    var tools = {
      sum: self.first + self.second
    };
    return tools;
  };
  Object.prototype.MyTools = myTools;
}());

Try to check out this stackoverflow.com/questions/2236747/… — julian salas
– julian salas, Commented Mar 16, 2018 at 12:16
Possible duplicate of Acess to this from subobject in JavaScript — melpomene
– melpomene, Commented Mar 16, 2018 at 12:19
This question is similar to: How to get access to parent object in a nested object. If you believe it’s different, please edit the question, make it clear how it’s different and/or how the answers on that question are not helpful for your problem. — dumbass
– dumbass, Commented Oct 18 at 8:31

Ele · Accepted Answer · 2018-03-16 12:54:51Z

1

The main problem is that you're thinking that the function sum declared within personalTest will have access to any attributes outside from it. The scope of function sum is the object personalTest.

An alternative, is either binding that object numbers to the function sum or executing the function call passing the object numbers.

numbers.personalTest.sum.bind(numbers)();
numbers.personalTest.sum.call(numbers);

Object.prototype.personalTest = {
  sum: function () {  
    return this.something + this.other;
  }
};

var numbers = {
  something: 1,
  other: 2
};


console.log(numbers.personalTest.sum.bind(numbers)());
console.log(numbers.personalTest.sum.call(numbers));

Or, you can assign those values to personalTest to make them accesible from the function sum.

Object.prototype.personalTest = {
  sum: function () {  
    return this.something + this.other;
  }
};

var numbers = {
  something: 1,
  other: 2
};

Object.assign(numbers.personalTest, numbers);
console.log(numbers.personalTest.sum());

Another alternative, is creating setters and getters to automatically set the necessary attributes to personalTest:

Object.prototype.personalTest = {
  sum: function () {  
    return this.something + this.other;
  }
};

var numbers = {
  set something(s) {
    this.thing = this.personalTest.something = s;
  },
  get something() {
    return this.thing;
  },
  set other(s) {
    this.o = this.personalTest.other = s;
  },
  get other() {
    return this.o;
  }
};

numbers.something = 1
numbers.other = 2

console.log(numbers.personalTest.sum());

.as-console-wrapper { max-height: 100% !important; top: 0; }

edited Mar 16, 2018 at 12:54

answered Mar 16, 2018 at 12:17

Ele

33.8k7 gold badges43 silver badges80 bronze badges

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

3 Comments

Anthony White Over a year ago

That is way to complicated for me hahah. Thing is I want something like a personal "submenu" of my own functions. That's why I'm looking for something like: variable.myPersonalFunctions.function1

Ele Over a year ago

@AnthonyWhite got it, well the alternative is bind those attributes to the function sum. :)

Anthony White Over a year ago

I'm going to try that. Thank you

axiac · Accepted Answer · 2018-03-16 12:21:31Z

0

The code:

Object.prototype.personalTest = {
  sum: function () {
    return this.something + this.other;
  }
};

adds a new property named personalTest to each object you create.

This property is an object itself, having one property, sum, that is a function. Inside the sum() function, this refers to this object whose property sum() is (i.e. the object you create and store in Object.prototype.personalTest).

You can let sum access the properties of numbers by invoking it this way:

var numbers = {
  something: 1,
  other: 2
};

console.log(numbers.personalTest.sum.call(numbers));

This way, the function sum() (accessible only through the property personalTest.sum of any object) is invoked using numbers as this.

5 Comments

Anthony White Over a year ago

That's exactly what I needed. Thank you. But is there a way that i can use the call function without needing to write it every time? I want to keep just numbers.personalTest.sum() Is it possible?

Ele Over a year ago

@AnthonyWhite can you check my answer. An alternative is using setters and getters.

axiac Over a year ago

You can, as well, add sum() directly as a property of Object.prototype and invoke it as numbers.sum().

Ele Over a year ago

@AnthonyWhite that last comment from axiac is a good alternative.

Anthony White Over a year ago

Thing is I want something like a personal "submenu" of my own functions. That's why I'm looking for something like: variable.myPersonalFunctions.function1

jurgen · Accepted Answer · 2018-03-16 12:20:47Z

0

numbers.personalTest.sum.call(numbers)

answered Mar 16, 2018 at 12:20

jurgen

891 silver badge2 bronze badges

3 Comments

GGO Over a year ago

Please add somes explanations editing your answer, avoid code only answer

jurgen Over a year ago

The call() method calls a function with a given this value and arguments provided individually.

GGO Over a year ago

Make a readable answer for people stackoverflow.com/help/how-to-answer not for me ;) that's why I precised editing the answer

Collectives™ on Stack Overflow

Using the 'this' value inside an object

3 Answers 3

3 Comments

5 Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

5 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related