"this" keyword does not refer to global object in my javascript program

user_17620914 0
Viewed 60

I implemented this code by using javascript to check how this works in arrow function.

variable = 'Global variable';

function normalFunc () {
  console.log(this.variable);
}

const arrowFunc = () => {
  console.log(this.variable);
};

const objNormal = {
  variable: 'Inner variable',
  func: normalFunc
};

const objArrow = {
  variable: 'Inner variable',
  func: arrowFunc
};

objNormal.func();
objArrow.func();

arrowFunc();

I learned that this refers to global object in arrow function, so i expected the output like this

Inner variable
Global variable
Global variable

BUT the actual output was this...

Inner variable
undefined
undefined

Actually, it's really strange because this depends on where to run this code... in JS Fiddle, this refer to global object as i expected. But in my terminal and this playground site, this does not refer to global object.

Am i misunderstanding about this or just something is missing in my code?

Please help me to understand why this happens.

arrow-functions node.js this function javascript
1 Answers

The website linked transpiles the JS code to be inside a function, so this is not window. If you change your first line to be

this.variable = 'Global variable';

the code works as expected.

When this is pasted into a .js file (filename.js) and ran with node (node filename.js), the this keyword is an empty object while global is a completely different thing. This is different from running this code in the REPL mode, where this === global.

In both cases, when you just say variable = 'Global variable';, you're assigning to window.variable or global.variable, so you can't access it with this.variable.

user_121015540
Related