Sobes.tech
Junior

Co zostanie wyświetlone w konsoli, jeśli użyjesz this w console.log?

sobes.tech AI

Odpowiedź od AI

To zależy od kontekstu wywołania console.log i trybu ścisłego JavaScript ("use strict").

W kontekście globalnym (poza funkcjami i modułami):

  • W trybie nieścisłym ("use strict" jest nieobecny lub zadeklarowany w funkcji): this odnosi się do obiektu globalnego (window w przeglądarce, global w Node.js).
  • W trybie ścisłym: this będzie undefined.

Wewnątrz funkcji:

  • W trybie nieścisłym: this odnosi się do obiektu globalnego, jeśli funkcja jest wywoływana jako zwykła funkcja (myFunction()). Jeśli funkcja jest wywoływana jako metoda obiektu (myObject.myMethod()), this odnosi się do obiektu (myObject). Jeśli funkcja jest używana jako konstruktor (new MyClass()), this odnosi się do nowej instancji obiektu.
  • W trybie ścisłym: this będzie undefined, jeśli funkcja jest wywoływana jako zwykła funkcja. W innych przypadkach (metoda obiektu, konstruktor) zachowanie jest takie samo jak w trybie nieścisłym.

Wewnątrz funkcji strzałkowej (=>):

  • this jest dziedziczone leksykalnie z otaczającego kontekstu. Oznacza to, że wartość this wewnątrz funkcji strzałkowej będzie taka sama jak w zewnętrznej zwykłej funkcji lub w kontekście globalnym, w którym została zadeklarowana, niezależnie od tego, jak jest wywoływana. Funkcje strzałkowe nie wiążą this z własnym kontekstem wywołania.

Przykład:

// Kontekst globalny
console.log(this); // W przeglądarce: Window, w Node.js: global (tryb nieścisły)
                    // W przeglądarce: undefined, w Node.js: undefined (tryb ścisły)

// Funkcja zwykła
function showThisNonStrict() {
  console.log(this);
}

showThisNonStrict(); // W przeglądarce: Window, w Node.js: global

function showThisStrict() {
  "use strict";
  console.log(this);
}

showThisStrict(); // undefined

const myObject = {
  methodNonStrict: function() {
    console.log(this);
  },
  methodStrict: function() {
    "use strict";
    console.log(this);
  }
};

myObject.methodNonStrict(); // myObject
myObject.methodStrict();   // myObject

// Funkcja strzałkowa
const arrowFunc = () => {
  console.log(this);
};

arrowFunc(); // W przeglądarce: Window, w Node.js: global (dziedziczy z kontekstu globalnego)

const myObjectWithArrow = {
  arrowMethod: () => {
    console.log(this);
  }
};

myObjectWithArrow.arrowMethod(); // W przeglądarce: Window, w Node.js: global (dziedziczy z kontekstu deklaracji)