Sintaksisi Oddiy namunalar
JavaScriptda oʻzgaruvchilarni var,[5] let[6] yoki const[7] kalitsoʻzlari orqali qoʻying.
var x; // declares the variable x and assigns to it the special value „undefined“ (not to be confused with an undefined value)
var y = 2; // declares the variable y and assigns to it the value 2
var z = "Hello, World!"; // declares the variable z and assigns to it a string containing „Hello, World!“
console.log(„Hello World!“);
function factorial(n) {
if (n === 0)
return 1; // 0! = 1
return n * factorial(n - 1);
}
factorial(3); // returns 6
function counter() {
let count = 0;
return function() {
return ++count;
};
}
let closure = counter();
closure(); // returns 1
closure(); // returns 2
closure(); // returns 3
Veb-dasturchi — boshlovchi dasturchilar uchun eng oson va shu bois eng ommalashgan yo‘nalish hisoblanadi. Ishlash uchun istalgan matn muharriri va brauzer yetarli bo‘ladi, chuqurlashgan darajada algaritmni o‘rganish shart emas. Dasturni yozishning har bir bosqichi natijasi ko‘rinib turadi. Umuman olganda, ustunligi anchagina. Veb-dasturchi bo‘lishning muhim jihati, bu JavaScript’ ni o‘zlashtirish hisoblanadi.
O‘QING: Java dasturlash tilini o‘rganish uchun 10 ta sabab
Hozirda JavaScript juda jadal rivojlanayapti, shu bois tilini o‘rganishda adashib ketish hech gap emas. E’tiboringizga qulay tuzilmadagi o‘quv rejasini taklif etamiz, unda JavaScript va shunga o‘xshash texnologiyaning eng zarur jihatlari qamrab olingan.
Nima uchun JavaScript?
Tilining ochiqligi e’tiborga loyiq. Odatda bir-biri bilan raqobatlashayotgan kompaniyalar ham JavaScript’ni rivojlantirish uchun hamkorlik qiladi. Tili juda moslashuvchan va ob’yektli-mo‘ljalli tarafdorlari uchun ham, funksional yondoshuvchilar uchun ham to‘g‘ri kelaveradi. Katta miqdordagi kutubxona va freymvorklari turli darajadagi vazifalarni hal eta oladi, Node.js server platformasi esa tilni nafaqat brauzerda, balki konsolda ham ishlatish imkonini beradi. Siz hatto stol ustida yoki mobil ilovalarini ham yozishingiz mumkin: birinchisini Electron freymvork yordamida, ikkinchisiniesa, NativeScript yoki React Native yordamida.
Asoslar
Dastavval JavaScript, veb-dasturchilar va dasturlashning asosiy tushunchasini o‘rganish lozim:
ob’yektli-mo‘ljalli JS — konstruktorlar va fabrikalar, meros;
funksional JS — oliy tartibdagi funksiya, tutashish, rekursiya;
Jasmine testining o‘ziga xos tomonlari;
HTML, CSS vajQuery asoslari.
O‘QING: Java dasturlash tilini o‘rganish uchun 10 ta sabab
Git
Git — dvsturchilarga kerakli asbob. Siz o‘zlashtiringiz zarur bo‘lgan asosiy bilimlar:
Katalogda fayllarni yaratish va almashtirish;
Git’da initsializatsiyalash va kommitlar;
GitHub’da repozitorlarni sozlash.
Algoritmlar va ma’lumotlar tuzilishi
Keyin algoritmlarni o‘rganish kerak bo‘ladi (jumladan, algoritmlar murakkabligi tushunchasini), shuningdek ma’lumotlarning asosiy tuzulishlarini: aloqa ro‘yxati, novbatlar, steklar, qidiruvning qo‘sh daraxti va xesh-jadval.
Bekend
Node.js
10 yilcha avval JavaScript’ni faqat frontend-ishlanmalar uchun foydalansa bo‘lardi. Endi Node.js tufayli bitta «front» bilan ish cheklanmaydi. Node — bu server tomonga JS-kodni bajarish uchun muhit hisoblanadi, shu bois, sizga yangi sintaksisni o‘rganish shart emas, ammo fayllarni import va eksport qilish, kodni modulga urish va npm menejer paketidan foydalanish kerak bo‘ladi
Serverlar, HTTP, Express.js
Node ni o‘rganganingizdan keyin bekend-ishlanma bilan tanishishni davom ettirishingiz mumkin hamda serverni qo‘rib chiqib, marshrutlashni amalga oshirishingiz lozim. HTTPga urg‘u bergan holda portlar va protokollar bilan boshlash mumkin, so‘ngra esa, savollarni qayta ishlash uchun Express — Node-biblioteka bilan shug‘ullansangiz bo‘ladi.
Asinxron JavaScript
Asinxronlik JavaScript’ning ajralib turadigan fichlaridan biri sanaladi, garchi, dasturchilar o‘rtasida qandaydir bo‘linishni keltirib chiqarsa-da, ayrimlar uni yaxshi ko‘radi, boshqalari esa yomon. Sizga ushbu texnologiyaning yaxshi va yomon tomonlarini tushinib olishingiz kerak bo‘ladi. Chaqiruv steki, voqealar sikli va kollbeklardan boshlang va keyin promislarni o‘rganishga o‘ting.
Ma’lumotlar bazasi, sxemalar, modellar va ORM
Ma’lumotlar bazasi — veb-dasturlashning eng muhim elementlaridan biri sanaladi. Agar sizning ilovangizga sahifalarni yangilash chog‘ida yo‘qolmagan qandaydir ma’lumotni yuklash yoki saqlash kerak bo‘lsa, u holda BD’dan foydalanishingizga to‘g‘ri keladi. Ma’lumotlarning relyasion va nerelyasion bazasini farqlashni va aloqaning turlarini tushunib olishingiz kerak. Shundan keyin SQL’ni o‘rganishingiz va ma’lumotlar bazasini boshqarishning turli tizimlari bilan tanishib chiqishingiz kerak bo‘ladi. ORM bilan ishlay olish ham ortiqchalik qilmaydi.
Frontend
HTML va CSS
HTML va CSS — bu har bir veb-dasturchi uchun eng muhim asoslardan hisoblanadi. Sizga uni mukammal darajada bilishingiz talab etilmaydi, ammo tushunishingiz dozim bo‘ladi. Shuningdek, biror-bir taniqli kutubxonani (masalan, Bootstrap’ni) va Sass‘ga o‘xshash CSS-preprotsessor (u CSS’ni oddiy kodga aylantirishga yordam beradi)ni o‘rganishingiz zarur bo‘ladi. HTML ishini osonlashtirish uchun ommalashgan shablonizatorlardan birini tanlashingiz mumkin, masalan, pug’ni.
O‘QING: Terabayt.uz tavsiya etadi: dasturlashni o‘rganing va porloq kelajak sari qadam tashlang!
jQuery va DOM manipulyasiyasi
HTML va CSS yordamida sahifaning tashqi ko‘rinishini yaratib, voqealar translyatoridan hamda DOM’ ni boshqarish uchun jQuery kutubxonasidan foydalanasiz. Ko‘pchillik jQuery foydasiz, deb o‘ylaydi va tez orada uni Angular va React bilan almashtiradi, biroq u juda ommalashgan shu bois uni bilib qo‘yish zarur bo‘ladi. Bundan tashqari, shunday vaziyatga tushib qolasizki, React-mikroskop bilan ishlash noqulay bo‘lib qoladi, o‘shanda sizga yengilgina jQuery yordamga keladi.
Chrome dasturchilarining ish qurollari
Chrome ish qurollarini e’tibordan chetda qoldirish kerak emas, chunki u sizga ulkan imkoniyatlar beradi. Uning yordamida siz DOM elementlarini o‘rganasiz, konsol orqali otladka qilasiz, yo‘nalishlarni kuzatasiz va boshqa imkoniyatlardan foydalanasiz. Maqolada Chrome konsolining bir nechta qulay imkoniyatlari yozilgan. Ular qiyin vazifani oson hal qilishingizni ta’minlaydi.
AJAX
Agar siz ma’lumotlar bazasi bilan har bir operatsiyadan so‘ng ilovalar sahifasini qayta yuklamasligini istasangiz, u holda sizga aynan, AJAX kerak. U fonli asinxron HTTP-so‘rovni jo‘natadi, javoblar faqat tasvirning bir qismini yangilaydi. AJAX bilan jQuery orqali ishlasa bo‘ladi.
Ilg‘or mavzular
Test orqali ishlab chiqish
Test-driven development yoki qisqacha TDD — bu shunday dasturlash texnikasiki, uning yordamida PO ni yaratish chog‘ida ko‘plab unchalik katta bo‘lmagan sikllarga bo‘linib ketadi: dastavval testlar yoziladi, u ma’qul bo‘lgan o‘zgarishlarni yopadi, keyin ushbu testni o‘tkazadigan kod yoziladi. Shundan keyin kod refaktoring qilinadi, zarur bo‘lganda yangi testlar yoziladi. Agar qaysidir testda kod hududi o‘tmasa, u tuzatiladi.
JavaScript bilan ishlaganingizda Jasmine, Chai va Mocha freymvorklariga e’tibor qaratishingizni maslahat beramiz.
Veb-soketlar
Ushbu mavzuga alohida e’tibor qaratishingizni so‘raymiz, chunki veb-soketlar juda foydalidir. WebSocket protokoli HTTP’dan farqli ularoq, ma’lumotlarning qo‘shyo‘nalishi bilan ham ishlay oladi va mazkur texnologiyaning afzalligini ta’minlaydi. Eng keng tarqalgan tatbiq, bu socket.io kutubxonasidir.
ES6, Babel, Webpack
Hozirda asosiy standart ES6 (ES2015) sanaladi, Endi esa ES2016 qabul qilingan, ES2017 esa, endi ishlab chiqilmoqda, shu bois yangilanishni har doim kuzatib borish va ulardan foydalanish bir juft asbob bilan hal bo‘ladi:
Babel — ES6-kodni (tez orada ES2016 ham paydo bo‘ladi) ES5’ga kompilirlashtiradi, unga hamma brauzerlarni qo‘llash mumkin. U hatto JSX/React-komponentlarni ham kompilirlashtiradi, u veb-dvsturchilar uchun eng kerakli vositadir;
Webpack — sizning barcha kiruvchi fayllaringizni bir joyga to‘playdi kartinkalar, shriftlar, stil jadvallari, JS-fayli va boshqalar). U kichik ilovalar yaratish uchun foyda bermaydiReact bilan ishlash chog‘ida uning yordamini hech narsa bilan alishtirib bo‘lmaydi.
React i Redux
React — foydalanish interfeyslarni yaratish uchun kutubxona. U Facebook kompaniyasi tomonidan 2013 yilda yaratilgan va qisqa vaqtda dasturchilar orasida ommalashib ketdi. React nafaqat frontend-ishlanmalar uchun kerak: Facebook (React Native) va VR-ishlanmalar (React VR) uchun freymvork variantlarini schiqardi.
Redux — holat konteyneri, u odatda React bilan qo‘shilgan holda foydalaniladi. Modulligi tufayli kodni qisqartirish uchun ham foydalansa bo‘ladi. Ayniqsa, real vaqtda ishlayotgan (masalan o‘yin choqida)da ko‘pfoydalaniladigan ilovalarda.
Autentifikatsiya, sessii, cookies
Siz yana ilovalarning foydalanuvchi bilan o‘zaro harakatini, kirishni hisob yozuvida qayta ishlashni ham tushinib olishingiz kerak. Foydalanuvchining shaxsini sessiya davomida kuzatib borish uchun cookies’dan foydalaniladi, u HTTP-so‘rovga javob beruvchi server brauzerga uzatadigan unchalik katta bo‘lmagan test fayllaridir. Ma’lumotlar bazasi avtorizatsiyalash sahifasini bir-biriga bog‘lash uchun express-session kutubxonasidan foydalansa bo‘ladi.
Veb-xavfsizlik
Xavfsizlikka ham e’tiborni qaratish lozim bo‘ladi. Buning uchun hujum usullarini ham, ulardan himoyalanish usullarini ham o‘rganib olishingiz kerak. O‘zingizning bilim darajangizni baholay olasiz va haqiqatan ham sizga JavaScript to‘g‘ri keladimi, buning uchun maxsus testdan o‘tishingiz kerak bo‘ladi.
Do'stlaringiz bilan baham: |