Bizni chat guruhimiz uchun link.
https://t.iss.one/abs_javascript_chat

Kanalimiz linki.
https://t.iss.one/abs_javascript

YouTube kanalimga Figmadan Portfolio website tayorlash bo'yicha dars chiqardim.

O'tib ko'rishlaringiz mumkin: https://youtu.be/jWW18aIECWg?si=8DLcjmyuw5MiO7Py

@abs_javascript

Agar input (file) ni malumotini olmoqchi bo'lsangiz.

 var selectedFiles = fileInput.files; 

input(file) massiv qaytarishini unutmang chunki input(file) da multiple atributini hisobiga input (file) ga istaganizcha file yuklash imkonyati payda bo'ladi va har bir file massivning elementi sifatida tushadi.

  <input class="input" multiple type="file"> 

@abs_javascript

confetti-js

Vercel danfoydalanadiganlar bu effectni juda yaxshi bilishsa kerak. Yangi amalyotimda bu effectni bir necha turini sinab ko'rdim.

Link: https://abs-javascript-confetti-js.netlify.app/
GitHub: https://github.com/Abdulvahobjon/js-project-30

@abs_javascript

Effectdan foydalanish uchun manba:
https://confetti.js.org/more.html

Foydalanish uncha qiyin emas)
@abs_javascript

OOP nima ?

OOP (Object Oriented Programming ) - Obyectga Yonaltirilgan Dasturlash , OPP ishlatib yozilgan dasturlarda hamma narsa Obyectlarga asoslangan bo'ladi.
Yani hayotdagi narsalarni Obyect ko'rinishida yoziladi.

Obyectni O'zgaruvchilarini PROPERTY yoki HOSSASI deyiladi.
Obyect tarkibidagi Functionni METHOD deyiladi.

@abs_javascript

Biz odatda ishlatadigan Object (Obyekt) ni ko'rinish.
Lekin !!! —————-
Biz bu usulda Obyectlarni yaratish eng maqul usul emas. Agar siz 2 ta ohshash Obyect paydo qilishingiz kerak bo'lib qoldi. Hozirgi usulda Obyectlarni qiymatlarini o'zgartirgan holatda qaytadan yozishingiz kerak bo'ladi.
Bir xil narsani faqat nomlarni (value) o'zgartirgan hola ikki marotabadan ko'p yozyabsiznmi ? , demak sizni ko'dizda muammo bor.

Qanday yechim qilish mumkin ?

Bunga yechim sifatida 2 ta usulni taklif qilaman.
1. Factory function
2. Constructor function

@abs_javascript

Factory function nima ?

Factory function - bu yangi ob'ektni namunasini qaytaradigan funksiya.

@abs_javascript

Oddiy usulda ( nomaqul ) Object hosil qilinsa.

@abs_javascript

Tepadagi kodni Foctory function bilan hosil qilinganda.

@abs_javascript

Bu kodimizni yanada qisqarturish mumkin.

O'zgaruvchi va Parametrlar bir bil bo'lsa - O'zgaruvchini nomini yozishingizni o'zi kifoya.
Object ichidagi funksiyalarda (Method) - function va ikki nuqtani olib tashlash mumkin.

@abs_javascript

Agar postlar foydali bo'layotgan bo'lsa dostlaringiz ham ulashsangiz juda hursand bo'lar edim.

Yangi amalyot tayyorbo'ldi.))

Istagan va istagancha malumotingizni zipga aylantirish

Bu website orqali istagan malumotingizni .ZIPga aylantira olishingiz mumkin.

Link: https://abdulvahob-zip-file.netlify.app/
GitHub: https://github.com/Abdulvahobjon/js-project-30

@abs_javascript

Loyihamizni kodlari bilan tanishib chiqamiz.

HTML ga sdnjs da link olib kelib saqlab olishingiz kerak
https://cdnjs.com/libraries/jszip
https://cdnjs.com/libraries/FileSaver.js

2 - 3 - qator: Input va Button ni chaqirib oldim;
5-qator: click hususiyatini qo'shish;
6-qator: JSZip obyectini yaratish. Bu obyect yordamida filelarni zip holatiga keltiramiz;
7-qator: Inputga yuklangan filelarni for bilan har birini olib zip obyektiga qo’shadi.;
11-qator: ZIP obyectini blob formatida yaratadi. Blob formati fayllarni brauzerda saqlashga yordam beradi;
12-qator: ZIP obyectini yaratish amalga oshganidan keyin ishga tushadi. info o'zgaruvchisi zip file yaratilgan zip obyectini ifodalaydi;
13-qator: Yaratilgan zip objectini "info .zip" nomi bilan saqlaydi;

@abs_javascript

Hozir bir muammo yechimini ustida ishlash uchun tayorgarlik ko'ryabman.

Agar Websitega 2 va undan ortiq YouTubedan video olib keladigan bo'lsaiz , ikkala videoni ishga tushurgan vaqtizda , ikkisiham bir vaqtning o'zida ishlay veradi. Asliga biri ishlagan payt ikkinchisi automatik ochishligi kerak. Bu muammoni ko'p saytlarda bor ekan.
Misol uchun:
daryo.uz
imaninvest.com/how-it-works
(kun.uz ham bor ekan )

Ko'p muammolarga , duch kelmaguningcha unday muammo borliginiham bilmas ekansan bazida.

@abs_javascript

Bu postimda
1. Factory function
2. Constructor function haqida aytib o'tgan edim

Factory function haqida tanishib chiqdik https://t.iss.one/abs_javascript/1098
Keling endi Constructor function haqida tanishib chiqamiz.

@abs_javascript

Constructor fuction haqida. Boshladik.