JavaScript

JavaScript — web sahifalarga interaktivlik qo‘shish uchun ishlatiladigan dasturlash tili. U brauzerda ishlaydi va foydalanuvchi harakatlariga javob berish, sahifani dinamik o‘zgartirish, API’dan ma’lumot olish hamda web ilovalar yaratishda qo‘llanadi.

HTML sahifa tuzilmasini, CSS sahifa ko‘rinishini belgilasa, JavaScript sahifadagi harakat va mantiqiy jarayonlarni boshqaradi.

Vazifasi

JavaScript web sahifani statik holatdan interaktiv holatga olib keladi.

JavaScript orqali quyidagilar bajariladi:

• tugma bosilishini qayta ishlash;
• forma ma’lumotlarini tekshirish;
• sahifa elementlarini o‘zgartirish;
• API’dan ma’lumot olish;
• sahifani qayta yuklamasdan yangilash;
• modal, dropdown va slider yaratish;
• real-time xabarlar ko‘rsatish;
• animatsiyalarni boshqarish;
• foydalanuvchi holatini saqlash;
• frontend ilova logikasini yuritish.

Masalan, foydalanuvchi qidiruv maydoniga matn yozganda, JavaScript shu matn asosida natijalarni ko‘rsatishi mumkin.

JavaScript qanday ishlaydi?

JavaScript brauzer ichidagi JavaScript engine orqali bajariladi. Brauzer HTML va CSS bilan birga JavaScript kodini ham o‘qiydi va sahifaga interaktivlik qo‘shadi.

Oddiy jarayon:

• brauzer HTML sahifani yuklaydi;
• CSS sahifaga ko‘rinish beradi;
• JavaScript fayl yuklanadi;
• kod brauzerda bajariladi;
• foydalanuvchi harakati kuzatiladi;
• kerakli elementlar o‘zgartiriladi;
• API so‘rovlari yuborilishi mumkin.

JavaScript client tomonda ishlashi mumkin, lekin Node.js orqali server tomonida ham ishlatiladi.

Variable

Variable — ma’lumotni vaqtincha saqlash uchun ishlatiladigan nomlangan joy. JavaScript’da variable yaratish uchun let, const va eski kodlarda var ishlatiladi.

Misol:

let name = "Ali";

const age = 25;

Variable quyidagi ma’lumotlarni saqlashi mumkin:

• matn;
• son;
• boolean;
• array;
• object;
• function;
• API javobi;
• sahifa holati.

let qiymati o‘zgaradigan variable uchun, const esa qayta tayinlanmaydigan qiymatlar uchun ishlatiladi.

Data type

JavaScript’da ma’lumotlar turli turlarga ega bo‘ladi.

Asosiy data typelar:

• String — matn;
• Number — son;
• Boolean — true yoki false;
• Null — bo‘sh qiymat;
• Undefined — qiymat hali belgilanmagan;
• Object — murakkab ma’lumot tuzilmasi;
• Array — ro‘yxat;
• Symbol — noyob identifikator;
• BigInt — juda katta sonlar uchun.

Misol:

let title = "Frontend";

let views = 150;

let active = true;

Function

Function — ma’lum bir vazifani bajaradigan kod bloki. Function kodni qayta ishlatish va tartibli yozish uchun ishlatiladi.

Misol:

function sayHello() { return "Salom"; }

Function quyidagi holatlarda ishlatiladi:

• hisob-kitob bajarish;
• matnni formatlash;
• button bosilganda amal bajarish;
• API so‘rov yuborish;
• ma’lumotni tekshirish;
• qayta ishlatiladigan logika yaratish.

JavaScript’da oddiy function, arrow function va anonim function turlari uchraydi.

Object

Object — kalit va qiymat juftliklaridan tashkil topgan ma’lumot tuzilmasi.

Misol:

const user = { name: "Ali", age: 25, role: "admin" };

Object quyidagi ma’lumotlarni ifodalashda ishlatiladi:

• foydalanuvchi profili;
• mahsulot ma’lumoti;
• sozlamalar;
• API javobi;
• forma qiymatlari;
• component holati.

Object ichidagi qiymatlarga kalit orqali murojaat qilinadi:

user.name

Array

Array — bir nechta qiymatni ro‘yxat ko‘rinishida saqlaydigan tuzilma.

Misol:

const languages = ["HTML", "CSS", "JavaScript"];

Array quyidagi holatlarda ishlatiladi:

• mahsulotlar ro‘yxati;
• foydalanuvchilar ro‘yxati;
• maqolalar;
• kategoriyalar;
• xabarlar;
• tanlangan elementlar;
• API’dan kelgan massiv ma’lumotlar.

Array bilan ishlashda map, filter, find, reduce, forEach kabi metodlar ko‘p qo‘llanadi.

DOM

DOM — HTML sahifaning brauzer ichidagi obyekt ko‘rinishi. DOM inglizcha Document Object Model so‘zlarining qisqartmasi.

JavaScript DOM orqali HTML elementlar bilan ishlaydi.

DOM yordamida quyidagilar bajariladi:

• element topish;
• matnni o‘zgartirish;
• class qo‘shish yoki olib tashlash;
• yangi element yaratish;
• elementni o‘chirish;
• input qiymatini olish;
• hodisalarni kuzatish.

Masalan, JavaScript tugma bosilganda sahifadagi matnni o‘zgartirishi mumkin.

Event

Event — foydalanuvchi yoki brauzer tomonidan yuz beradigan hodisa. JavaScript eventlarni kuzatib, ularga javob qaytarishi mumkin.

Keng ishlatiladigan eventlar:

• click — bosish;
• submit — forma yuborish;
• input — input qiymati o‘zgarishi;
• change — qiymat o‘zgarishi;
• keydown — klaviatura bosilishi;
• scroll — sahifa aylantirilishi;
• load — sahifa yuklanishi;
• mouseover — sichqoncha element ustiga kelishi.

Masalan, foydalanuvchi “Yuborish” tugmasini bosganda JavaScript forma ma’lumotlarini tekshirishi mumkin.

Conditional statement

Conditional statement — shartga qarab turli kod bajarish imkonini beradi.

JavaScript’da shartlar uchun quyidagilar ishlatiladi:

• if;
• else;
• else if;
• switch;
• ternary operator.

Misol:

if (age >= 18) { console.log("Ruxsat bor"); }

Shartlar login holati, foydalanuvchi roli, forma to‘g‘riligi yoki API javobini tekshirishda ishlatiladi.

Loop

Loop — bir xil kodni bir necha marta bajarish uchun ishlatiladi.

JavaScript’da loop turlari:

• for;
• while;
• do while;
• for...of;
• for...in.

Loop quyidagi holatlarda ishlatiladi:

• ro‘yxatdagi elementlarni chiqarish;
• array bilan ishlash;
• jadval qatorlarini yaratish;
• API’dan kelgan ma’lumotni aylanish;
• hisob-kitoblarni takrorlash.

Masalan, mahsulotlar ro‘yxatini sahifaga chiqarishda loop ishlatilishi mumkin.

Asynchronous JavaScript

JavaScript’da ayrim jarayonlar vaqt talab qiladi. Masalan, API’dan ma’lumot olish, fayl yuklash yoki serverdan javob kutish. Bunday jarayonlar asynchronous tarzda bajariladi.

Asynchronous JavaScript quyidagilar bilan bog‘liq:

• callback;
• promise;
• async/await;
• fetch;
• timer;
• API request;
• event loop.

Masalan, frontend serverdan mahsulotlar ro‘yxatini olayotganda sahifa butunlay to‘xtab qolmaydi.

Promise

Promise — kelajakda bajariladigan asynchronous amal natijasini ifodalovchi obyekt.

Promise uch holatda bo‘lishi mumkin:

• pending — jarayon davom etmoqda;
• fulfilled — jarayon muvaffaqiyatli yakunlandi;
• rejected — jarayonda xatolik yuz berdi.

Promise API so‘rovlari, fayl yuklash, vaqt talab qiladigan hisob-kitoblar va boshqa asynchronous jarayonlarda ishlatiladi.

Async/Await

Async/Await — asynchronous kodni o‘qilishi osonroq shaklda yozish usuli.

Misol:

async function getUsers() { const response = await fetch("/api/users"); }

Bu yerda async function asynchronous ekanini bildiradi, await esa natija kelishini kutadi.

Async/await ko‘pincha API bilan ishlashda qo‘llanadi.

Fetch API

Fetch API — JavaScript’da HTTP so‘rov yuborish uchun ishlatiladigan brauzer API’si.

Fetch orqali quyidagilar bajariladi:

• serverdan ma’lumot olish;
• forma ma’lumotlarini yuborish;
• JSON response qabul qilish;
• REST API bilan ishlash;
• xatoliklarni qayta ishlash.

Misol:

fetch("/api/products")

Bu kod /api/products endpointiga so‘rov yuboradi.

JSON bilan ishlash

JavaScript JSON bilan tabiiy ishlaydi. API’dan kelgan JSON ma’lumotlar JavaScript object yoki array ko‘rinishida ishlatilishi mumkin.

JSON bilan ishlash metodlari:

• JSON.parse() — JSON matnni JavaScript obyektga aylantiradi;
• JSON.stringify() — JavaScript obyektni JSON matnga aylantiradi.

Masalan, backenddan kelgan foydalanuvchi ma’lumoti frontendda object sifatida ishlatiladi.

Module

Module — JavaScript kodini alohida fayllarga ajratish usuli. Module orqali kod tartibli va qayta ishlatiladigan bo‘ladi.

Module bilan ishlashda quyidagilar ishlatiladi:

• export;
• import;
• default export;
• named export.

Masalan, API bilan ishlovchi funksiyalar alohida faylda saqlanib, boshqa componentlarda import qilinishi mumkin.

Browser API

JavaScript brauzer taqdim etadigan API’lar orqali turli imkoniyatlardan foydalanadi.

Keng ishlatiladigan browser API’lar:

• DOM API;
• Fetch API;
• LocalStorage;
• SessionStorage;
• Geolocation API;
• WebSocket API;
• Notification API;
• Clipboard API;
• History API.

Bu API’lar orqali JavaScript brauzer ichidagi turli funksiyalar bilan ishlaydi.

LocalStorage

LocalStorage — brauzerda ma’lumotni lokal saqlash uchun ishlatiladigan mexanizm. Undagi ma’lumot sahifa yopilgandan keyin ham saqlanib qolishi mumkin.

LocalStorage’da quyidagilar saqlanishi mumkin:

• theme sozlamasi;
• til tanlovi;
• oddiy local holat;
• foydalanuvchi preferensiyalari;
• vaqtinchalik client ma’lumotlari.

Maxfiy token yoki sezgir ma’lumotlarni saqlashda LocalStorage xavfsizlik nuqtai nazaridan ehtiyotkorlik talab qiladi.

Node.js

Node.js — JavaScript’ni brauzerdan tashqarida, server tomonida ishlatish imkonini beradigan runtime muhit.

Node.js orqali quyidagilar yaratiladi:

• backend API;
• CLI dasturlar;
• real-time serverlar;
• build toollar;
• automation scriptlar;
• WebSocket serverlar;
• microservice tizimlar.

Express.js, NestJS, Fastify kabi backend frameworklar Node.js ustida ishlaydi.

JavaScript frameworklari

JavaScript ekotizimida frontend va backend uchun ko‘plab framework va kutubxonalar mavjud.

Mashhur frontend vositalar:

• React;
• Vue;
• Angular;
• Svelte;
• Next.js;
• Nuxt.

Backend tomonda ishlatiladigan vositalar:

• Node.js;
• Express.js;
• NestJS;
• Fastify;
• Koa.

Bu frameworklar katta loyihalarda kodni tartibli yozish va ilova tuzilmasini boshqarishga yordam beradi.

Frontenddagi o‘rni

JavaScript frontend dasturlashning asosiy texnologiyalaridan biridir. U HTML va CSS bilan birga brauzerda ishlaydigan web interfeyslarni yaratadi.

Frontend’da JavaScript quyidagi joylarda ishlatiladi:

• component logikasi;
• API integration;
• routing;
• state management;
• form validation;
• modal va dropdown;
• real-time update;
• animation control;
• user interaction;
• SPA ilovalar.

Zamonaviy frontend frameworklar JavaScript yoki TypeScript asosida ishlaydi.

Backenddagi o‘rni

JavaScript Node.js orqali backend tomonida ham ishlatiladi. Bu bitta til yordamida frontend va backend yozish imkonini beradi.

Backend’da JavaScript quyidagi vazifalarda qo‘llanadi:

• REST API yaratish;
• database bilan ishlash;
• authentication;
• file upload;
• WebSocket server;
• background task;
• third-party API integratsiya;
• server-side rendering;
• middleware yozish.

Masalan, Express.js yordamida Node.js serverda API endpointlar yaratish mumkin.

Bog‘liq tushunchalar

HTML, CSS, Frontend, TypeScript, React, Vue, Node.js, API, JSON, DOM, Browser, Backend