This question already has answers here:
Meaning of "this" in node.js modules and functions
(4 answers)
Closed 2 years ago.
Consider the following example:
const f1 = () => this;
function f2() {
return this;
}
console.log(f1(), f2());
When this code is executed in a browser, the result is as follows:
> window window
But when this code is executed in Node.js, the result is not quite as expected:
> {} global
Why in Node.js the empty object was taken as the context of an arrow function instead of Global Object (global on this platform)?
In nodejs, when you use arrow operator, the this operator won't contain the reference object by nature....thatswhy if we wanted to refer any variables using 'this' , we avoid using arrow operators in function definition.
Therefore in your case this is the reason why it's printing empty object.
Related
This question already has answers here:
What does "this" refer to in arrow functions in ES6?
(10 answers)
How do JavaScript closures work?
(86 answers)
Closed 8 months ago.
Consider the following constructor function having a method logging the context
function Foo() {
this.logContext1 = () => console.log('logContext1', this);
}
let foo = new Foo();
foo.logContext2 = () => console.log('logContext2', this);
foo.logContext1();
foo.logContext2();
logContext1 has context (this) set to the Foo object created by new,
whereas logContext2 has context (this) set to the window object
Considering both are arrow functions, why do we see this difference?
this is defined where the arrow functions are declared:
() => console.log('logContext1', this) is declared in the constructor, this is the object being created in that context
() => console.log('logContext2', this) is declared on top-level, this is window in that context (or undefined in strict mode)
This question already has answers here:
What's the meaning of "=>" (an arrow formed from equals & greater than) in JavaScript?
(14 answers)
Methods in ES6 objects: using arrow functions
(6 answers)
Closed 4 years ago.
In ES5, other properties in object can be accessed by using this keyword.
Same behavior but can't able to access other property in object by using this in arrow function (ES6)
Kindly run attached code snippet see the output
var person={
"firstName":"PraveenRaj",
"lastName":"D",
"getFullName": function() { return this.firstName+" "+this.lastName}
}
var person1={
"firstName":"PraveenRaj",
"lastName":"D",
"getFullName": () => this.firstName+" "+this.lastName
}
console.log(person.getFullName());
console.log(person1.getFullName());
Like all JavaScript variables, both the object name (which could be a normal variable) and the property name are case sensitive. You access the properties of an object with a simple dot-notation.
Following is the syntax for accessing Object Properties.
objectName.propertyName
An arrow function expression has a shorter syntax than a function expression and does not have its own this, arguments, super, or new.target. These function expressions are best suited for non-method functions, and they cannot be used as constructors.
Credits: Docs, Reference Answer
This question already has answers here:
What does "this" refer to in arrow functions in ES6?
(10 answers)
How does the "this" keyword in Javascript act within an object literal? [duplicate]
(4 answers)
Methods in ES6 objects: using arrow functions
(6 answers)
Are 'Arrow Functions' and 'Functions' equivalent / interchangeable?
(4 answers)
Closed 5 years ago.
Lets say I have this Object:
api = {
x: 2,
func: () => {
this.x
}
}
If I call api.function, how come this is scoped to the window and not api?
If I turn func into a regular anonymous function this is scoped to the api and not the window.
Can anyone explain this to me? I thought the arrow notation inherited the parent this, which is api
Arrow functions inherit this from their lexical scope, meaning the same value that this would mean in the scope they're defined in.
That's whatever this is in the function that contains that code; it has nothing to do with where in that scope you put the arrow function.
Simple explanation: problem is that the function is created before the api object and it is specifically bound to the window in your case because you are in a window scope. If I slightly rewrite your code using ES5 bind you can get the following
const func = function() {
this.x
}.bind(this); // here this is a window in your case
api = {
x: 2,
func: func
}
This code is equivalent to yours. Here you can clearly see that your function does not belong to the object api.
This question already has answers here:
When should I use arrow functions in ECMAScript 6?
(9 answers)
Closed 6 years ago.
I've recently begun using ECMAScript 2016's arrow functions instead of the original syntax to define functions. Would it be ok if I just used this syntax every time I wanted to define a function, or are are there any disadvantages like speed, etc.?
(function(){
alert('Is this');
})();
(()=>{
alert('somehow better than this?')
})();
One thing to note is that an arrow function does not have use of the arguments object.
let test = () => {
// expect an error
console.log(arguments);
}
test(1,2,3);
Arrow functions lexically bind this
You cannot use new on an arrow function:
let Person = (name) => {
this.name = name;
}
// expect an error
let person = new Person('Bob');
There are many differences, I would check some of the documentation on arrow functions.
Arrow functions are always anonymous and have lexical this. Differences in performance should be negligible but this might refer to something unexpected (or maybe it refers to exactly what you expect and you won't have to bind).
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 6 years ago.
I understand that there are quite a few question similar to this one but I couldn't find any which answers why or may how the context(value) of this changes when a callback function is called from inside the object function
like this
var obj = {
objproperty: "this is a property of obj",
func1: function(x,cb){
console.log(this) // refers to obj
var output_value = x + 20;
cb(output_value);
}
};
obj.func1(123,function(output_value){
console.log(output_value);
console.log(this); // does this refers to window or undefined??
});
as far as I understand the value shouldn't 'this' in third console.log be referring obj? as it called on the obj Object ?
as it called on the obj Object ?
No, it isn't.
cb(output_value);
There is nothing to the left of cb so it is called in the default context.
Your callback is called like this:
cb(output_value);
There's no object context in that function call, so the value of this will be either window (or the global context) in non-strict mode, or undefined in strict mode.
If you want to make sure that the callback has a this value that matches that in the context in which it's called, you can use .call():
cb.call(this, output_value);