This question already has answers here:
How does the "this" keyword in Javascript act within an object literal? [duplicate]
(4 answers)
Are 'Arrow Functions' and 'Functions' equivalent / interchangeable?
(4 answers)
How does the "this" keyword work, and when should it be used?
(22 answers)
Closed 3 months ago.
My way of binding not working. please correct me.
const ob = {
name:'arif',
getName:() => {
console.log(this)
return this.name;
}
}
const x = ob.getName.bind(ob);
console.log(x()); //return the global name!!
Note:- Here even without binding your function will be taking this as ob only if you call it directly on object.
Arrow function do not have this, normal function do have
const ob = {
name:'arif',
getName: function(){
console.log(this)
return this.name;
}
}
const x = ob.getName.bind(ob);
console.log(x());
The Arrow function doesn't have an argument property of its own, the bind will fail with Arrow function.
instead, you can use normal function here:
const ob = {
name:'arif',
getName: function() {
console.log(this)
return this.name;
}
}
const x = ob.getName.bind(ob);
console.log(x()); //returns the object name !!
Related
This question already has answers here:
Methods in ES6 objects: using arrow functions
(6 answers)
Are 'Arrow Functions' and 'Functions' equivalent / interchangeable?
(4 answers)
How does the "this" keyword work, and when should it be used?
(22 answers)
Closed 1 year ago.
let greetings = {
fullName : "elham zeinodini",
getFullName : () => {
return this.fullName;
},
Greet : message => console.log(`${message} ${this.getFullName()} !!`)
}
console.log(greetings.fullName);
greetings.Greet("Hello");
let greetings = {
fullName : "elham zeinodini",
getFullName() {
return this.fullName;
},
Greet(message) {
console.log(`${message} ${this.getFullName()} !!`)
}
}
console.log(greetings.fullName);
greetings.Greet("Hello");
It means, quite literally, that the property getFullName on the context this is not a function. You're trying to invoke something that isn't a function.
Why is that? Because you can't use this like you are to refer to the surrounding object using an arrow function. Depending on your environment, it might refer to the window object (in the browser). And the window object doesn't have a function called getFullName. So that property evaluates to undefined. Which isn't a function, hence the error.
Use a "regular" function declaration instead. getFullName: function() {...}
The issue is with your arrow functions, which don't allow you to capture the this context.
Rewrite as follows:
let greetings = {
fullName : "elham zeinodini",
getFullName() {
return this.fullName;
},
Greet(message){
console.log(`${message} ${this.getFullName()} !!`)
}
}
console.log(greetings.fullName);
greetings.Greet("Hello");
This question already has answers here:
Arrow Functions and This [duplicate]
(5 answers)
Self-references in object literals / initializers
(30 answers)
Closed 1 year ago.
I know arrow functions don't have its own 'this' and references its parents and thus I assumed it to be pointing to its parent's 'this' i.e. obj. Would really appreciate if someone could answer this.
var obj = {
fullname: 'Jack',
prop: {
fullname: 'John',
getFullname: () => {
return this.fullname;
}
}
};
console.log(obj.prop.getFullname()); // undefined, as this is window not obj or prop
var test = obj.prop.getFullname;
console.log(test()); // undefined
This question already has answers here:
How does the "this" keyword work, and when should it be used?
(22 answers)
Javascript: Do I need to put this.var for every variable in an object?
(6 answers)
Closed 1 year ago.
function createPerson() {
var name = "test1";
var test = {
"name": "test2",
"getName": function() {
return name;
}
};
return test;
}
Here when I tried, createPerson().getName() it returns test1 value of outer function instead of object variable value i.e., test2.
Why does this happen?
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)
Arrow Functions and This [duplicate]
(5 answers)
Closed 2 years ago.
I try to understand the difference between this in the manner of arrow functions and ordinary ones. However, every time it seems that I got the idea, something is missing, so I started to clean the air a little bit, and found out this, and after coding around for a while, I got this difference.
class Func {
constructor(name) {
this.prop = name;
}
arrowLogger(){
let self = (() => {
return this.prop;
})();
console.log(self);
}
simpleLogger(){
console.log(this.prop);
}
}
let example = new Func(1);
global.prop = 2;
console.log(example.arrowLogger());
console.log(example.simpleLogger())
why do 2 console.log s print the same number?
And why is it not the same answer in the following piece?
class Func {
constructor(name) {
this.prop = name;
}
arrowLogger(){
setTimeout(() => {
console.log("arrow this:")
console.log(this)
console.log("arrow:",this.prop);
}, 0)
}
simpleLogger(){
setTimeout( function (){
console.log("simple this:")
console.log(this)
console.log("simple:" , this.prop)
} , 0)
}
}
let example = new Func(1);
global.prop = 2;
console.log(example.arrowLogger());
console.log(example.simpleLogger())
P.S. I used <> as I wrote this in Node.js.
This question already has answers here:
Self-references in object literals / initializers
(30 answers)
Closed 2 years ago.
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