Brauzer muhiti, xususiyatlari

JavaScript tili dastlab veb-brauzerlar uchun yaratilgan. O’shandan beri u rivojlanib, ko’plab foydalanish va platformalarga ega tilga aylandi.

Platforma JavaScript-ni ishga tushira olsa, brauzer yoki veb-server yoki boshqa host, hatto “aqlli” qahva mashinasi bo’lishi mumkin. Ularning har biri platformaga xos funksiyalarni taqdim etadi. JavaScript spetsifikatsiyasi buni host muhiti deb ataydi.

Xost muhiti til yadrosiga qo’shimcha ravishda o’z ob’ektlari va funktsiyalarini ta’minlaydi. Veb-brauzerlar veb-sahifalarni boshqarish vositalarini beradi. Node.js server tomonidagi xususiyatlarni taqdim etadi va hokazo.

JavaScript veb-brauzerda ishlayotganida bizda nima borligini qushning nazari bilan ko’rib chiqamiz:

Oyna deb nomlangan “ildiz” ob’ekti mavjud. Uning ikkita roli bor:

1. Birinchidan, bu Global objekt bobida tasvirlanganidek, JavaScript kodi uchun global obyektdir.
2. Ikkinchidan, u “brauzer oynasi” ni ifodalaydi va uni boshqarish usullarini taqdim etadi.

Masalan, biz uni global ob’ekt sifatida ishlatamiz:

function sayHi() {
  alert("Hello");
}

// global funktsiyalar global ob'ektning usullari:
window.sayHi();

Va bu erda biz uni brauzer oynasi sifatida ishlatamiz, oyna balandligini ko’rish uchun:

alert(window.innerHeight); // oynaning ichki balandligi

Ko’proq oynaga xos usullar va xususiyatlar mavjud, biz ularni keyinroq ko’rib chiqamiz.

DOM (Document Object Model)

Hujjat ob’ekt modeli yoki qisqacha DOM barcha sahifa mazmunini o’zgartirish mumkin bo’lgan ob’ektlar sifatida ifodalaydi.

Hujjat ob’ekti sahifaning asosiy “kirish nuqtasi” hisoblanadi. Uning yordamida biz sahifadagi biror narsani o’zgartirishimiz yoki yaratishimiz mumkin.

Masalan:

// fon rangini qizil rangga o'zgartiring
document.body.style.background = "red";

// 1 soniyadan keyin uni qayta o'zgartiring
setTimeout(() => (document.body.style.background = ""), 1000);

Bu erda biz document.body.style dan foydalandik, lekin yana ko’p narsalar bor. Xususiyatlar va usullar spetsifikatsiyada tasvirlangan: DOM Living Standard.

BOM (Browser Object Model)

Brauzer ob’ekt modeli (BOM) hujjatdan tashqari hamma narsa bilan ishlash uchun brauzer (xost muhiti) tomonidan taqdim etilgan qo’shimcha ob’ektlarni ifodalaydi.

Masalan:

• navigator obyekti brauzer va operatsion tizim haqida fon maʼlumotlarini taqdim etadi. Ko’pgina xususiyatlar mavjud, lekin eng ko’p ma’lum bo’lgan ikkitasi: navigator.userAgent – joriy brauzer haqida va navigator.platform – platforma haqida (Windows/Linux/Mac va boshqalar o’rtasidagi farqni aniqlashga yordam beradi).
• location obyekti bizga joriy URL manzilini o‘qish imkonini beradi va brauzerni yangisiga yo‘naltirishi mumkin.

location obyektidan shunday foydalanishimiz mumkin:

alert(location.href); // hozirgi urlni ko'rsatadi
if (confirm("Go to Wikipedia?")) {
  location.href = "https://wikipedia.org"; // boshqa url ga yo'naltiradi
}

alert/confirm/prompt funksiyalari ham BOMning bir qismidir: ular hujjat bilan bevosita bog’liq emas, lekin foydalanuvchi bilan muloqot qilishning sof brauzer usullarini ifodalaydi.

Xulosa

Standartlar haqida gapiradigan bo’lsak, bizda:

DOM spetsifikatsiyasi

Hujjat tuzilishi, manipulyatsiyalar va hodisalarni tavsiflaydi, qarang: https://dom.spec.whatwg.org.

CSSOM spetsifikatsiyasi

Uslublar jadvallari va uslublar qoidalarini, ular bilan manipulyatsiyalarni va ularni hujjatlarga bog’lashni tavsiflaydi, qarang: https://www.w3.org/TR/cssom-1/.

HTML spetsifikatsiyasi

HTML tilini (masalan, teglar) va shuningdek, BOMni (brauzer ob’ekt modeli) tavsiflaydi – turli xil brauzer funktsiyalari: setTimeout, alert, location va boshqalar, qarang: https://html.spec.whatwg.org. U DOM spetsifikatsiyasini oladi va uni ko’plab qo’shimcha xususiyatlar va usullar bilan kengaytiradi.

Bundan tashqari, ba’zi sinflar https://spec.whatwg.org/ da alohida tasvirlangan.

Iltimos, ushbu havolalarga e’tibor bering, chunki o’rganish uchun juda ko’p narsa bor, hamma narsani qamrab olish va eslab qolish mumkin emas.

Xususiyat yoki usul haqida oʻqishni istasangiz, https://developer.mozilla.org/en-US/search sahifasidagi Mozilla qoʻllanmasi ham yaxshi manba boʻlib xizmat qiladi, ammo mos keladigan xususiyat yaxshiroq boʻlishi mumkin: u murakkabroq va oʻqish uchun uzoqroq, lekin asosiy bilimlaringizni mustahkam va toʻliq qiladi.

Biror narsani topish uchun “WHATWG [term]” yoki “MDN [term]” kabi internet qidiruvidan foydalanish qulay, masalan, https://google.com?q=whatwg+localstorage, https://google.com?q=mdn+localstorage.

Endi biz DOMni o’rganishga kirishamiz, chunki hujjat UIda markaziy rol o’ynaydi.