I have defined a function which returns object which has property and a method. using the returned object I am calling the method inside the object to get the value of the property in the object. but I didn't received what I expected.
function test(){
return {
a:'test property',
fn:()=>{
console.log('property', this.a);
}
}
}
const obj = test();
obj.fn() // what I expect is test property but I received undefined.
You have declared the function incorrectly. Remember that arrow functions do not have their own this like a regular function does.
You should declare it like this:
function test() {
return {
a: 'test property',
fn() {
console.log('property', this.a);
},
};
}
const obj = test();
obj.fn();
When you use a regular function this is scoped to how it is called. example
obj.fn()
obj is taken as your this
when you define using arrow function this is assigned on creation which points to the parent's context in your case its window
thiswithin the scope oftest(). You need to use a named function. See: this or Understanding “this” within anonymous function in JavaScript