This question already has answers here:
How does the "this" keyword work, and when should it be used?
(22 answers)
How to access the correct `this` inside a callback
(13 answers)
Closed 5 years ago.
Im currently getting into es6 and want to use the class pattern.
But how come "this.hola" is undefined in "onResize()"?
class Ui {
constructor() {
this.win = $(window);
this.hola = 'hola';
this.init();
}
init() {
this.addListeners();
}
addListeners() {
this.win.on('resize load', this.onResize);
}
onResize() {
console.log(this.hola);
}
}
export default Ui;
Related
This question already has answers here:
How to access the correct `this` inside a callback
(13 answers)
How does the "this" keyword work, and when should it be used?
(22 answers)
Closed last month.
Here I have a very simple class and I have a constructor inside of it and in constructor I am declaring a value donut_count but when I try to access that value in another function it says undefined why it is undefined:
class DonutMaker {
constructor() {
var donut_count = 1;
this.target = document.getElementById("donut_creater");
this.target.addEventListener("click", this.donutCreate);
}
donutCreate() {
console.log(this.donut_count);
}
}
let obj1 = new DonutMaker();
This question already has answers here:
Are 'Arrow Functions' and 'Functions' equivalent / interchangeable?
(4 answers)
How does the "this" keyword work, and when should it be used?
(22 answers)
arrow function and this
(2 answers)
How to access the correct `this` inside a callback
(13 answers)
Closed 7 months ago.
I'm trying to create a helper function. This function needs to reach some variables & objects of the context/class in which it is used. But, I could not achieve to do this. Is it possible to write functions to use like this?
Example:
// ExampleClass.js
const { demoArrowFunc, demoNormalFunction } = require('./MyHelpers')
class ExampleClass {
exampleVar = "EXAMPLE VAR";
constructor() {
this.firstVar = 20
}
logClassVars() {
console.log(this.exampleVar, this.firstVar);
}
tryArrows() {
demoArrowFunc();
}
tryNormal() {
demoNormalFunction()
}
}
let example = new ExampleClass()
example.tryArrows() // Returns -> undefined undefined
example.tryNormal() // Returns -> undefined undefined
// Helpers.js
const demoArrowFunc = () => {
console.log(this.exampleVar, this.firstVar);
}
const demoNormalFunction = function() {
console.log(this.exampleVar, this.firstVar)
}
module.exports = {
demoArrowFunc,
demoNormalFunction
}
Feel free to ask questions if I'm not clear. Thanks!
This question already has answers here:
How does the "this" keyword work, and when should it be used?
(22 answers)
When should I use arrow functions in ECMAScript 6?
(9 answers)
Closed 1 year ago.
I have such a situation in my NodeJS project:
//utility.js
module.exports = () => {
console.log(this.property1);
}
//main.js
const utilityFunc = require(./utility);
class MyClass {
constructor(name){
this.property1 = name;
}
foo(){
//...
utilityFunc();
}
}
const myObject = new MyClass('A name');
myObject.foo();
What I expect is to output 'A name', but property1 is not defined in the scope of this. This code seems to work if I write the function in main.js instead of importing it. I'm trying to figure out why this happens.
This question already has answers here:
Node.js ES6 Class unable to call class method from within class method when using Express.js
(1 answer)
Javascript recursion within a class
(5 answers)
How to access the correct `this` inside a callback
(13 answers)
Closed 4 years ago.
A class is defined as follow:
export default class FishGame {
constructor(window) {
.......
this.window = window
......
}
gameloop() {
this.window.requestAnimationFrame(this.gameloop);
var now = Date.now();
this.deltaTime = now - this.lastTime;
this.lastTime = now;
....
}
}
you can see the function gameloop is a recursive call.
I call this function in this way:
function game() {
let fishGame = new FishGame(this);
fishGame.gameloop();
}
while a exception is thrown, could someone tell me why this object is null?:
The problem is that this is lost in the callback. There are a few clean ways of doing it described in this post. One approach is to bind this to the callback, or use an arrow function which has this bound to it automatically:
class FishGame {
constructor() {}
gameloop() {
requestAnimationFrame(() => this.gameloop());
console.log(Date.now());
}
}
new FishGame().gameloop();
class FishGame {
static loop(game) {
function doloop() {
requestAnimationFrame(doloop)
game.gameloop()
}
doloop()
}
constructor() {
self = this;
this.name = "Lamax"
}
gameloop() {
console.log(Date.now()+": "+this.name);
}
}
FishGame.loop(new FishGame());
The problem is that you are calling this, inside the function thats passed as a argument in requestAnimationFrame, try the above snipet
This question already has answers here:
How to access the correct `this` inside a callback
(13 answers)
Closed 7 years ago.
I have declared a class in the following way:
function maskEditor() {
this.init();
};
maskEditor.prototype = {
foo: null,
container: new createjs.Container(),
init:function () {
this.foo = "bar";
this.container.on("mousedown", this.onMouseDown); // This is just an easeljs event dispatcher
},
onMouseDown: function (event) {
alert(this.foo); // WRONG. 'this' is out of the scope :(
}
};
Long story short: Im using easeljs library, and I have declared an event dispatcher to capture mouse clicks. I need to access the maskEditor object from inside that method. How can I do that?
You need to bind the context to the eventhandler:
this.container.on("mousedown", this.onMouseDown.bind(this));