Correct way to reference member function from static method in Javascript class
I have a situation where a class constructor returns the result of a static method call.
However, in this static method, I need to call a function that should be a member function, but if it is a member function, it is not available.
Is there a good way to do this?
This code should help clarify:
class Program {
constructor (paths) {
this.inputs = {}
this.program = Program.createProgram(paths)
return this.program
}
static createProgram () {
const return_program = {name: test}
// async function executes
this.modifyProgramName() // This is an error because modifyProgram name is not static on this class
return return_program
}
modifyProgramName() {
// Execute a promise
fetch('someresource').then(() => {
this.program.name = 'newName'
}, 500)
}
It modifyProgram
shouldn't be here static
, because the implication of "modifying" a program is that it already exists.
However, when I want to call modifyProgram
in createProgram
, which is essentially a constructor, I cannot because there is no instance of the program class yet.
Is there a good way to do this?
source to share
Try passing to a this
static function. Like this:
class Program {
constructor (paths) {
this.inputs = {}
this.program = Program.createProgram(paths, this)
return this
}
static createProgram (paths, program) {
const return_program = {name: "test"}
// async function executes
program.modifyProgramName() // This is an error because modifyProgram name is not static on this class
return return_program
}
modifyProgramName() {
setTimeout(() => {
this.program.name = 'newName'
}, 500)
}
}
Results from console:
pgm = new Program(["/one"]);
Program {inputs: Object, program: Object}
pgm.program.name
"newName"
Note that I changed yours setTimeout
to use the format =>
to this
match the object's.
If you don't need it createProgram
statically, this will work:
class Program {
constructor (paths) {
this.inputs = {}
this.program = this.createProgram(paths)
return this
}
createProgram (paths) {
const return_program = {name: "test"}
// async function executes
this.modifyProgramName() // This is an error because modifyProgram name is not static on this class
return return_program
}
modifyProgramName() {
setTimeout(() => {
this.program.name = 'newName'
}, 500)
}
}
pgm = new Program(["/one"]);
Program {inputs: Object, program: Object}
pgm.program.name
"newName"
source to share
It's a bad idea to return anything other than 'this' inside the constructor, as this can break inheritance.
Anyway, the problem is that when setTimeout is passed to a function using the function keyword, it is executed in the global context, which means the 'this' keyword will point to the global scope. One way to combat this is to use the es6 fat arrow functions or use the 'bind' keyword.
(function() {
this.program.name = 'newName';
}).bind(this)
source to share