Veb-resursga tashrif buyurish - bu brauzerning manzil satridagi maxsus URI. Mehmon sahifaning manzilini belgilaydi va u brauzer tomonidan DOM daraxti - Hujjat ob'ekti modeli elementlariga bo'linadi. Ushbu sahifadagi har qanday havola brauzerga boshqa sahifani ajratib ko'rsatishi va boshqa ob'ektlar daraxtini yaratishi kerakligini aytadi.
Brauzer tashrif buyuruvchiga hozirgi sessiyada allaqachon ko'rib chiqilgan sahifalar zanjiri orqali orqaga qaytish yoki oldinga o'tishga imkon beradi.
Aslida, foydalanuvchi harakatlari sahifalarga tashrif buyurish jarayonida hosil bo'lgan ob'ektlar tizimlari o'rtasida harakatlanmoqda. Har bir sahifa o'zining shaxsiy DOM daraxti va qo'shimcha ravishda JavaScript ob'ekti - bu tilning o'zi sintaksisining ob'ektlari va maxsus tavsiflar.
DOM: yuklash, yangilash va o'zgartirish
DOM darajasida ham, o'zgaruvchilar yaratish uchun konstruktsiyalarni bajargan JavaScript tilida ham va ishlab chiquvchi tomonidan berilgan tavsiflarga asoslanib veb-resurs sahifasining ob'ektlarini tashkil etuvchi uchta asosiy variant mavjud:
- yuklash - mehmon sayt sahifasiga keldi;
- yangilash - tashrif buyuruvchi (brauzer tugmasi yoki Ctrl-F5);
- sahifa elementini o'zgartirish, masalan (AJAX, skript, voqea, ...).
Uchala jarayon ham bir-biridan tubdan farq qiladi, ammo birinchi ikkitasining xususiyatlarini ajratib olish ayniqsa muhimdir. Tashrif buyuruvchini sahifani yangilashiga to'sqinlik qilish qiyin - bu ishlab chiquvchi yodda tutishi kerak bo'lgan mehmonlarga qaramlik.
Sahifa atrofida va undan tashqarida harakatlanish faqat brauzer tashriflari tarixi va uning tugmachalari funktsiyalarida emas, balki faqat sahifaning o'zida bo'lishi kerak. Ko'pgina saytlar ushbu muhim talabni e'lon qilishadi, ammo mehmonlar an'anaviy ravishda uni buzishadi.
Sahifani qayta yuklamasdan uning alohida elementi darajasida o'zgartirish (masalan, AJAX) dinamik sahifalar uchun keng tarqalgan echimdir. Qoida tariqasida, bu sahifa elementlari bo'ylab harakat qilish, ob'ektlarini o'zgartirish, tashrif buyuruvchilar bilan muloqotni boshqarish uchun ishlatiladi.
JavaScript-ning asosiy ob'ektlari
JavaScript ob'ektlarga asoslangan. Deyarli barcha til o'zgaruvchilari ob'ektlardir. Ishlab chiquvchi sintaksisning turli xil variantlaridan foydalangan holda o'zining ob'ekt tavsiflarini tuzishi mumkin.
"String", "number", true, false, null yoki undefined bo'lmagan narsalar ob'ektdir. Tilning sintaksis doirasida buni e'tiborga olmaslik mumkin, ob'ektlar tomonidan faqat DOM elementlari va JavaScript Ob'ektning o'z tavsiflari tushuniladi .. Tilning asosiy tuzilishi ko'p hollarda ishlab chiquvchi uchun muhim amaliy ahamiyatga ega emas.
Masalan, matematik funktsiyalar Math ob'ekti bilan ifodalanadi. Bu til kontseptsiyasi doirasida qulay, ammo ishlab chiquvchi uchun bu matematik operatsiyalarning zarur arsenalidan foydalanish uchun qulay sintaksis.
DOM bilan to'g'ri ishlash va o'zingizning ob'ektlaringizni to'g'ri tavsiflash muhimdir. JavaScript ob'ekti funktsiyalari sintaksisi va ularni qo'llash uchun iboralar zarur algoritm mantig'ini yozish shaklidir.
Iplar, massivlar va ob'ektlar
Barcha JavaScript moslamalari qoidaga asoslanadi: "property" \u003d "value" va assotsiativ massiv tushunchasi. Oddiy holatda, ob'ekt JavaScript-ni xususiyatlar to'plami \u003d qiymat juftlari. Bunday holda, "qiymat" har doim ham raqam bo'lmasligi mumkin va xususiyat har doim ham tirnoqsiz yozilmaydi.
Mulk nomini ortiqcha ishlatmang. Mulk nomlari faqat lotin belgilaridan iborat bo'lsa, o'zgaruvchilarni nomlash talablarini qondirsa va tilning muhim (shu jumladan zahiralangan) so'zlari bo'lmasa, bu juda yaxshi.
Hech qanday mulk buyurtmasi kutilmaydi, lekin assotsiativ massivni yaratishda yoki uni ishga tushirishda uning elementlari qanday joylashtirilganligini bilish juda maqbuldir. Ushbu holatdan foydalanish tavsiya etilmaydi, ammo yodda tutish mumkin.
Bir qator xususiyatlarni ishga tushirish bir vaqtning o'zida quyidagilarni anglatadi:
- massiv yaratish;
- ob'ektni yaratish.
Maxsus dastur kontekstida siz JavaScript-ni ob'ektini assotsiativ massiv sifatida ko'rib chiqishingiz mumkin, va algoritmning boshqa joylarini ob'ekt sifatida ko'rib chiqishingiz, unga kerakli usullarni tayinlashingiz, uning elementlari qiymatlarini o'zgartirishingiz mumkin.
Yaratilganda yoki o'zgartirilganda mulk nomlari va ularning qiymatlari mag'lubiyat shaklida ko'rsatilishi kerakligi sababli, kichik yozuvlar va tirnoqlardan foydalanishni tavsiya etamiz.
Ob'ekt xususiyatlariga kirish
Object.keys konstruktsiyasi yordamida ob'ekt xususiyatlarining qiymatlarini olish va o'zgartirish mumkin: JavaScript barcha ob'ekt xususiyatlaridan iborat qatorni tashkil qiladi. Ob'ektlar dinamik ravishda yaratilganda, bu qurilish juda qulaydir, chunki u avtomatik ravishda ob'ektda mavjud bo'lgan barcha xususiyatlar ro'yxatini yaratadi.
Ushbu misolda ikkita massivning tavsifi boshqacha. Amalda ikkala massiv ham tengdir, chunki ular bir xil nomdagi xususiyatlarni va ularning qiymatlarini o'z ichiga oladi. Loop ikkinchi massivning barcha xususiyatlarini takrorlaydi va barcha qiymatlarning qatorini hosil qiladi.
Shunga o'xshash effektga nuqta yoki qavs belgisi bilan erishish mumkin:
- x1_Obj .NameLast;
- x1_Obj ["NameFirst"].
Ikkala konstruktsiya ham haqiqiy va kerakli natijani beradi. Berilgan misolda "()" jingalak qavslar orqali massivni belgilashda, ro'yxat oxirida "," belgisi ko'rinishida xatolikka yo'l qo'yilishi mumkin (misolda qizil doira bilan belgilangan). Brauzerlar odatda ro'yxatdagi qo'shimcha belgini e'tiborsiz qoldiradilar, ammo buni qilmaslik yaxshiroqdir.
Ob'ekt xususiyatlarini olib tashlash
Ob'ekt assotsiativ massiv bo'lgani uchun operatsiya JavaScript-ni o'chirish ob'ekti joriy ob'ekt darajasida bajariladi (meros bilan - bu muhim) va ushbu ob'ektning xususiyatlari to'plamida ko'rib chiqiladi.
Ushbu misol kontekstida siz quyidagi konstruktsiyalardan foydalanishingiz mumkin:
- x1_Obj ni o'chirish .NameLast;
- x2_Obj-ni o'chirish ["NameFirst"];
Birinchi qurilish birinchi ob'ektning ikkinchi elementini olib tashlaydi, ikkinchi qurilish ikkinchi ob'ektning birinchi elementini olib tashlaydi. O'chirish operatori prototip xususiyatlarida ishlamaydi va agar xususiyatni o'chirib bo'lmaydigan bo'lsa, false qiymatini qaytaradi.
Ob'ekt xususiyatlari va usullari
JavaScript ob'ekti va funktsiyalari (usullari) sintaksisi tilning sintaksis va semantikasining umumiy qonunlariga o'xshaydi. Aslida, buning aksi.
Ob'ektning xususiyatlari va usullari - bu ob'ektga yo'naltirilgan JavaScript paradigmasi orqali u bilan ruxsat etilgan ma'lumotlarni va harakatlarni tavsiflashning bir variantidir.
Ushbu misol x3_Obj ob'ektini tavsiflaydi, u faqat ikkita xususiyatga ega: item va pos. Keyin funktsiya sifatida hello () usuli qo'shildi. Natijada, JavaScript ob'ekti qiymatlari ushbu tavsifni natija oynasida ko'rsatilgandek xususiyat qiymatlari kontekstida talqin qiladi, ya'ni funktsiya tanasini (1) qiymat sifatida joylashtiradi.
Hello () xususiyati to'g'ridan-to'g'ri chaqirilganda, u usul (funktsiya) sifatida talqin qilinadi va natija (2) ushbu usul kodining bajarilishi bo'ladi.
Ob'ektdagi ushbu kalit so'z
Ob'ektning mulkiy maydonida yo'nalish uchun ishlab chiquvchi foydalanishi mumkin kalit so'z bu orqali va ularning qiymatlarini olish yoki o'zgartirish uchun tavsiflangan xususiyatlarga murojaat qiling.
Bu faqat konstruktor tanasi bo'lgan ob'ektni tasvirlashning boshlanishi. Ushbu misol cookie-fayllar ob'ektini tavsiflaydi. Ob'ekt qurilish bilan yuklangan paytda ishga tushiriladi:
- var oCookie \u003d yangi scCookies (cOwnerCode);
- oCookie .Init ();
Ushbu misolda cOwnerCode - noyob kod Mehmon. Agar yo'q bo'lsa, u holda oCookie ob'ekti konstruktorida yangi kod hosil bo'ladi. Ushbu ob'ektni ishlab chiquvchisi tashrif buyuruvchiga ruxsat berish orqali nimani anglatishi muhim emas, bu erda ushbu kalit so'z ob'ektning usullarini tavsiflash va ularni ob'ektning boshqa usullaridan chaqirish uchun qanday ishlatilishi muhim:
- this .GetCookie \u003d function (cName) (...);
- bu .SetCookie \u003d funktsiyasi (cName, cValue) (...).
Cookie-faylni uning nomi bilan o'qish va ma'lum bir ism bilan cookie-faylning qiymatini yozish uchun ob'ektning usullari shu tarzda tavsiflanadi.
- bu .GetCookie ("cOwner");
- bu .SetCookie ("cOwner", cOwner);
Shunday qilib, ular ishlatiladi, agar birinchi qurilish natijasida qiymat ko'rsatilmasa, ikkinchi qurilish uni o'rnatadi.
Cookie-fayllar namunasi
Ob'ektni va brauzer muhitida ishlaydigan tilga ob'ektga yo'naltirilgan yondashuv paradigmasini muhokama qilish mumkin, bu qiziq, ammo haqiqat nazariya emas, balki amaliyotdir. kuchli nuqta JavaScript.
Ob'ektga yo'naltirilgan amaliyotda yana bir narsa muhim ahamiyatga ega. Deyarli barcha veb-resurslarda cookie-fayllar bilan ishlash tartibda. Buni ob'ekt formatida amalga oshirish ajoyib g'oya. Shu nuqtai nazardan, ob'ektni ishga tushirish sahifa ochilgan paytda sodir bo'ladi: sahifa yuklangan \u003d cookie-fayl ob'ekti mavjud va u hamma narsani o'qib chiqdi va yaratilmagan narsalar.
Sahifa bilan ishlash jarayonida tashrif buyuruvchi muayyan harakatlarni amalga oshiradi va brauzer cookie-fayllarni o'zgartirishi yoki yaratishi kerak. Buni amalga oshiradigan ikkita ob'ekt usuli (yuqorida ko'rsatilgan) mavjud.
Aslida, cookie-fayl ob'ekti brauzer DOMni yaratgandan so'ng va JavaScript ob'ekt tizimiga yangi funksiyalar qo'shilgandan so'ng darhol paydo bo'ladi: cookie-faylni o'qing va yarating (o'zgartiring).
Bu haqida oddiy misol faqat o'ziga xos xususiyat va funktsiyalarga (usullarga) ega bo'lgan haqiqiy ob'ektlarni yaratish tartibi sifatida qaraladi. Har bir ob'ekt o'z ishini bajaradi va umumiy algoritmda qatnashmaydi, boshqa ob'ektlarning ma'lumotlarini yoki umumiy nomlar maydonini o'zgartirmaydi.
Ushbu yondashuv bilan ishlab chiquvchi echilayotgan muammoni tavsiflash va saqlash uchun etarli bo'lgan noyob ob'ektlar tizimini yaratilishini ta'minlaydi.
Sahifa va ob'ekt hodisalari
DOM va JavaScript-ning ishlashining muhim elementi: ob'ekt hodisasi - bu voqea to'g'risida uning ishlov beruvchisida ma'lumot olish imkonini beradi. Deyarli har bir sahifa elementiga bir yoki bir nechta voqea uchun o'z ishlovchisi tayinlanishi mumkin.
Aslida, JavaScript-ni ishlab chiquvchi bitta katta "parcha" kodini yaratmaydi, balki funktsiyalar, ob'ektlar, ma'lumotlar tuzilmalarining ko'p tavsiflarini beradi va voqea ishlovchilarini ma'lum sahifa elementlariga tayinlaydi.
Ob'ekt hodisasi - bu ishlov beruvchiga sabab bo'lgan voqea haqida ma'lumot va ushbu ishlov beruvchining ushbu hodisaga etarli darajada javob berish qobiliyati. Har bir hodisa nafaqat nomi va sodir bo'lgan joyi, balki boshqa ko'plab parametrlari bilan ham farq qiladi.
Xususan, klaviatura hodisalari - bu parametrlarning bir to'plami, sichqoncha hodisalari - bu ma'lumotlarning mutlaqo boshqa diapazoni va AJAX orqali serverning javobini ishlab chiquvchining o'zi to'liq rejalashtirgan.
Har bir aniq holatda, sahifada yuz berishi mumkin bo'lgan voqealar tasviri bir qator ishlov beruvchilarga aylantiriladi; ma'lum bir voqealar to'plamini qayta ishlash uchun taqdim etilgan variantlardan tashqari, sahifa hech qanday harakat qilmaydi.
Ob'ektlarni yaratish va ishlashi
Brauzer tashrif buyuruvchi tomonidan belgilangan veb-resurs manzili bo'lgan URI-ni DOM daraxtiga - ushbu veb-resursning sahifa ob'ektlari tizimiga "o'zgartiradi". Mehmon sahifadagi havolalar bo'ylab harakatlanayotganda, brauzer boshqa sahifalarning tegishli daraxtlariga o'tadi.
Ushbu holat ishlab chiquvchiga tashrif buyuruvchining xatti-harakatlariga etarlicha javob beradigan veb-resursning asosi sifatida o'z ob'ektlari tizimini yaratishga imkon beradi. Agar umumiy funktsiyani ajratib ko'rsatadigan bo'lsak, masalan:
- kukilar bilan ishlash;
- ma'lumotlarni qabul qilish / uzatish (AJAX);
- ochiladigan maslahatlar;
- ichki xabarlar (sayt suhbati);
- boshqa vazifalar;
keyin, yaratilganidan so'ng, ob'ekt tizimlari boshqa saytlarni rivojlantirish uchun ishlatilishi mumkin. Bu ob'ektning yondashuvining odatdagi JavaScript-ni ishlatishdan sezilarli ustunligi, chunki sahifaning ishlashi va hodisalarga reaktsiyasini ta'minlovchi brauzer tili.
Ob'ektlar - bu to'liq shakllanadigan qismlar alohida fayllar va kelajakda foydalanish. Ushbu yondashuvning o'ziga xos xususiyati - yangilangan, takomillashtirilgan ob'ektni avvalgi ishlanmada ishlatganda, saytni o'zgartirmasdan o'z funksiyasini avtomatik ravishda yangilab turganda, qayta aloqa qilish imkoniyati.
Vazifa :
1. Uchta ob'ekt mavjud (uchta mashina): birinchi_Avtomobil, ikkinchi_Avtomobil va uchinchi_Avtomobil.
2. Ob'ektlarning har biri (mashinalar) xususiyatlar to'plamiga va ularga mos keladigan qiymatlarga ega (transport vositasining xususiyatlari).
3. Ob'ektlardan birini ko'rib chiqing:
var
birinchi_Mashina \u003d (
ishlab chiqarish: "VAZ",/ * ishlab chiqaruvchi * /
model: 2106, / * model * /
yil: 1980 yil/ * chiqarilgan yili * /
rang: "bej",/ * Rang * /
yo'lovchilar: 5,/ * yo'lovchilar soni * /
konvertatsiya qilinadigan: yolg'on,/ * konvertatsiya qilinadigan yuqori * /
yurgan masofasi: 80000/ * yurgan masofasi * /
}
Xususiyatlari qilish va rang qator qiymatlariga ega bo'lish;
Xususiyatlari model, yil, yo'lovchilar va yurish masofasi - raqamli qiymatlar;
Mulk konvertatsiya qilinadigan mantiqiy qiymatni oladi.
Siz quyidagilarni qilishingiz kerak:
Avtomobilni ikkita parametr bo'yicha tekshiradigan funktsiyani yozing (ishlab chiqarilgan yili va yurgan yili) va mantiqiy qiymatni qaytaradi to'g'ri yoki yolg'on.
Tafsilotlar:
1. Funktsiya bitta parametrga ega mashina, u 3 ta ob'ektdan birini oladi. Masalan, yuqorida muhokama qilingan mashina birinchi_Avtomobil.
2. Funksiya har qanday o'xshash ob'ekt bilan ishlashi kerak.
Ob'ektni tekshirish uchun funktsiya - haqiqiy yoki noto'g'ri
Qarorga sharhlar:
- Shunday qilib, bizda uchta ob'ekt mavjud (uchta mashina), ularning har biri funktsiya yordamida tahlil qilinishi mumkin yaxshi_Avtomobil.
- Funktsiya yaxshi_Avtomobilbitta parametrga ega mashina, har qanday ob'ekt bo'lishi mumkin (mashinalar): birinchi_Avtomobil, ikkinchi_Avtomobil yoki uchinchi_Avtomobil: good_Car (mashina) funktsiyasi .
- Tana funktsiyalari yaxshi_Avtomobilshart tuzildi, unga ko'ra:
Agar mulk qiymati bo'lsa yil ob'ekt mashina 2000 yildan kam (boshqacha aytganda: agar avtomobil ishlab chiqarilgan yili 2000 yildan kam bo'lsa), keyin funktsiya qaytadi yolg'on;
Aks holda, agar mulk qiymati bo'lsa yurish masofasi ob'ekt mashina 50 000 dan ortiq (agar avtomobilning yurgan masofasi 50 000 dan ortiq bo'lsa), keyin funktsiya qaytadi yolg'on;
Aks holda, funktsiya qaytadi to'g'ri.
- Keyin biz funktsiyani chaqiramiz va ob'ektni parametr sifatida ko'rsatamiz uchinchi_Avtomobil(uchinchi mashina)sinovdan muvaffaqiyatli o'tgan. Funktsiya natijasi o'zgaruvchida saqlanadi natija:
var result \u003d good_Car (uchinchi_Car); . - O'zgaruvchan natija ekranda ko'rsatiladi;
- Boshqa ikkita ob'ekt (mashina) shartlarga javob bermaydi.
Kodingizni optimallashtirish
Davom etamiz javascriptdagi ob'ektlar bilan ishlash.
Shunday qilib, ob'ektlarni tekshirishda yuqoridagi funktsiya (mashinalar) natijada beradi to'g'ri yoki yolg'on (To'g'ri yoki noto'g'ri).
Ko'rib chiqilayotgan muammoning echimini, ya'ni o'rniga his qilish sifatini biroz yaxshilashingiz mumkin to'g'ri yoki yolg'on har qanday matnni ko'rsatish. Buning uchun natijani tahlil qilish uchun sharoit yaratamiz.
Natija shartli echimi - Natija ...
Natijani tahlil qilish sharti quyidagicha tuzilgan.
- Ifoda agar (natija) bu stenografiya shaklidir
agar (natija \u003d\u003d rost) . - Agar funktsiya natijasi bo'lsa yaxshi_Avtomobil
haqiqat to'g'ri, keyin biz quyidagi iborani namoyish etamiz: "Sizda yaxshi mashinangiz bor: 2012
ishlab chiqarilgan yili, yurgan masofasi bilan 15000
km. ", qaerda
2012 va 15000 - bu mulk qiymatlari yil va yurish masofasi ob'ekt uchinchi_Avtomobil.
- Agar natijani tekshirish sharti noto'g'ri qiymatni qaytarsa yolg'on, keyin biz ko'ramiz: "Biz sizning mashinangiz haqida gapirmaymiz ....". Ya'ni, ko'rib chiqilayotgan ob'ekt (mashina) tekshirib bo'lmadi.
Kodni optimallashtirish - Oldinga borish - funktsiyani qo'shish
Ammo bu hammasi emas. Funktsiyani chaqirish va natijani tahlil qilish uchun kod parchasini diqqat bilan ko'rib chiqing:
/ * Funktsiyani chaqiring va natijani tahlil qiling * /
var result \u003d good_Car (
uchinchi_Avtomobil
);
agar (natija) (
document.write ("Sizda yaxshi mashina bor:" + third_Car .yil + "ishlab chiqarilgan yili, yurish masofasi bilan" + third_Car .mileage + "km.");
}
boshqa (
document.write ("Keling, mashinangiz haqida gapirmaylik ....");
}
Bu erda ob'ekt uchinchi_Avtomobil (uchinchi mashina) uch marta ko'rsatiladi:
- Funktsiyani birinchi marta chaqirish yaxshi_Avtomobil uning parametri sifatida ko'rsatilgan: good_Car (uchinchi_Car) .
- Va keyin uning xususiyatlarini ko'rsatish uchun unga murojaat qilganimizda yana ikki marta paydo bo'ladi: uchinchi_Avtomobil yil va third_Car.mileage .
Menga bu yoqmadi, chunki boshqa ob'ektni tahlil qilayotganda (mashina) bizda uning ismi ham bo'ladi uch marta ko'rsating!!!
Tahlil qilinayotgan ob'ektning bir martalik ko'rsatkichiga erishish uchun sizga funktsiya natijasi ham kerak yaxshi_Avtomobil va ushbu natijani tahlil qilish (ya'ni butun) boshqa funktsiyaga qo'shish.
Yana bitta funktsiyadan foydalangan holda echim - Natija ...
Sizda yaxshi mashina bor: 2012 yil, 15000 km yurish masofasi bilan.
Oxirgi yangilanish: 08.04.2018
Ob'ektga yo'naltirilgan dasturlash bugungi kunda dasturlarni ishlab chiqishda ustun paradigmalardan biri bo'lib, JavaScript-da biz OOP-dan to'liq foydalanishimiz mumkin. Shu bilan birga, ob'ektga yo'naltirilgan dasturlash JavaScript-ga nisbatan ba'zi o'ziga xos xususiyatlarga ega.
Ob'ektlar
Oldingi mavzularda biz ibtidoiy ma'lumotlar - raqamlar, satrlar bilan ishladik, ammo ma'lumotlar har doim ham ibtidoiy turlarni anglatmaydi. Masalan, agar bizning dasturimizda biz ismimiz, yoshimiz, jinsimiz va boshqalarga ega bo'lgan odamning mohiyatini tavsiflashimiz kerak bo'lsa, demak, tabiiyki, biz inson mohiyatini raqam yoki ip sifatida ifodalay olmaymiz. Shaxsni to'g'ri tasvirlash uchun bizga bir nechta satr yoki raqam kerak. Shu munosabat bilan, inson alohida murakkabliklarga ega bo'lgan murakkab murakkab tuzilish vazifasini bajaradi - yoshi, bo'yi, ismi, familiyasi va boshqalar.
JavaScript-da bunday tuzilmalar bilan ishlash uchun ob'ektlardan foydalaniladi. Har bir ob'ekt o'z holatini tavsiflovchi xususiyatlarni va uning xatti-harakatlarini tavsiflovchi usullarni saqlashi mumkin.
Yangi ob'ekt yaratish
Yangi ob'ektni yaratishning bir necha yo'li mavjud.
Birinchi usul - bu ob'ekt konstruktoridan foydalanish:
Var user \u003d new Object ();
Bunday holda, ob'ekt foydalanuvchi deb nomlanadi. U var so'zi yordamida har qanday odatiy o'zgaruvchiga o'xshab aniqlanadi.
Yangi Object () ifodasi konstruktorga qo'ng'iroqni, yangi ob'ektni yaratadigan funktsiyani anglatadi. Yangi operator konstruktorni chaqirish uchun ishlatiladi. Konstruktorni chaqirish aslida oddiy funktsiyani chaqirishga o'xshaydi.
Ob'ektni yaratishning ikkinchi usuli bu jingalak qavslardan foydalanish:
Var user \u003d ();
Bugungi kunda ikkinchi usul keng tarqalgan.
Ob'ekt xususiyatlari
Ob'ektni yaratgandan so'ng, undagi xususiyatlarni aniqlashimiz mumkin. Xususiyatni aniqlash uchun siz ob'ekt nomidan keyin nuqta bilan ajratilgan xususiyat nomini ko'rsatishingiz va unga qiymat berishingiz kerak:
Var user \u003d (); user.name \u003d "Tom"; user.age \u003d 26;
Bunday holda, ikkita xususiyat, ism va yosh e'lon qilinadi va ularga tegishli qiymatlar beriladi. Shundan so'ng biz ushbu xususiyatlardan foydalanishimiz mumkin, masalan, ularning qiymatlarini konsolda ko'rsatish:
Console.log (user.name); console.log (user.age);
Ob'ektni belgilashda siz xususiyatlarni belgilashingiz mumkin:
Var user \u003d (ismi: "Tom", yoshi: 26);
Bunday holda, xususiyatga qiymat berish uchun ikki nuqta, xususiyat ta'rifidan keyin vergul (nuqta-vergul o'rniga) ishlatiladi.
Bundan tashqari, xususiyatlarni aniqlashning stsenariy usuli mavjud:
Var nomi \u003d "Tom"; var age \u003d 34; var user \u003d (ism, yosh); console.log (user.name); // Tom console.log (user.age); // 34
Bu holda, o'zgaruvchilarning nomlari, shuningdek, ob'ektning xususiyatlari nomlari. Va shu bilan siz yanada murakkab tuzilmalarni yaratishingiz mumkin:
Var nomi \u003d "Tom"; var age \u003d 34; var user \u003d (ism, yosh); var teacher \u003d (foydalanuvchi, kurs: "JavaScript"); console.log (teacher.user); // (ism: "Tom", yoshi: 34) console.log (teacher.course); // JavaScript
Ob'ekt usullari
Ob'ekt usullari uning xatti-harakatlarini yoki bajaradigan harakatlarini belgilaydi. Usullar funktsiyalardir. Masalan, odamning ismini va yoshini ko'rsatadigan usulni aniqlaylik:
Var user \u003d (); user.name \u003d "Tom"; user.age \u003d 26; user.display \u003d function () (console.log (user.name); console.log (user.age);); // user.display () usulini chaqiring;
Funktsiyalarda bo'lgani kabi, avval usullar aniqlanadi va keyin chaqiriladi.
Ob'ektni aniqlashda usullar to'g'ridan-to'g'ri aniqlanishi mumkin:
Var user \u003d (nomi: "Tom", yoshi: 26, displey: function () (console.log (this.name); console.log (this.age);));
Xususiyatlarda bo'lgani kabi, uslubga ham yo'g'on nuqta belgisi yordamida funktsiya moslamasi beriladi.
Ob'ekt tarkibidagi ob'ektning xususiyatlariga yoki usullariga murojaat qilish uchun ushbu kalit so'zdan foydalaning. Bu joriy ob'ektga havolani anglatadi.
Siz yo'g'on ichak va so'z funktsiyasi chiqarib tashlanadigan usullarni aniqlashning stenografik usulidan foydalanishingiz mumkin:
Var user \u003d (ismi: "Tom", yoshi: 26, display () (console.log (this.name, this.age);), move (place) (console.log (this.name, "ketadi") , joy);)); user.display (); // Tom 26 user.move ("do'kon"); // Tom do'konga boradi
Array sintaksis
Shuningdek, qator sintaksisidan foydalanib xususiyatlar va usullarni aniqlashning muqobil usuli mavjud:
Var user \u003d (); user ["name"] \u003d "Tom"; foydalanuvchi ["yosh"] \u003d 26; user ["display"] \u003d function () (console.log (user.name); console.log (user.age);); // usul foydalanuvchisini chaqirish ["display"] ();
Har bir xususiyat yoki usul nomi tirnoq ichiga va to'rtburchak qavs ichiga olinadi va keyin unga qiymat ham beriladi. Masalan, foydalanuvchi ["age"] \u003d 26.
Ushbu xususiyatlar va usullarga murojaat qilishda siz nuqta yozuvidan (user.name) foydalanishingiz mumkin, yoki bunga murojaat qilishingiz mumkin: user ["name"]
Iplar xususiyatlari va usullari sifatida
Shuni ham ta'kidlash kerakki, ob'ektning xususiyatlari va usullari nomlari doimo satrlardir. Ya'ni, ob'ektning avvalgi ta'rifini quyidagicha qayta yozishimiz mumkin edi:
Var user \u003d ("name": "Tom", "age": 26, "display": function () (console.log (user.name); console.log (user.age);)); // user.display () usulini chaqiring;
Bir tomondan, ikkita ta'rif o'rtasida farq yo'q. Boshqa tomondan, ismni qamrab olgan mag'lubiyatga yordam beradigan holatlar mavjud. Masalan, agar mulk nomi bo'shliq bilan ajratilgan ikkita so'zdan iborat bo'lsa:
Var user \u003d (ismi: "Tom", yoshi: 26, "to'liq ism": "Tom Jons", "ma'lumotni ko'rsatish": function () (console.log (user.name); console.log (user.age) ;)); console.log (foydalanuvchi ["to'liq ism"]); foydalanuvchi ["ma'lumotni ko'rsatish"] ();
Faqatgina bu holatda, bunday xususiyatlar va usullarga murojaat qilish uchun biz massivlarning sintaksisidan foydalanishimiz kerak.
Xususiyatlarni olib tashlash
Yuqorida biz qanday qilib dinamik ravishda ob'ektga yangi xususiyatlarni qo'shishingiz mumkinligini ko'rdik. Shu bilan birga, biz o'chirish operatori yordamida xususiyatlar va usullarni ham o'chirib tashlashimiz mumkin. Va xuddi qo'shish kabi, biz xususiyatlarni ikki usul bilan olib tashlashimiz mumkin. Birinchi usul - nuqta yozuvidan foydalanish:
Object.property-ni o'chirib tashlang
Yoki massivlar sintaksisidan foydalaning:
Ob'ektni o'chirish ["property"]
Masalan, xususiyatni olib tashlaymiz:
Var user \u003d (); user.name \u003d "Tom"; user.age \u003d 26; user.display \u003d function () (console.log (user.name); console.log (user.age);); console.log (user.name); // Tom user.name-ni o'chirib tashlaydi; // xususiyatni o'chirish // muqobil variant // foydalanuvchini o'chirish ["name"]; console.log (user.name); // aniqlanmagan
O'chirilgandan so'ng, xususiyat aniqlanmagan bo'ladi, shuning uchun unga kirishga harakat qilsangiz, dastur aniqlanmagan holda qaytadi.
Ushbu maqolada men JavaScript-dagi ob'ekt nima, uning imkoniyatlari, ob'ektlar o'rtasida qanday munosabatlar o'rnatilishi va bundan qanday qilib "tabiiy" meros olish usullari paydo bo'lishi, bularning barchasi ishlashga qanday ta'sir qilishi va nimalar haqida imkon qadar to'liq va izchil gapirishni istayman. hammasini bajaring :)
Maqolada an'anaviy sinf-ob'ekt paradigmasi, sintaktik shakar, o'ramlar va ramkalarni taqlid qilish haqida bir so'z aytilmaydi.
Maqolaning boshidan oxirigacha materialning murakkabligi oshib boradi, shuning uchun ijobiy tomonlari uchun birinchi qismlar zerikarli va ahamiyatsiz bo'lib tuyulishi mumkin, ammo keyinchalik bu juda ham qiziqroq bo'ladi :)
JavaScript-dagi ob'ektlar
Ko'pgina maqolalarda "JavaScript-da hamma narsa ob'ekt" iborasi mavjud. Texnik jihatdan bu butunlay to'g'ri emas, lekin yangi boshlanuvchilarda to'g'ri taassurot qoldiradi :)Darhaqiqat, tilda ko'p narsa ob'ektdir, hatto ob'ekt bo'lmagan narsa ham uning ba'zi qobiliyatlariga ega bo'lishi mumkin.
Shuni anglash kerakki, "ob'ekt" so'zi bu erda "ma'lum bir sinf ob'ekti" ma'nosida ishlatilmaydi. JavaScript-dagi ob'ekt, avvalambor, faqat xususiyatlar to'plamidir (agar kimdir uchun osonroq bo'lsa, uni assotsiativ qator yoki ro'yxat deb atashingiz mumkin), bu kalit-qiymat juftlaridan iborat. Bundan tashqari, faqat mag'lubiyat kalit bo'lishi mumkin (hatto qator elementlari uchun ham), lekin qiymat quyida keltirilgan har qanday ma'lumot turi bo'lishi mumkin.
Shunday qilib JavaScript-da 6 ta asosiy turlari ma'lumotlar Undefined (qiymatni bildirmaydi), Null, Boolean (boolean), String (string), Number (number) and Object (object).
Bundan tashqari, dastlabki 5 ta ibtidoiy ma'lumotlar turlari, ammo ob'ekt bunday emas. Bundan tashqari, biz odatiy ravishda Ob'ekt turida "kichik tiplar" mavjud deb taxmin qilishimiz mumkin: massiv (Array), funktsiya (Funksiya), doimiy ifoda (RegExp) va boshqalar.
Bu biroz soddalashtirilgan tavsif, ammo amalda bu odatda etarli.
Bundan tashqari, ibtidoiy qatorlar, son va mantiqiy turlar, ma'lum darajada, moslamaning ibtidoiy bo'lmagan "kichik turlari" bilan bog'liq: satr, raqam va mantiqiy ravishda.
Bu shuni anglatadiki, masalan, "Salom, dunyo" qatori ham ibtidoiy qiymat, ham String ob'ekti sifatida yaratilishi mumkin.
Qisqacha aytganda, bu dasturchi ibtidoiy qadriyatlar bilan ishlashda usul va xususiyatlardan xuddi ob'ektlar kabi foydalanishi uchun amalga oshiriladi. Bu haqda ko'proq ma'lumotni ushbu maqolaning tegishli qismida o'qishingiz mumkin.
Malumot bo'yicha ishlash
Havola - bu turli xil nomlar bilan ob'ektga kirish vositasi. Har qanday ob'ektlar bilan ishlash faqat ma'lumotnoma orqali amalga oshiriladi.Buni misol bilan namoyish qilaylik:
test \u003d function () (ogohlantirish ("Salom!")) // Funktsiya yarating (ogohlantirish ("Salom!")) (Va funktsiya, esimizda bo'lganidek, to'liq ob'ekt) va test o'zgaruvchisini unga havola qiling.
test_link \u003d test; // test_link endi bizning funktsiyamizga ham tegishli
test (); // Salom!
test_link (); // Salom!
Ko'rib turganimizdek, birinchi havola ham, ikkinchisi ham bir xil natijani beradi.
Bizda test deb nomlangan funktsiya yo'qligini va sinov o'zgaruvchisi qandaydir "asosiy" yoki "asosiy" havola emasligini va "test_link" ning kichik ekanligini anglab etishimiz kerak.
Bizning vazifamiz, boshqa har qanday ob'ekt singari, faqat xotiradagi maydon bo'lib, ushbu sohaga oid barcha havolalar mutlaqo tengdir. Bundan tashqari, ob'ekt hech qanday ma'lumotnomaga ega bo'lmasligi mumkin - bu holda u anonim deb nomlanadi va faqat yaratilgandan so'ng darhol foydalanish mumkin (masalan, funktsiyaga o'tgan), aks holda unga kirish imkonsiz bo'ladi va tez orada u axlat yig'uvchi tomonidan yo'q qilinadi. (axlat yig'ish), bu moslamalarni mos yozuvlarsiz o'chirib tashlaydi.
Keling, buni tushunish nima uchun juda muhimligini ko'rib chiqaylik:
test \u003d (prop: "qachondir") // Prop xususiyati bilan ob'ekt yarating
test_link \u003d test; // Ushbu ob'ektga yana bir havola yaratingOgohlantirish (test.prop); // qachondir
// Ob'ektning xususiyatini o'zgartirish
test_link.prop \u003d "yangi matn";Ogohlantirish (test.prop); // yangi matn
ogohlantirish (test_link.prop); // yangi matn
/ * Aytish mumkinki, mulk bu erda va u erda o'zgargan - ammo unday emas.
Ob'ekt bitta. Shunday qilib, mulk bir marta o'zgardi va havolalar faqat qaerga ishora qilsa bo'ladi. * /// Yangi xususiyat qo'shing va eskisini olib tashlang
test.new_prop \u003d "salom";
test.prop-ni o'chirish;Ogohlantirish (test_link.prop); // undefined - bu xususiyat endi mavjud emas
ogohlantirish (test_link.new_prop);// Havolani olib tashlang
testni o'chirish;
ogohlantirish (test.new_prop);
/ * Bu vaqtda skript xatoga yo'l qo'yadi, chunki test endi mavjud emas va test.new_prop umuman mavjud emas * /
ogohlantirish (test_link.new_prop); // Salom
/ * lekin bu erda hamma narsa tartibda, chunki biz ob'ektning o'zi emas, balki unga havolani o'chirib tashladik. Endi bizning ob'ektimiz bitta test_link * / havolasi orqali ko'rsatiladi// Yangi ob'ekt yarating
test \u003d test_link; // Birinchidan, yana sinov havolasini yarating
test_link \u003d (prop: "biron vaqt") // Va bu yangi ob'ektOgohlantirish (test_link.prop); // qachondir
ogohlantirish (test.prop); // aniqlanmagan
/ * Yangi ob'ektni yaratish havolani uzadi va endi test va test_link turli ob'ektlarga yo'naltiradi.
Aslida, bu test_linkini o'chirish va uni qayta yaratish bilan bir xil, ammo boshqa ob'ektga ishora qilish * /
ogohlantirish (test.new_prop); // salom - endi test bizning birinchi ob'ektimizga havolani o'z ichiga oladi
* Ushbu manba kodi ta'kidlash manbai bilan ta'kidlangan.
Ob'ektlarning bunday xatti-harakatlari ko'pincha yangi boshlanuvchilar uchun juda ko'p savollarni tug'diradi, shuning uchun bu matn aniqlik kiritadi deb umid qilaman. Agar biz bog'lanishni emas, balki ob'ektning haqiqatan ham yangi, mustaqil nusxasini yaratmoqchi bo'lsak, unda buning yagona usuli bu yangi ob'ekt yaratish va u erda kerakli xususiyatlarni nusxalashdir.
Shuni ham ta'kidlash joizki, moslamalar bilan ishlash, yuqorida aytib o'tilgan kulgili effektlardan tashqari, xotirani sezilarli darajada tejashga imkon beradi, bu bitta ob'ekt dasturning turli joylarida keng qo'llanilganda muhimdir.
Ibtidoiy qadriyatlar
Yuqorida aytib o'tganimdek, String va Number ma'lumotlar turlari ham ob'ektlar, ham ibtidoiy qiymatlar bo'lishi mumkin.obj \u003d yangi String ("salom"); // Ob'ekt sifatida satr yarating
oddiy \u003d "salom"; // Ibtidoiy qiymat yaratingOgohlantirish (obj); // Salom
ogohlantirish (oddiy); // salom - hozircha hamma narsani taxmin qilish mumkinOgohlantirish (uzunlik); // 6 - String turidagi ob'ektda uzunlik xususiyati bor, u mag'lubiyat uzunligini saqlaydi
ogohlantirish (oddiy uzunlik); // 6
/ * Oddiy narsa emasligiga qaramay, biz String ob'ekti kabi bir xil xususiyatlar to'plamiga kirishimiz mumkin. Bu juda qulay * /Obj.prop \u003d "matn";
simple.prop \u003d "matn";Ogohlantirish (obj.prop); // matn - obj oddiy ob'ekt bo'lgani uchun, biz unga yana bitta xususiyatni osonlikcha berishimiz mumkin
ogohlantirish (simple.prop); // noaniq - lekin oddiy narsa ob'ekt emas va bu raqam biz uchun ishlamaydi* Ushbu manba kodi ta'kidlash manbai bilan ta'kidlangan.
Xuddi shu narsa son va mantiq turlari uchun ham amal qiladi (faqat ular uzunlik xususiyatiga ega emas, lekin boshqa bir qator ajoyib xususiyatlar mavjud).
Iplar va raqamlarni ob'ekt sifatida ishlatish amaliy maqsadga muvofiq emas. ibtidoiy qadriyatlar bilan ishlash qulayroq, lekin shu bilan birga barcha kerakli funktsiyalarni saqlab qoladi. Biroq, rasmni to'ldirish uchun ushbu mexanizmni tushunish kerak.
Ibtidoiy qadriyatlarni literallardan foydalanish bilan aralashtirib yubormang - masalan, "test \u003d new Array ()" yoki "test \u003d" shaklida qator yaratganligimizdan qat'i nazar, natija baribir bir xil ob'ekt bo'lib qoladi. Biz hech qanday ibtidoiy qadriyatlarga ega bo'lmaymiz.
Ob'ektlarni yaratish va ulardan foydalanish
Shunday qilib, class-object paradigmasi amalga oshiriladigan tillardan farqli o'laroq, biz avval sinf yaratishimiz shart emas, keyin sinf ob'ektini yaratamiz. Biz darhol ob'ektni yaratishimiz mumkin, uni quyidagi misolda qilamiz:test \u003d (
simple_property: "Salom",
object_property: (
user_1: "Petya",
user_2: "Vasya"
},
function_property: function (foydalanuvchi) {
ogohlantirish (bu .simple_property + "," + this .object_property);
}
}Test.function_property ("user_1"); // Salom, Petya.
* Ushbu manba kodi ta'kidlash manbai bilan ta'kidlangan.
Bizning oldimizda 3 ta xususiyatga ega bo'lgan sinov ob'ekti turibdi, ularning nomlari o'zlari uchun gapiradi deb umid qilaman. Bu erda bizni ko'proq qiziqtirgan narsa funktsiyani o'z ichiga olgan function_property xususiyati. Bunday funktsiyani ob'ekt usuli deb atash mumkin.
Bizning funktsiyamiz ushbu kalit so'zni ikki marta ishlatadi, bu funktsiya chaqirilgan ob'ektga ko'rsatgich (ya'ni mos yozuvlar). Shunday qilib, this.simple_property \u003d test.simple_property \u003d "Salom", va this.object_property \u003d test.object_property \u003d "Petya".
Shuni aniq anglash kerakki, bu har doim u tegishli bo'lgan ob'ektga emas, balki funktsiya chaqirilgan ob'ektga tegishli. Ushbu misolda u bir xil ob'ekt bo'lsa-da, bu har doim ham shunday emas.
test.function_property ("user_1"); // Salom, Petya.Test2 \u003d yangi ob'ekt (); // test2 \u003d () ga o'xshash yangi ob'ektni yaratishning yana bir shakli.
Test.function_property.call (test2, "user_1"); //Xato
/ * Qo'ng'iroq qilish usuli boshqa ob'ekt nomidan funktsiyani chaqirishga imkon beradi. Bunday holda biz test ob'ekti function_property usulini chaqiramiz va bu endi sinov ob'ektiga emas, balki test2 ob'ektiga ishora qiladi. Va beri unda object_property xususiyati yo'q, keyin this.object_property-ni olishga harakat qilsangiz, skript xatoga yo'l qo'yadi * /// vaziyatni tuzatishga harakat qiling
test2.simple_property \u003d "Xayrli kun";
test2.object_property \u003d test.object_property; // Bunday holda, biz kodni takrorlamaslik uchun ob'ektni mos yozuvlar yordamida ishlatamizTest.function_property.call (test2, "user_1"); // Xayrli kun, Petya.
* Ushbu manba kodi ta'kidlash manbai bilan ta'kidlangan.
Ob'ektni yaratish va undan foydalanish uchun aniq qadamlar yo'qligi misoldan ham aniq bo'lishi kerak. Ob'ektni istalgan vaqtda istalgan vaqtda o'zgartirish mumkin - foydalanishdan oldin, keyin va hattoki. Bu "an'anaviy" OOPdan muhim farq.
Konstruktor
Yuqoridagi misolda biz ba'zi o'xshashliklarga ega bo'lgan 2 ta ob'ektni yaratdik. Simple_property va object_property xususiyatlari ham mavjud edi. Shubhasiz, haqiqiy kodni yozishda ko'pincha bir xil yoki o'xshash ob'ektlarni yaratish vazifasi paydo bo'ladi. Va, albatta, har bir bunday ob'ektni qo'lda yaratishimiz shart emas.Bizga konstruktor yordamga keladi. JavaScript-dagi konstruktor sinfning bir qismi emas (chunki sinflar yo'q), faqat o'z-o'zidan funktsiya. Eng keng tarqalgan funktsiya.
make_me \u003d funktsiya (_name) {
ogohlantirish ("Men ishga tushirdim");
bu .name \u003d _name;
}
/ * Keling, bu erda nima bo'layotganini ko'rib chiqaylik. Tarjimon yangi operatorni ko'radi va uning o'ng tomonida nima borligini tekshiradi. Chunki make_me funktsiya bo'lib, uni konstruktor sifatida ishlatish mumkin, keyin xotirada yangi ob'ekt yaratiladi va make_me funktsiyasi bajariladi va bu shu yangi ob'ektga ishora qiladi. Keyinchalik, ushbu ob'ektga _name argumenti va show_name usuli bo'yicha qiymat berilgan name xususiyati qo'shiladi. Bundan tashqari (aniq qaysi daqiqada ekanligini bilmayman, lekin bu muhim emas) bola o'zgaruvchisi bizning yangi, yangi tug'ilgan ob'ektimizga ishora qila boshlaydi * /Ogohlantirish (child.name); // Vasya
child.show_name (); // Vasya
child2.show_name (); // PiterChild2.show_name \u003d function () (ogohlantirish ( "Men ismimni aytmayman");} // Ob'ektlarimizni istalgan vaqtda o'zgartirishimiz mumkinligini unutmang
child2.show_name (); // Men ismimni aytmaymanChild.show_name (); // Vasya - bolalar bir-biriga hech qanday ta'sir qilmaydi
* Ushbu manba kodi ta'kidlash manbai bilan ta'kidlangan.
Bundan tashqari, konstruktorni otasi bilan taqqoslashingiz mumkin - u bolani tug'diradi, unga ma'lum fazilatlarni beradi, lekin yaratilgandan so'ng darhol bola ota-onadan butunlay mustaqil bo'lib qoladi va birodarlaridan juda farq qilishi mumkin.
Agar maqolaning boshidagi ma'lumotlar turlarining tavsifini eslasak, u holda ob'ekt va uning kichik turlari (Funktsiya, Array va boshqalar) aslida yaratilgan ob'ektga funktsiya, massiv va hokazolarni beradigan konstruktorlar ekanligi aniq bo'ladi.
Shunday qilib, bu juda yaxshi. Endi biz ma'lum bir naqsh bo'yicha ob'ektlarni yaratish qobiliyatiga egamiz. Biroq, barchasi yaxshi emas. Birinchidan, biz yaratgan har bir ob'ekt va uning barcha xususiyatlari va usullari xotirada alohida o'rin egallaydi, garchi ko'p jihatdan ular takrorlansa ham. Ikkinchidan, agar ota-ona va bola o'rtasidagi aloqani saqlab qolishni istasak va barcha bolalar ob'ektlarini birdan o'zgartira olsak. Prototip bizga yordamga keladi.
Prototip
Har bir bolaning otasi va onasi bo'lganidek (hech bo'lmaganda biologik ma'noda), JavaScript-dagi har qanday ob'ekt ham shunday. Va agar ota, biz qaror qilganimizdek, dizayner sifatida ishlasa, demak, ona shunchaki prototipdir. Keling, bu qanday sodir bo'lishini ko'rib chiqaylik:make_me \u003d funktsiya (_name) {
ogohlantirish ("Men ishga tushirdim");
bu .name \u003d _name;
bu .show_name \u003d function () (ogohlantirish (bu .name);)
}
/*
Funksiya kalit so'zini ko'rib, tarjimon uning o'ng tomonidagi kodni va shu vaqtdan boshlab tekshiradi hammasi yaxshi - xotirada yangi ob'ekt yaratadi, bu ham bizning vazifamiz. Keyin, avtomatik ravishda (dasturchining ishtirokisiz) bu funktsiya uchun bo'sh ob'ektga ishora qiluvchi prototip xususiyati yaratiladi. Agar biz buni qo'lda qilsak, u make_me.prototype \u003d new Object ();Keyinchalik, berilgan ob'ekt (prototip xususiyati tomonidan ko'rsatilgan), shuningdek, funktsiyaga yo'naltirilgan konstruktor xususiyati bilan avtomatik ravishda qo'shiladi. Bunday tsikl aloqasi chiqadi.
Endi (konstruktor: ... funktsiyaga havola ...) deb ta'riflash mumkin bo'lgan ushbu ob'ekt - bu prototip funktsiya.
*/// Ob'ekt haqiqatan ham ob'ektdir
ogohlantirish (make_me.prototype.constructor typeof); // Funksiya - bu bizning vazifamiz
ogohlantirish (make_me.prototype.constructor \u003d\u003d\u003d make_me); // rost// make_me funktsiyasi prototipiga yangi usul qo'shing
Bola \u003d yangi make_me ("Vasya"); // ular meni ishga tushirishdi
/ * Endi, oldingi misolda tasvirlangan hamma narsadan tashqari, bola ob'ektida make_me.prototype bilan bir xil ob'ektni ko'rsatadigan qo'shimcha yashirin xususiyat [] yaratiladi. Chunki mulk yashiringan, biz uning qiymatini ko'ra olmaymiz yoki o'zgartira olmaymiz - ammo keyingi ishlarda bu muhim rol o'ynaydi * /Ogohlantirish (child.name); // Vasya
child.show_name (); // VasyaChild.set_name ("Kolya");
/ * Birinchidan, tarjimon bola ob'ektida set_name usulini izlaydi. U yo'qligi sababli, u bolani qidirishni davom ettiradi. [] Mulk, uni topadi va boshlaydi. * /
child.show_name (); // Kolya - endi Vasiyaning ismi Kolya :)Make_me.prototype.show_name2 \u003d function () (ogohlantirish ("Salom", + bu .name;) //T.k. prototip - oddiy ob'ekt, biz uni tezda ham o'zgartirishimiz mumkin
Child2 \u003d yangi make_me ("Petya");
child2.show_name2 (); // Salom, Petya
child.show_name2 (); // Salom Kolya - prototipdagi o'zgarishlar nafaqat yangi yaratilgan ob'ektlarga, balki barcha eski narsalarga ham ta'sir qiladiChild2.show_name2 \u003d function () (ogohlantirish ( "Men ismimni aytmayman");} // Ob'ektni hali ham o'zgartirishimiz mumkin, shu bilan birga ushbu ob'ektdagi yangi show_name2 usuli (va faqat unda), xuddi prototipdan eski usulni "yozib qo'yadi"
child2.show_name2 (); // Men ismimni aytmayman - chunki endi bizda show_name2 o'z uslubimiz bor, keyin u chaqiriladi va prototipda hech qanday qidiruv bo'lmaydiChild.show_name2 (); // Salom, Kolya - hammasi shu erda
Make_me.prototype \u003d (prop: "salom") // Keling, yana prototipni yaratishga harakat qilaylik
Ogohlantirish (child.prop); // aniqlanmagan
child.show_name2 (); // Salom Kolya
/ * Agar siz ma'lumotnomada ishlash nima ekanligini eslasangiz, unda hamma narsa aniq. Prototipni qayta yaratish havolani uzadi va endi bola va child2 ob'ektlarining [] xususiyati bitta ob'ektga ishora qiladi (u avval make_me funktsiyasining prototipi bo'lgan) va make_me.prototype xususiyati boshqa ob'ektga, ya'ni make_me funktsiyasining yangi prototipi * /Child3 \u003d yangi make_me ("Oleg");
ogohlantirish (child3.prop); // salom - kutilganidek
* Ushbu manba kodi ta'kidlash manbai bilan ta'kidlangan.
Misoldan ko'rinib turibdiki, otasi onasiga sodiq qolganda (ya'ni funktsiya prototipi bir xil bo'lib qolsa), barcha bolalar onaga bog'liq va undagi barcha o'zgarishlarga sezgir. Biroq, ota-onalar ajrashishi bilanoq (dizayner prototipni boshqasiga o'zgartiradi), bolalar darhol kimni qaerga tarqatishadi va ular bilan endi aloqasi yo'q.
Terminologiya haqida bir oz ma'lumot
Konstruktor va prototip o'rtasidagi asosiy aloqa buzilguncha biz quyidagi rasmni kuzatishimiz mumkin:
make_me \u003d funktsiya (_name) {
ogohlantirish ("Men ishga tushirdim");
bu .name \u003d _name;
bu .show_name \u003d function () (ogohlantirish (bu .name);)
}Make_me.prototype.set_name \u003d function (_name) (bu .name \u003d _name;)
bola \u003d yangi make_me ("Vasya");Ogohlantirish (make_me.prototype typeof); // ob'ekt - funktsiya prototip xususiyatiga ega
ogohlantirish (typeof child.prototype); // aniqlanmagan - yaratilgan ob'ekt YO'Q prototip xususiyatiga ega
ogohlantirish (child.constructor.prototype \u003d\u003d\u003d make_me.prototype); // true - lekin ob'ektda konstruktor xususiyati mavjud bo'lib, u make_me konstruktor funktsiyasiga ishora qiladi, bu esa o'z navbatida prototip xususiyatiga ega
* Ushbu manba kodi ta'kidlash manbai bilan ta'kidlangan.
Ushbu mavzu bo'yicha ko'plab forumlarni o'qib chiqqandan so'ng, odamlar funktsiyalarning prototip xususiyatlarini va shu funktsiya bilan yaratilgan ob'ektning yashirin [] xususiyatlarini chalkashtirib yuborishda yuzaga keladigan asosiy muammolarni ko'rib chiqdim.
Ushbu xususiyatlarning ikkalasi ham bir xil ob'ektga havolalardir (prototip va konstruktor o'rtasidagi asosiy bog'lanish buzilmas ekan), ammo shunga qaramay, ular har xil nomlar bilan turli xil xususiyatlarga ega, ulardan biri dasturchi uchun mavjud, ikkinchisi esa yo'q.
Har doim aniq tushunish kerakki, agar biz konstruktorning prototipi haqida gapiradigan bo'lsak, demak bu har doim prototip xususiyati va agar yaratilgan ob'ekt prototipi haqida bo'lsa, demak bu yashirin xususiyatdir [].
Meros olish
Endi bilamizki, har bir ob'ekt yashirin prototip ma'lumotnomasiga ega va har bir prototip odatdagi ob'ektdir.Hamdardroq o'quvchilar allaqachon rekursiya hidini sezishgan :)
Darhaqiqat, beri prototip - bu oddiy ob'ekt, keyin u, o'z navbatida, o'zining prototipiga havolaga ega va h.k. Prototip iyerarxiyasi shu tarzda amalga oshiriladi.
qush \u003d funktsiyasi () () // Bu qushlarning konstruktori
bird.prototype.cry \u003d function () (ogohlantirish ("Cree!");) // Qush qichqirishi mumkin
bird.prototype.fly \u003d function () (ogohlantirish ("Men uchaman!");) // va uchib ketingDuck \u003d funktsiya () ()
duck.prototype \u003d yangi qush ();
duck.prototype.cry \u003d function () (ogohlantirish ("Quack quack!");) // O'rdak boshqacha qichqiradi
duck.prototype.constructor \u003d o'rdak; // prototype.constructor xususiyatini o'rdakka o'rnatishga majburlang, chunki aks holda bu qushga tegishli bo'ladiBilli \u003d yangi o'rdak (); // Billi bizning o'rdakimiz
billy.fly (); // Men uchaman! - Billi qush bo'lgani uchun uchishi mumkin
billy.cry (); // Quack quack! - Billi qichqiradi, chunki u o'rdak
* Ushbu manba kodi ta'kidlash manbai bilan ta'kidlangan.
Shunday qilib, har qanday ichki darajadagi ierarxiyani amalga oshirishingiz mumkin.
Yulduzcha muammosi
Endi biz bularning barchasi haqida juda ko'p narsalarni bilganimiz sababli, ushbu uchta satrda nimalar sodir bo'layotganini tushunishga harakat qilaylikmake_me \u003d funktsiyasi () ()
bola \u003d yangi make_me ();
ogohlantirish (child.toString ()); // natijalar
* Ushbu manba kodi ta'kidlash manbai bilan ta'kidlangan.
Birinchi satrda biz ushbu funktsiyaga ishora qiluvchi yangi funktsiya va make_me o'zgaruvchisini yaratamiz. Bu make_me ga ishora qiluvchi konstruktor xususiyatini o'z ichiga olgan funktsiya uchun make_me.prototype prototipini yaratadi.
Ammo bu hammasi emas :)
Chunki make_me funktsiyasi ham ob'ekt bo'lib, u o'z navbatida dadasi va onasiga ega, ya'ni. konstruktor va prototip. Uning konstruktori Function () tilining asl funktsiyasidir va prototipi qo'ng'iroq qilish, qo'llash va h.k. usullarini o'z ichiga olgan ob'ektdir. - aynan shu prototip tufayli har qanday funktsiyada ushbu usullardan foydalanishimiz mumkin. Shunday qilib, make_me funktsiyasi Function.prototype-ga ishora qiluvchi [] xususiyatiga ega.
O'z navbatida, Funktsiya konstruktorining prototipi ham ob'ekt bo'lib, uning konstruktori (ajablanib!) Ob'ekt (ya'ni Function.prototype. []. Constructor \u003d\u003d\u003d Object) va prototip - bu ob'ektning standart xususiyatlari va usullarini o'z ichiga olgan ob'ekt, toString, hasOwnProperty va boshqalar (boshqacha qilib aytganda - Function.prototype. [] ["hasOwnProperty"]) - bu biz barcha olingan ob'ektlarda foydalanishimiz mumkin bo'lgan bir xil usul - va bu aynan shu ob'ektning o'ziga xos usuli va meros emas. ). Qiziqarli tarzda biz har xil ob'ektlar Ob'ektdan olinganligini aniqlaymiz.
Keyinchalik davom eta olamizmi? Bunday emas. Object.prototype ob'ektning asosiy xususiyatlarini aniq o'z prototipiga ega bo'lmaganligi sababli o'z ichiga oladi. Object.prototype. [] \u003d Null; Ushbu nuqtada prototip zanjiri orqali xususiyat yoki usulni topish uchun sayohat to'xtaydi.
Yana bitta qiziqarli fakt - Ob'ektning konstruktori - bu Funktsiya. O'sha. Ob'ekt. []. Konstruktor \u003d\u003d\u003d Vazifa.
Yana bir dumaloq ma'lumotnoma mavjud - Ob'ekt konstruktori Funktsiya va Function.prototype konstruktori Ob'ektdir.
Keling, bizning misolimizga qaytaylik. Funktsiya qanday yaratilishini biz allaqachon tushungan edik, endi ikkinchi qatorga o'tamiz. U erda biz konstruktor make_me funktsiyasi va prototip make_me.prototype bo'lgan bola ob'ektini yaratamiz.
Uchinchi qatorda biz tarjimon qanday qilib boladan bolaga zanjirga ko'tarilishini ko'rmoqdamiz. [] (Aka make_me.prototip), keyin bolaga. []. [] (Aka Object.prototype), va allaqachon topilgan bajarish uchun ishga tushirilgan toString usuli.
Nopokliklar
Prototiplar orqali meros olish JavaScript-ning yagona usuli bo'lib tuyulishi mumkin. Bu unday emas.Biz juda moslashuvchan til bilan shug'ullanamiz, bu juda ko'p qoidalarni emas, balki imkoniyatlarni beradi.
Masalan, agar xohlasak, biz prototiplardan umuman foydalana olmaymiz, lekin miksinlar tushunchasidan foydalangan holda dasturlashimiz mumkin. Buning uchun qadimgi yaxshi do'stlarimiz - konstruktorlar qo'l keladi.
// Bu inson konstruktoridir
man \u003d funktsiya () (
this .live \u003d function () (ogohlantirish ("men yashayman");) // Inson qanday yashashni biladi
this .walk \u003d function () (ogohlantirish ("Men yuraman");) // Odam yurishi mumkin
}// Bu shoirning konstruktori
shoir \u003d funktsiya () (
bu .kill \u003d function () (ogohlantirish ( "Shoir odamni o'ldirdi");} // Shoir odamni o'ldirishi mumkin
this .live \u003d function () (ogohlantirish ("Men o'ldim");) // Bu odamning o'limiga sabab bo'ladi
}Vladimir \u003d yangi odam (); // Vladimir erkak
vladimir.live (); // Men yashayman - u tirik
vladimir.walk (); // Men yuraman - u yuradiPoet.call (Vladimir); // Vladimir ob'ekti uchun shoir konstruktorini ijro eting
vladimir.kill (); // Shoir odamni o'ldirdi
vladimir.live (); //Men olganman// Endi diqqat
man.call (Vladimir);
vladimir.live (); //Men yashayapman
* Ushbu manba kodi ta'kidlash manbai bilan ta'kidlangan.
Ushbu misolda nimani ko'rmoqdamiz? Birinchidan, bu bir xil ierarxiyada bo'lmagan bir nechta ob'ektlardan meros olish qobiliyatidir. Misolda ularning ikkitasi bor, lekin siz xohlaganingizcha ko'p bo'lishi mumkin.
Ikkinchidan, bu hech qanday ierarxiyaning yo'qligi. Ustivor xususiyatlar va usullar faqat konstruktorlarning chaqirilish tartibi bilan belgilanadi.
Uchinchidan, bu ob'ektni yanada dinamik ravishda o'zgartirish qobiliyati va bu prototipni o'zgartirishda bo'lgani kabi barcha avlodlar emas, balki alohida ob'ektdir.
Yangilanish: yopilish va xususiy mulk
Ushbu juda katta maqolani shishirmaslik uchun men JavaScript-dagi "Yopishmalar" postiga havola beraman, bu erda bu haqda batafsil yozilgan.Endi bularning barchasi bilan nima qilish kerak
Yuqorida aytib o'tganimdek, individual ob'ektlarning o'zboshimchalik bilan o'zgarishi va dizaynerlarning ishlatilishi, iflosliklar va prototiplarning egiluvchanligi - bu dasturchiga har jihatdan kodni har jihatdan dahshatli va chiroyli yaratishga imkon beradigan vosita qobiliyatidir. Qanday vazifalarni, qanday vositalar bilan hal qilayotganimizni, qanday maqsadlarga erishayotganimizni va buning uchun qanday narx to'layotganimizni tushunish muhimdir.Bundan tashqari, narx masalasi juda ahamiyatsiz, ayniqsa, brauzer uchun rivojlanish haqida gapiradigan bo'lsak. Internet Explorer 6 va 7 versiyalari.
1. Xotira - hamma narsa oddiy. Barcha brauzerlarda prototiplar bo'yicha meros konstruktorlar orqali usullarni yaratishga qaraganda bir necha baravar kam xotira oladi. Bundan tashqari, biz qanchalik ko'p usul va xususiyatlarga ega bo'lsak, shunchalik katta farq. Shunga qaramay, shuni yodda tutish kerakki, agar bizda mingta bir xil narsalar mavjud bo'lsa, lekin faqat bittasi bo'lsa, unda har qanday holatda xotira iste'moli kichik bo'ladi, chunki bu erda boshqa omillarni hisobga olish kerak.
2. Protsessor vaqti - bu erda asosiy nozikliklar Microsoft brauzerlari bilan bog'liq.
Bir tomondan, uslublar va xususiyatlar konstruktor orqali yaratiladigan ob'ektlar prototipga qaraganda ko'p marta (ba'zi hollarda o'nlab yoki yuzlab) sekinroq yaratilishi mumkin. Ko'proq usullar, sekinroq. Shunday qilib, agar sizning IE skriptni ishga tushirish paytida bir necha soniya davomida muzlab qolsa - bu yo'nalishda qazish uchun sabab bor.
Boshqa tomondan, ob'ektning o'ziga xos usullari (konstruktor orqali yaratilgan) prototipga qaraganda biroz tezroq bajarilishi mumkin. Agar siz ushbu brauzerda usulning bajarilishini tezlashtirishingiz kerak bo'lsa, unda siz buni hisobga olishingiz kerak. Shuni yodda tutingki, bu bajarilish emas, balki tezlashtirilgan usul chaqiruvi (ya'ni uni ob'ektda topish). Shunday qilib, agar usulning o'zi bir soniya davomida ishlasa, unda siz ishlashning maxsus o'sishini sezmaysiz.
Boshqa brauzerlarda shunga o'xshash muammolar kuzatiladi, bu erda ob'ektlarni yaratish va ularning usullarini chaqirish vaqti ikkala yondashuv uchun ham bir xil bo'ladi.
P.S. Odatda, ushbu turdagi maqolalarda muallif prototip asosida sinf-ob'ekt merosini yoki prototip meros uchun sintaktik shakarni amalga oshirishga harakat qilib, qandaydir o'ralashni taklif qiladi. Men buni ataylab qilmayman, chunki O'ylaymanki, ushbu maqolaning ma'nosini tushunadigan odam o'zi uchun har qanday o'ralgan narsani va boshqa qiziqarli narsalarni yozishga qodir :)
Teglar: Teglar qo'shish
Ob'ektlar JavaScript-ning asosi hisoblanadi. Ko'pgina o'rnatilgan ma'lumotlar turlari ob'ekt sifatida namoyish etiladi. Muvaffaqiyatli JavaScript-ni ishlab chiquvchi bo'lish uchun siz ularning qanday ishlashini aniq tushunishingiz kerak. Ob'ektning qurilish bloklari uning maydonlari yoki xususiyatlari deb ataladi javaScript ob'ekti... Ular ob'ektning har qanday tomonini tavsiflash uchun ishlatiladi. Mulk ro'yxatning uzunligini, osmon rangini yoki inson tug'ilgan kunini tasvirlashi mumkin. Ob'ektlarni yaratish oson jarayon. Til jingalak qavs bilan belgilangan ob'ekt literallari deb nomlanuvchi sintaksisni ta'minlaydi.
Xususiyatlarga kirish
Til xususiyatlarga kirish uchun ikkita yozuvni taqdim etadi. Birinchi va eng keng tarqalgan nuqta belgisi sifatida tanilgan. Nuqta belgisi bilan, xost ob'ekti nomini, so'ngra nuqta va xususiyat nomini ko'rsatib, resursga kirish mumkin. Masalan, dastlab object.foo-ga bitta qiymat berilgan bo'lsa, u holda ob'ektlarning JavaScript bayonotini bajargandan so'ng uning qiymati 2 ga teng bo'ladi.
Kirish uchun muqobil sintaksis qavs belgisi sifatida tanilgan. Notation-da, ob'ekt nomidan keyin kvadrat qavslar to'plami olinadi. Ular mulk nomini satr sifatida belgilaydilar:
object ["foo"] \u003d object ["foo"] + 1.
U nuqta belgilaridan ko'ra ko'proq ifodalaydi, chunki u o'zgaruvchiga xususiyat nomini to'liq yoki bir qismini ko'rsatishga imkon beradi. Bu mumkin, chunki JavaScript ob'ekti tarjimoni ushbu ifodani avtomatik ravishda mag'lubiyatga aylantiradi va keyin tegishli xususiyatni oladi. Xususiyat nomlari tezkor ravishda f o'zgaruvchisi tarkibini "oo" qatori bilan biriktirib yaratiladi:
ob'ekt \u003d "bar".
Qavslar belgisi xususiyatlar nomlariga nuqta belgilarida ruxsat berilmagan belgilarni kiritishiga imkon beradi. Masalan, qavs ichida quyidagi gap to'liq qonuniy hisoblanadi. Ammo, agar foydalanuvchi nuqta yozuvida bir xil xususiyat nomini yaratishga harakat qilsa, u sintaksis xatosiga duch keladi:
ob'ekt [" [elektron pochta bilan himoyalangan]# $% & * (). "] \u003d to'g'ri.
Ichki JavaScript moslamalarining xususiyatlariga nuqta va / yoki qavslarni bog'lash orqali kirish mumkin. Masalan, quyidagi ob'ekt baz nomli ichki ob'ektni o'z ichiga oladi, u yana beshta qiymatni o'z ichiga olgan satr nomli xususiyatga ega bo'lgan boshqa foo nomli ob'ektni o'z ichiga oladi:
var object \u003d (baz: (foo: (bar: 5)))).
Quyidagi iboralar ichki joylashtirilgan xususiyatlar paneliga kiradi. Birinchi iborada nuqta, ikkinchi ifodada kvadrat yozuvlar ishlatiladi. Uchinchi ibora bir xil natijaga erishish uchun ikkala yozuvni birlashtiradi:
- object.baz.foo.bar;
- object ["baz"] ["foo"] ["bar"];
- ob'ekt ["baz"]. foo ["bar"].
Oldingi misolda ko'rsatilgan iboralar noto'g'ri ishlatilsa va JavaScript-ni ishlatishga yaroqsiz holga keltirsa, ish faoliyatini pasaytirishi mumkin. Har bir nuqta yoki qavs ifodasini baholash vaqt talab etadi. Agar bir xil xususiyat bir necha marta ishlatilgan bo'lsa, unda xususiyatga bir marta kirish va undan keyin kelajakdagi barcha maqsadlar uchun qiymatni mahalliy o'zgaruvchida saqlash mantiqan to'g'ri keladi.
Uslub sifatida funktsiya
Agar funktsiya ob'ektning xususiyati sifatida ishlatilsa, u usul deyiladi. Xususiyatlar singari, ular ob'ekt literal yozuvlari yordamida belgilanadi. Masalan:
var object \u003d (sum: function (foo, bar) (return foo + bar;)).
JavaScript ob'ekti usullarini yorliqlar va qavslar yordamida chaqirish mumkin. Quyidagi misol har ikkala yozuv yordamida ham oldingi misoldan sum () usulini chaqiradi:
- object.sum (1, 2);
- ob'ekt ["sum"] (1, 2).
Ob'ektning literal yozuvi yangi ob'ektlarni yaratish uchun foydalidir, ammo mavjudlariga xususiyatlarini yoki usullarini qo'shib bo'lmaydi. Yaxshiyamki, yangi ma'lumotlarni qo'shish topshiriq bayonotini yaratish kabi oson. Bo'sh ob'ekt yaratiladi. Keyin, tayinlash operatorlari yordamida ikkita xususiyat qo'shiladi: foo va bar, shuningdek baz usuli:
- var ob'ekti \u003d ();
- object.foo \u003d 1;
- object.bar \u003d null;
- object.baz \u003d function () ("salom baz ()" dan qaytish;).
Inkapsulyatsiya qiluvchi dasturlar
Ob'ektga yo'naltirilgan dasturlashning asosiy g'oyasi dasturlarni kichik qismlarga bo'lish va ularning har birini o'z holatini boshqarish uchun javobgar qilishdir. Shunday qilib, dasturning bir qismi qanday ishlashiga oid ba'zi bir ma'lumot ushbu qism uchun mahalliy bo'lishi mumkin. Dasturning qolgan qismida ishlaydigan kishi bu haqda eslamasligi yoki hatto bilmasligi kerak. Ushbu mahalliy ma'lumotlar o'zgarganda, faqat uning atrofidagi kodni yangilash kerak.
Bunday dasturning har xil qismlari bir-biri bilan interfeyslar, cheklangan funktsiyalar to'plami yoki yanada mavhum darajada foydali funktsiyalarni ta'minlovchi birikmalar orqali o'zaro ta'sir o'tkazib, ularning aniq bajarilishini yashiradi. Dasturning bunday qismlari ob'ektlar yordamida modellashtiriladi. Ularning interfeysi ma'lum bir usul va xususiyatlar to'plamidan iborat. Interfeysning bir qismi bo'lgan xususiyatlar ommaviy xususiyatlar deb ataladi. Qolganlari, tashqi kodga tegmasligi kerak, shaxsiy deb nomlanadi.
Ko'pgina tillar umumiy va xususiy mulklarni ajratib ko'rsatish va tashqi kodlarning shaxsiy narsalarga kirishini oldini olish qobiliyatini beradi. Yana minimalist yondashuvga ega bo'lgan JavaScript-ga hali erishilmadi. Ayni paytda ushbu tilni qo'shish bo'yicha ishlar olib borilmoqda. Shuning uchun JavaScript dasturchilari ushbu g'oyadan muvaffaqiyatli foydalanadilar. Qoida tariqasida, mavjud interfeys hujjatlarda yoki sharhlarda tasvirlangan. Shuningdek, mulk nomlarining boshiga pastki chiziq (_) qo'yish odatiy holdir, bu xususiyatlar xususiydir. Interfeysni dasturdan ajratish - bu ajoyib g'oya. Odatda u kapsula deb ataladi.
Xususiyatlari
Qavsli (...) obyekt ob’ekt literal deyiladi. Siz darhol ba'zi bir xususiyatlarni bunday qavslarga joylashtirishingiz mumkin (...). Masalan, "key: value va boshqalar" juftliklari:
foydalanuvchi \u003d (// ob'ekt nomi: "Jon", // "nomi" "do'kon qiymati" kaliti bo'yicha (! LANG: John)" age: 30 // by key "age" store value 30 }.!}
Xususiyatda ikki nuqta ":" oldida kalit (shuningdek "ism" yoki "identifikator" deb ham nomlanadi) va uning o'ng tomonida qiymat mavjud. Foydalanuvchi ob'ekti ikkita xususiyatga ega. Natijada "ism" va "yosh" yorliqli ikkita imzolangan fayllar bilan foydalanuvchi JavaScript ob'ekti. Undan istalgan vaqtda fayllarni qo'shishingiz, o'chirishingiz va o'qishingiz mumkin. Xususiyat qiymatlari nuqta belgisi yordamida mavjud. Bu har qanday turdagi bo'lishi mumkin. Boolean qo'shilishi mumkin. Xususiyatni o'chirish uchun JavaScript-ni ob'ektining Xato holatidagi o'chirishdan foydalaning.
Barcha JavaScript xato ob'ektlari Xato ob'ektining avlodlari yoki meros qilib olingan narsalar:
- Syntax Error ob'ekti Error ob'ektidan meros qilib olinadi.
- JSON Syntax Xato ob'ektining ma'lum bir turi bo'yicha xatolarni tahlil qilish.
Ilovalarning JavaScript xatolari bilan qanday ishlashiga chuqurroq sho'ng'ish uchun Airbrake JavaScript-ni, real vaqtda ogohlantirishlar uchun xatolarni kuzatish vositasini va JavaScript kodida nima sodir bo'lganligini darhol tushunishni yaxshilab ko'rib chiqing.
JavaScript-ni o'chirishdan oldin foydalanuvchi qabul qilishi mumkin bo'lgan xato xabarlari:
- Satr harfida noto'g'ri boshqaruv belgisi.
- To'g'ri tomondagi noto'g'ri belgi.
- Noto'g'ri Unicode chiqishi.
- Yomon qochish belgisi.
- Tugatilmagan mag'lubiyat.
- Kutilmagan raqamli bo'lmagan kod.
- O'nli kasrdan keyin raqamlar yo'q.
- Tugatilmagan kasr soni.
- Daraja ko'rsatkichidan keyin raqamlar yo'q.
- Ko'rsatkich belgisidan keyin raqamlar yo'q.
- Eksponent qismda raqam yo'q.
- Ma'lumotlarning kutilmagan tugashi.
- Kutilmagan kalit so'z.
- Kutilmagan belgi.
- Ob'ekt tarkibini o'qish paytida ma'lumotlarning oxiri.
- Kutilayotgan mulk nomi yoki ")".
Hisoblash xususiyatlari
Ob'ekt ma'nosida kvadrat qavslardan foydalanishingiz mumkin. Bunga hisoblash xususiyatlari deyiladi. Misol quyida keltirilgan.
Hisoblangan xususiyatning qiymati oddiy: bu mulk nomini mevadan olish kerakligini anglatadi. Shunday qilib, agar mehmon "olma" ga kirsa, sumka bo'ladi (olma: 5). Kvadrat qavsda yanada murakkab iboralardan foydalanishingiz mumkin:
meva bo'lsin \u003d "olma";
: 5 // bag.appleComputers \u003d 5
Kvadrat qavslar nuqta belgilaridan ancha kuchliroq. Ular mulk nomlari va o'zgaruvchilarni qabul qiladilar. Ammo ular yozish uchun yanada noqulayroq. Shuning uchun, ko'pincha mulk nomlari ma'lum va sodda bo'lganida, nuqta ishlatiladi. Agar sizga murakkabroq narsa kerak bo'lsa, to'rtburchak qavslarga o'ting.
So'zlarni bron qilish
O'zgaruvchida zaxira qilingan so'zlardan biriga teng ism bo'lishi mumkin emas, masalan, for, let, return, va hokazo .. Ammo JavaScript-ni moslashtirishda bunday cheklov yo'q.
Printsipial jihatdan har qanday nomga ruxsat beriladi, ammo uning o'ziga xos nomi bor: u "__proto__" tarixiy sabablarga ko'ra alohida muolaja oladi. Masalan, siz uni ob'ektdan boshqa qiymatga o'rnatolmaysiz:
obj .__ proto__ \u003d 5;
ogohlantirish (obj .__ proto__); //, maqsadga muvofiq ishlamadi
Koddan ko'rinib turibdiki, 5-ibtidoiy topshiriq e'tiborsiz qoldirilgan. Agar operator ob'ektda kalit-qiymat juftligini o'zboshimchalik bilan saqlashni va mehmonga kalitlarni ko'rsatishga ruxsat berishni istasa, bu xatolar va hatto zaifliklarning manbasiga aylanishi mumkin. Bunday holda, mehmon "proto" ni kalit sifatida tanlashi va uni JavaScript ob'ektiga qo'shishi mumkin. __Proto__ bilan muomala qilingan ob'ektlarni odatiy xususiyat sifatida yaratish usuli mavjud. Ixtiyoriy kalitlarni qo'llab-quvvatlovchi ma'lumotlar tuzilmalarining yana bir xaritasi mavjud.
Butun sonli xususiyatlar
Bu erda "integer property" atamasi butun sondan o'zgartirmasdan o'zgartirilishi mumkin bo'lgan satrni anglatadi. Masalan, "49" - bu butun sonli xususiyat nomi, chunki u butun songa va orqaga aylantirilganda, u baribir bir xil bo'ladi. Ammo "+49" va "1.2" emas. Boshqa tomondan, agar tugmachalar butun son bo'lmasa, unda ular yaratilish tartibida keltirilgan. Quyidagi misolga qarang.
Kodlarni terish bilan bog'liq muammoni hal qilish uchun siz kodlarni butun sonli bo'lmagan holda aldashingiz mumkin. Har bir kod oldida "+" (ortiqcha belgisi) qo'shilishi etarli. Endi u maqsadga muvofiq ishlaydi.
Ob'ektlarning ibtidoiy narsalardan farqi shundaki, ular "ma'lumotnoma asosida" saqlanadi va nusxalanadi. Ibtidoiy qiymatlar "butun son sifatida" tayinlanadi va ko'chiriladi. O'zgaruvchan narsa ob'ektning o'zi yoki unga "havola" ni emas, balki "xotiradagi manzilni" saqlaydi. Uning tarkibiga kirish va o'zgartirish uchun har qanday o'zgaruvchidan foydalanishingiz mumkin.
Yuqoridagi misol shuni ko'rsatadiki, unga kirish uchun bitta ob'ekt va administrator mavjud. Keyinchalik, agar keyinchalik boshqa kalit (foydalanuvchi) ishlatilsa, foydalanuvchi o'zgarishni aniqlaydi.
Ob'ektlar uchun tenglik \u003d\u003d va qat'iy tenglik \u003d\u003d\u003d operatorlari bir xil ishlaydi. Ikkita ob'ekt bitta ob'ekt bo'lsa, ularga teng bo'ladi. Obj1\u003e obj2 kabi taqqoslashlar yoki ibtidoiy obj \u003d\u003d 5 bilan taqqoslash uchun ob'ektlar ibtidoiy narsalarga aylantiriladi. Rostini aytsam, bunday taqqoslashlar juda kamdan-kam hollarda kerak bo'ladi va odatda kodlash xatolarining natijasidir.
JavaScript-ni tasdiqlash
Ob'ektlar har qanday mulkka kirish huquqiga ega. Ammo, agar u umuman mavjud bo'lmasa, bu xato bo'lmaydi. Faqat mavjud bo'lmagan xususiyatga kirish aniqlanmagan qaytadi. Bu mulkni tekshirish va aniqlanmagan bilan taqqoslashning juda keng tarqalgan usulini taqdim etadi. Quyida misol keltirilgan.
Belgilanmagan narsalarni saqlaydigan xususiyatlar uchun "in" dan foydalanish. Odatda "\u003d\u003d\u003d aniqlanmagan" taqqoslash tekshiruvi yaxshi ishlaydi. U ishlamay qoladigan va "in" to'g'ri ishlaydigan maxsus holat mavjud. Bu ob'ektning xususiyati mavjud bo'lganda, ammo aniqlanmagan holatda bo'ladi.
Yuqoridagi kodda obj.test xususiyati texnik jihatdan mavjud. Shuning uchun in operatori to'g'ri ishlaydi. Bu kabi holatlar juda kam uchraydi, chunki aniqlanmagan odatda tayinlanmaydi. Ko'pincha "noma'lum" yoki "bo'sh" qiymatlardan foydalaniladi. Shunday qilib, in operatori aslida kodda mehmon hisoblanadi.
"For..in" tsikli
Ob'ektdan ob'ektga barcha tugmachalarni aylanib o'tish uchun tsiklning maxsus shakli mavjud: for..in. Bu for (;;) konstruktsiyasidan butunlay boshqacha narsa.
Quyida misol keltirilgan.
Shuni esda tutingki, konstruktorlar uchun barchasi loop ichidagi o'zgaruvchini ruxsat beruvchi kalit sifatida e'lon qilishga imkon beradi. Shu bilan bir qatorda, uning o'rniga boshqa o'zgaruvchining nomi kalitidan foydalanishingiz mumkin.
Masalan, for (let in obj) ham keng ishlatiladi.
Har qanday satrda ishlaydigan muqobil "kvadrat qavs" mavjud.
Aytish kerakki, nuqta JavaScript-ni kalitlari haqiqiy o'zgaruvchining identifikatori bo'lishi kerak, ya'ni bo'sh joy yoki boshqa cheklovlar mavjud emas. Qavslar ichidagi chiziq to'g'ri keltirilganligiga e'tibor berish kerak. Kvadrat qavslar, shuningdek, o'zgaruvchidan so'zma-so'z satrdan farqli o'laroq, xususiyat nomini har qanday ifodadan olish usulini beradi:
let key \u003d "qushlarni yoqtiradi";
// foydalanuvchi bilan bir xil ["qushlarni yoqtiradi"] \u003d rost;
user \u003d true.
Bu erda o'zgaruvchan kalit ish vaqtida hisoblab chiqilishi mumkin va foydalanuvchi kiritishiga bog'liq va keyin xususiyatga kirish uchun ishlatiladi. Bu dasturchilarga juda moslashuvchanlikni beradi. Nuqta yozuvini shunga o'xshash tarzda ishlatish mumkin emas, chunki u JavaScript ob'ekti ustida takrorlanadi. Quyida misol keltirilgan.
Const ob'ekti
E'lon qilingan const ob'ekti o'zgartirilishi mumkin. Misol quyida keltirilgan.
(*) Qatoridagi JavaScript ob'ekti xatoga yo'l qo'yganday tuyulishi mumkin, ammo bunday bo'lmaydi. Buning sababi, const foydalanuvchining o'zi qiymatini aks ettiradi. Va bu erda foydalanuvchi har doim bir xil ob'ektga murojaat qiladi. Chiziq (*) ob'ekt ichiga kiradi, foydalanuvchi uni qayta tayinlamaydi. Agar foydalanuvchini va boshqasini o'rnatmoqchi bo'lsangiz, Const xato qiladi. Ob'ektni klonlash va birlashtirish, nusxalash kerak bo'lsa, xuddi shu ob'ektga yana bir murojaat yaratadi. Bu ham bajarilishi mumkin, ammo biroz murakkabroq, chunki JavaScript-da o'rnatilgan usul yo'q. Aslida, bu kamdan-kam hollarda zarur. Malumot bo'yicha nusxalash ko'p hollarda qo'llaniladi. Ammo, agar sizga chindan ham kerak bo'lsa, unda JavaScript-ni yaratishingiz va mavjudligini tuzilishini takrorlashingiz, uning xususiyatlarini ibtidoiy darajada nusxalashingiz kerak. Quyida misol keltirilgan.
Buning uchun Object.assign usulidan ham foydalanishingiz mumkin. Dest va src1, ..., srcN ob'ektlardir. U barcha ob'ektlarning xususiyatlarini nusxa ko'chiradi src1, ..., srcNINTO dest. Boshqacha qilib aytganda, ikkinchisidan boshlangan barcha argumentlarning xususiyatlari 1-raqamga ko'chiriladi. Keyin destga qaytadi. Masalan, siz undan bir nechta moslamalarni bittasini birlashtirish uchun foydalanishingiz mumkin.
Oddiy klonlash tsikli o'rnini bosish uchun Object.assign-dan foydalanishingiz mumkin. U foydalanuvchining barcha xususiyatlarini bo'sh ob'ektga ko'chiradi va xuddi tsikl kabi, lekin undan ham qisqa qilib qaytaradi. Hozircha barcha foydalanuvchi xususiyatlari ibtidoiy deb qabul qilingan. Ammo xususiyatlar boshqa ob'ektlarga havolalar bo'lishi mumkin.
Buni tuzatish uchun har bir foydalanuvchi qiymatini tekshiradigan va agar u ob'ekt bo'lsa, keyin uning tuzilishini takrorlaydigan klon ko'chadan foydalanish kerak. Bunga "chuqur klonlash" deyiladi.
Yuqorida keltirilgan ishni va "Structured cloning алгоритм" deb nomlangan murakkab holatlarni ko'rib chiqadigan standart chuqur klonlash algoritmi mavjud. G'ildirakni qayta kashf qilmaslik uchun, lodash JavaScript kutubxonasida ishlaydigan dasturdan foydalanishingiz mumkin _.cloneDeep (obj).
Ilg'or usullar
Agar dasturchi ob'ektni aylanib chiqsa va barcha xususiyatlarni ular qo'shilgan tartibda olishni istasa, ular "maxsus buyurtma" ga tayanishi mumkin, bu erda butun sonli xususiyatlar saralanadi va boshqalari JavaScript ob'ekti yaratilgan tartibda hosil bo'ladi.
Murakkab ob'ekt usullari JavaScriptting-da kamdan kam ishlatiladigan tushunchalar bilan shug'ullanadi. Buning sababi shundaki, ushbu kuchli xususiyatlar oddiy senariylarda kerak emas. Ushbu usullarning ba'zilari eski brauzerlarda ishlamasligi mumkin, masalan Netscape 4 ning erta versiyalari.
Prototipdan foydalanish nafaqat yangilarini, balki JavaScript-ni ob'ektlarini va barcha mycircle usullarini yaratish uchun ishlatilishi mumkin. Bu aralash ishlash yukini beradi. Ob'ektning har bir nusxasi uchun ular usullarning alohida nusxalarini saqlashlari shart emas, shuning uchun ular ishlash uchun kamroq xotira talab qilishi mumkin, ammo ularni topish uchun brauzer joriy va ota-ona doiralarini qidirishi kerak. Bu o'ta kechikishga olib kelishi mumkin. Odatda, foydalanuvchi ushbu qarorni ishlashga asoslanib emas, balki kod uchun mos bo'lgan narsani ishlatishi kerak, agar ular juda aniq boshqariladigan muhit bilan shug'ullanmasa.
Haqiqiy qaytish
Ba'zi hollarda, ob'ekt mulkining o'zi yoki prototip zanjirining biron bir joyiga bog'lanishi kerak bo'lishi mumkin. JavaScript-da barcha ob'ektlar hasOwnProperty usulidan foydalanadilar, agar bu xususiyat bitta ob'ekt nusxasiga bog'langan bo'lsa, haqiqiy bo'ladi. Bunday holda, ob'ekt konstruktori xuddi shu qiymatga ega bo'lgan ob'ekt xususiyatiga ega yoki yo'qligini tekshirish mumkin bo'ladi. Ob'ekt namunasi uchun ham, zanjir prototipi uchun ham bir xil qiymatga ega bo'lgan alohida JavaScript ob'ekti xususiyatlari mavjud bo'lsa, bu noto'g'ri natija berishi mumkin. HasOwnProperty usuli bitta parametrni, satr sifatida xususiyat nomini oladi.
Xuddi shu tarzda shaxsiy usullarni yaratish mumkin. Bu shunchaki konstruktor funktsiyasi ichida yaratilgan funktsiya. Ba'zilar uchun bu chalkash tuyulishi mumkin, ammo u shunday ishlaydi. Xususiy funktsiyani faqat konstruktor o'zi yoki satrda aniqlangan usullar bilan chaqirish mumkin. Agar ular jamoat konstruktoriga tayinlangan bo'lsa va ulardan foydalanish imkoniga ega bo'lsa, ular ommaviy usul sifatida ishlatilishi mumkin ochiq usullar Javascript ob'ektlari.
funktsiya myob () (funktsiya cantBeSeen () (ogohlantirish (secretValue));
) var secretValue \u003d "";
this.method1 \u003d function () (secretValue \u003d "(! LANG: kutilmagan hodisalar yo'q)";!}
this.method2 \u003d cantBeSeen;
) var oneOb \u003d yangi myob ();
oneOb.method1 ();
// ogohlantirishlar "kutilmagan hodisalar yo'q" oneOb.method2 ();
// ogohlantirishlar "kutilmagan hodisalar bo'lmaydi".
Buyruq shabloni
Buyruq moslamalari bo'shashgan tizimlarga imkon beradi, so'rovni chiqaruvchilarni ob'ektlardan ajratadi va aslida so'rovni qayta ishlaydi. Ushbu so'rovlar voqealar deb ataladi va so'rovlarni boshqaradigan kod voqea ishlovchilari deb nomlanadi.
Buferga kesish, nusxalash va joylashtirish amallarini qo'llab-quvvatlovchi dasturlarni yaratmoqdasiz. Ushbu amallar dastur davomida turli yo'llar bilan qo'zg'atilishi mumkin: menyu tizimi, kontekst menyusi, masalan, bosish orqali o'ng tugma matn maydoni yoki klaviatura yorlig'i ustiga sichqoncha. Buyruq moslamalari ushbu harakatlarni qayta ishlashni markazlashtirishga imkon beradi, har bir operatsiyani bajarish uchun bitta kesma so'rovlarini qayta ishlash uchun bitta buyruq kerak bo'lsa, bitta nusxa ko'chirish so'rovlari uchun bitta va barcha joylashtirish uchun so'rovlar uchun.
Buyruqlar barcha ishlov berishni markazlashtirganligi sababli, ular ko'pincha dastur bo'ylab bekor qilishni qayta ishlashda ishtirok etadilar. Zamonaviy JavaScript usullarini qo'llash orqali sezilarli yaxshilanishlarga erishish mumkin, natijada yanada samarali, ishonchli va texnik xizmat ko'rsatadigan dasturlar mavjud.
Buni qanday qilishni ko'rish uchun JavaScript + jQuery shablonlaridan foydalanish mumkin. Ushbu noyob to'plam barcha GoF shablonlari uchun optimallashtirilgan JavaScript-ni o'z ichiga oladi, masalan, nom maydonlari, prototiplar, modullar, funktsiya ob'ektlari, yopilishlar, noma'lum funktsiyalar va boshqalar. Agar foydalanuvchilar JavaScript templati, jQuery templati va templat arxitekturasi uchun eng yangi vositalar va texnikani xohlasalar, demak bu eng yaxshi variant foydalanish. Ushbu paket JavaScript-ni ishlab chiquvchilar uchun qimmatli, tegishli ma'lumotlarni o'z ichiga oladi. Bu erda quyidagilar mavjud:
- JavaScript optimallashtirilgan GoF shablonlari.
- Zamonaviy JavaScript dizayn naqshlari.
- Model-View dizayn naqshlari.
- JQuery dizayn shablonlari.
- Arxitektura naqshlari JavaScript iboralari.
- Namunaviy dasturlar (MVC, SPA va boshqalar)
Javascript ob'ekti sintaksisining tavsiya etilgan asoslari yangi boshlagan dasturchilar uchun juda muhimdir. Avval ob'ektlarni tushunishingiz kerak, shunda ob'ektga yo'naltirilgan dasturlash bo'yicha bilimlar bo'ladi. Ushbu materialni chuqur tushunish juda muhimdir, chunki u JavaScript-ning qolgan tillari uchun asos bo'lib xizmat qiladi.
