Javascriptda 'this' kalit so'zi

Funksiyadagi this kalit so'zi javascriptda boshqa tillarga qaraganda boshqacharoq ishlaydi va shuningdek, ushbu kalit so'z strict mode ya'ni qat'iy rejimdagi kodda ham oddiy javascript kodga nisbatan boshqacha ishlaydi.

Ko'pincha, this kalit so'zining qiymati funksiya qanday chaqirilshiga qarab belgilanadi.Kodni ishga tushirish vaqtida shunchaki qiymat berish orqali uni qiymatini belgilab bo'lmaydi va uning qiymati har safar funksiya chaqirilganda har xil bo'lishi mumkin. ES5'dan boshlab funksiya qay holatda chaqirilishidan qat'iy nazar, funksiyadagi this kalit so'zi uchun bind() metodi orqali qiymat berish taklif qilindi. ES2015'dan boshlab esa o'zining this kalit so'ziga ega bo'lmagan arrow funksiya tanishtirildi.

Sintaksis:

This

Qiymati:

Oddiy Javascript kodda(non-strict mode) har doim obyekt uchun reference bo'la oladi holos, qat'iy rejim(strict mode)da esa har qanday qiymatga ega bo'lishi mumkin.

Tavsifi:

Global kontekst:

Global kontekstda(har qanday funksiyadan tashqarida) this kalit so'zi, qat'iy rejimda yoki yo'qligidan qat'iy nazar global obyektga (window) ishora qiladi.

// Brauzerlarda window obyekti global obyekt hisoblanadi
console.log(this === window); // true

a = 37;
console.log(window.a); // 37

this.b = "ilmHub";
console.log(window.b)  // "ilmHub"
console.log(b)         // "ilmHub"

eEslatma: Qaysi kontekstdan kod yozishingizdan qat'iy nazar, globalThis xususiyatidan foydalanib, har doim global obyektni osongina olishingiz mumkin.

Funksiya Konteksti:

Funksiya ichida this kalit so'zining qiymati funksiya qanday chaqirishga bog'liq.

Quyidagi kod qat'iy rejimda bo'lmagani uchun va this'ning qiymati funksiya chaqirilish paytida belgilanmaganligi tufayli, this avtomatik tarzda brauzerdagi global obyekt bo'lmish window'ga ishora qiladi.

function f1() {
  return this;
}

// brauzerda:
f1() === window; // true

// Node'da:
f1() === globalThis; // true

Ammo, qat'iy rejimda esa agar kod ishga tushishni boshlaganda this kalit so'ziga qiymat berilmagan bo'lsa, quyida holatdagidek, undefined ya'ni aniqlanmagan qiymatga teng bo'ladi.

function f2() {
  'use strict'; // qat'iy rejim
  return this;
}

f2() === undefined; // true

Eslatma: Ikkinchi misolda this undefined qiymatga ega bo'ldi, chunki f2 obyektning metodi yoki property'si sifatida emas, aksincha to'g'ridan to'g'ri chaqirildi(Masalan: window.f2()). Brauzerlar ilk bor qat'y rejimni ishlata boshlaganda yuqoridagi xususiyatni amalga oshira olmagan. Natijada ular xato tarzda window obyektga qaytgan.

Funktsiyani chaqirayotganda this'ga qiymat berish uchun pastda ko'rsatiladigan misollardagi kabi call() yoki apply() dan foydalaning:

Class konteksti:

Classlar ham qaysidir ma'noda funksiya bo'lganligi sababli this'ning class va funksiyalar bilan ishlashi bir-biriga o'xshash. Lekin ayrim farqli jihatlarga ega ularni quyida ko'rib chiqamiz:

Class konstruktorida this ham oddiy obyektdir. Classdagi barcha statik bo'lmagan metodlar thisning prototipga qo'shib ketadi:

class Example {
  constructor() {
    const proto = Object.getPrototypeOf(this);
    console.log(Object.getOwnPropertyNames(proto));
  }
  first(){}
  second(){}
  static third(){}
}

new Example(); // ['constructor', 'first', 'second']

Eslatma: Statik metodlar this'ning prototipi emas. Ular classning prototipi.

....Davomi bor