JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#kulguTime

🤯

JavaScript

#absJavaScript

https://t.me/abs_Java_Script

⚡2❤‍🔥1👍1🔥1🆒1

46 viewsツ, edited 07:08

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

Reaksiyalarni portlatamiz🧨

Kompyuteringizda sinab koʻring!
Consolega nima chiqadi?

JavaScript

#absJavaScript

https://t.me/abs_Java_Script

👍2⚡1❤‍🔥1🔥1😁1🆒1

209 viewsツ, edited 07:12

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#Dars16 #JS #absJavaScript #JavaScript #Foydali
⚡️⚡️⚡️
Buni kompyuteringizda sinab koʻring.
HTML ochib, unga JS ni ulab, JS ga yozing va "Open with LiveServer". "Parol yozin"ga parol oʻylab toping 🔐😄.

let parol = prompt('Kirish uchun parolni kiriting') 
if(parol == "Parol yozin"){
alert("Parol to'g'ri, saytdan foydalanishingiz mumkin!")
else{
location.reload()
}

😁

🔗 t.me/absJavaScript

❤‍🔥1⚡1👍1😁1🏆1🆒1

87 viewsedited 10:34

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#JavaScript #absJavaScript
Insonlar aldashi mumkin, lekin raqamlar aldamaydi 👀

📌 Dasturchilarning ko‘pchiligi telefonga nisbatan kompyuterdan ko‘proq foydalanadilar.

⌛ Ular web-saytlarga asosan kompyuterdan kiriladi deb o‘ylaydilar.

⚠️ Buning oqibatida web-saytlarning responsivligiga kam e’tibor berishadi.

‼️ Lekin raqamlar shuni ko‘rsatmoqda-ki, biz kattaroq e’tiborni responsivlikka qaratishimiz kerak ekan.

(Maʼlumot oʻrnida aytish mumkinki "RESPONSIVE" bu - saytni bir turdagi emas balki bir necha turdagi yani telefon 📱, noutbuk💻, planshet🖥 va boshqa turdagi gadgetlarga ham moslab yaratish ✅.)

Postni Do'stlarga ham share qilaylik ⚡️

🔗 t.me/absJavaScript

⚡2❤‍🔥1👍1🔥1🆒1

67 viewsedited 14:27

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#challenge #snow #JavaScript #absJavaScript #HTML #CSS #JS #winter

Sinab koʻringchi nima chiqar ekan 😉.

Code 👇

<!DOCTYPE html>

<html>
<head>
  <meta http-equiv="CONTENT-TYPE" content="text/html; charset=UTF-8">
  <title>Snow</title>
</head>
<body>

<section class="section">
<div class="section-container">
<img class="section-container-img" href="https://images.app.goo.gl/8ctwMkEr5ZurDYLR6" alt="snow-icon">
<button class="print">Print</button>
</div>
</section>

</body>
</html>

*{
margin: 0;
padding: 0;
}

.section{
padding-top: 75px;
padding-bottom: 75px;
bacground-color: #2BBFFF;
}
.section-container{
margin-left: auto;
margin-right: auto;
width: 1200px;
display: flex;
justify-content: space-between;
}
.section-container-img{
width: 100px;
height: 100px;
}
.print{
padding: 10px;
color: #000;
bacground-color: #FFF;
border-radius: 8px;
border: none;
}

let btn = document.querySelector('.print');

btn.addEventListener('click', function(){
  print();
});

☃2❤‍🔥1👍1🔥1🏆1🆒1

125 viewsedited 12:21

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#JS #CSS #HTML #absJavaScript #JavaScript #Tutorial #Foydali

Frontend dasturchi bo'lish uchun , nimalarni bilishim kerak ⁉️

Asosiysi — html , css va javascript ni bilishiz kerak.

Tekinga o'rganish uchun manbalar:

Dasturlashga kirishdan oldin , qisqacha malumot:

1⃣. https://www.youtube.com/watch?v=WXDDLyTI2Dk
2⃣. https://www.youtube.com/watch?v=KcJESju6KDs

HTML ni o'rganish uchun:

html ( boshlang'ich ) — https://www.youtube.com/watch?v=xcGtfYUfDLo&list=PLHNaMQIyrDHOZhHnc2UdQEOHrb1xM7HaF
html ( yuqori ) — https://www.youtube.com/watch?v=OdkbJgQUrZ0&list=PLXJSt32YUa4V2XJRrR2tkJTf_MPsiY32m&index=18

CSS ni o'rganish uchun:

1⃣. https://www.youtube.com/watch?v=cUz7lqCNn1A&list=PLXJSt32YUa4U3kviEXBjQ9MJud0Xi-8P8

( 9 ta darsni tugating )

2⃣. https://www.youtube.com/watch?v=Zn5uwsNdTjE&list=PLXJSt32YUa4XbOFdKE8uwCbccpD-nGaPL&index=5

( 25 ta darsni tugatish )

CSS da amalyot qilish uchun:

1⃣. https://www.youtube.com/watch?v=al4u2WER84Q
2⃣. https://www.youtube.com/watch?v=jWW18aIECWg&t=12s
3⃣. https://www.youtube.com/watch?v=hJTcMmWB888&t=2s

javascript ni o'rganish uchun:

1⃣. https://www.youtube.com/watch?v=zJuDsji3IbE&list=PLNS3PujVHR-ay0HpqbsPWccgEhJZk6K9u

(to'liq tugatish)

2⃣. https://youtu.be/CdlPHoTmZqU?si=0bnqscbKBzUOaYC3
3⃣. https://youtu.be/Q3tFsK9B6S4?si=C_vFkCNG6CI6ShHH
4⃣. https://youtu.be/lvHCgNKvODs?si=3piXfbdjmP41PUIy

⚡️JavaScript

💫 Hoziroq obuna bo'ling va do'stlarga ham ulashib qo'ying

✅ https://t.me/absJavaScript

❤‍🔥1☃1👍1🔥1🏆1🆒1

153 viewsedited 12:33

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#JavaScript #Dasturlash #WebDasturlash #Frontend #HTML #CSS #JS #Programmer #CodingLife #WebDevelopment #absJavaScript

1. JavaScript nima? Nega uni o‘rganish kerak?

ℹ️ JavaScript (JS) – bu veb-saytlar, dasturlar va hatto serverlarni yaratishda ishlatiladigan kuchli dasturlash tili.

🔴 JS Nimaga Kerak?

~~✅ Dinamik veb-sahifalar yaratish~~
~~✅ Tugmalar, animatsiyalar, modal oynalar qo‘shish~~
~~✅ Ma'lumotlarni qayta ishlash va API'lar bilan ishlash~~

🔴 Dastlabki "JS" kodingiz

Quyidagi kod ekranga "Salom, JavaScript!" deb chiqaradi:

console.log("Salom, JavaScript!");

Bu kodni browserning console oynasida yoki Node.js muhiti orqali ishlatishingiz mumkin!

❓Savol: "JavaScript" qaysi sohalarda ishlatiladi? Kommentda fikr qoldiring!

⏭ Keyingi postda "JavaScriptni qanday ishlatamiz?" yoritiladi.

🔗 @absJavaScript | #JaSc@absJavaScript

👍2🔥2❤‍🔥1⚡1

58 viewsedited 15:30

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#JavaScript #Dasturlash #WebDasturlash #Frontend #HTML #JS #CodingLife #JavaScriptTutorial #absJavaScript

2. JavaScriptni Qanday Ishlatamiz?

JavaScript kodini uch xil usulda ishlatish mumkin:

1️⃣ HTML ichida <script> orqali

Eng oddiy usul – HTML hujjatining ichida yozish:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JS Boshlanishi</title>
</head>
<body>
    <h1>Salom, JavaScript!</h1>

    <script>
        alert("Bu JavaScript!");
    </script>
</body>
</html>

📌 Bu kod sahifa yuklanganda alert oynasini chiqaradi.

2️⃣ Alohida ".js" fayl orqali

Kodingizni alohida .js faylga yozib, HTML bilan bog‘lash yaxshiroq:

<script src="script.js"></script>

📌 Bunda barcha JavaScript kodi script.js faylida bo‘ladi.

3️⃣ Brauzer console orqali

Agar siz tezda kodni tekshirmoqchi bo‘lsangiz:
1️⃣ Chrome yoki Firefox’ni oching
2️⃣ F12 tugmasini bosing
3️⃣ Console oynasiga quyidagi kodni yozing

console.log("JavaScript ishladi!");

📌 Bu kod console’da "JavaScript ishladi!" deb chiqaradi.

⏮ Avvalgi postda "JavaScript nima? Nega uni o‘rganish kerak?" yoritilgan.
⏭ Keyingi postda "HTML, CSS va JavaScript – ularning farqi nima?" yoritiladi.

🔗 @absJavaScript | #JaSc@absJavaScript

🏆2❤‍🔥1👍1🔥1

74 viewsedited 03:02

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#HTML #CSS #JS #absJavaScript

3. HTML, CSS va JavaScript –
ularning farqi nima?

ℹ️ Agar veb-dasturlashni o‘rganmoqchi bo‘lsangiz, uchta asosiy texnologiyani bilishingiz kerak:

🟠 HTML – Tuzilma (Structure)

HTML (HyperText Markup Language) – bu veb-sahifaning asosiy skeleti. U matnlar, rasmlar, tugmalar va boshqa elementlarni joylashtirish uchun ishlatiladi.

Misol:

<h1>Bu sarlavha</h1>
<p>Bu oddiy matn.</p>

🟠 CSS – Dizayn (Style)

CSS (Cascading Style Sheets) – veb-sahifalarga go‘zallik beradi. Rang, shrift, joylashuv kabi xususiyatlarni belgilaydi.

Misol:

h1 {
  color: blue;
  font-size: 24px;
}

🟠 JavaScript – Interaktivlik (Interaction)

JavaScript – bu veb-sahifaga jon beradi. Tugmalar, modal oynalar, animatsiyalar yaratish va ma’lumotlarni qayta ishlash uchun ishlatiladi.

Misol:

document.querySelector("h1").style.color = "red";

📌 HTML – skelet, CSS – bezak, JavaScript – harakat!

⏮ Oldingi postda "JavaScriptni qanday ishlatamiz?" yoritilgan.
⏭ Keyingi postda "HTML asoslari - dastlabki sahifamiz." yoritiladi.

🔗 @absJavaScript | #JaSc@absJavaScript

❤‍🔥2🔥2👍1

74 viewsedited 03:04

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#Set #absJavaScript

Set

Set — bu to'plam. Faqat bunda har bir element bir marotaba foydalanishi mumkin.

let set = new Set() — yangi Set yaratildi.
set.add("abs") — qiymat qo'shildi
set.delete("abs") — qiymat olib tashlandi.
set.has("abs") — qiymat bor yo'qligi tekshiradi . Bor bo'lsa true aksida bo'lsa false
set.clear() — ma'lumotlarni tozalaydi
set.size — elementlar soni

🔗 @absJavaScript

👨‍💻2❤‍🔥1👍1🔥1

208 views03:01

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

11. – JavaScript sintaksisi va konsol

🚀 JavaScriptga ilk qadam!

Assalomu alaykum, dasturlashga qiziqqan do‘stlar!
Bugun siz bilan JavaScript sintaksisi bilan tanishamiz va konsolda kod yozishni o‘rganamiz.

✍️ Sintaksis – bu dasturlash tilining grammatikasi. To‘g‘ri sintaksis yozilmasa, kod ishlamaydi.

console.log("Salom, JavaScript!");

🛠 console.log() – bu brauzerning konsolida ma’lumot chiqarish uchun ishlatiladi.

🖥 Konsolni ochish uchun:

• Chrome: F12 → “Console”

• Firefox: Ctrl + Shift + K

Misol:

console.log(5 + 3); // 8
console.log("Bugun dars 11");

Siz uchun vazifa:
O‘zingiz haqingizda 3 ta console.log() yozing.

⏭ Keyingi postda "O'zgaruvchilar: var, let, const" haqida o‘rganamiz.

🔗 @absJavaScript | #JaSc@absJavaScript

❤‍🔥1👍1

131 viewsedited 04:24

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#JavaScript #Frontend #Dasturlash #LearnJS #WebDevelopment #absJavaScript

2️⃣ Dars 12 – O‘zgaruvchilar: var, let, const

💡 JavaScriptda o‘zgaruvchi — bu ma’lumotni saqlovchi konteyner.

🔹 var — eski usul (hozir kam ishlatiladi)

var ism = "Falonchi";
console.log(ism);

⚠️ var — funksional ko‘lamga ega, ya’ni faqat funksiya ichida ishlaydi.
❗ Qayta e’lon qilish mumkin, ammo bu xatolarga olib kelishi mumkin.

🔹 let — zamonaviy va xavfsiz

let yosh = 18;
yosh = 19;
console.log(yosh);

✅ let — blok ko‘lamga ega.
✍️ Qiymatini o‘zgartirish mumkin, lekin qayta e’lon qilib bo‘lmaydi.

🔹 const — o‘zgarmas qiymatlar uchun

const PI = 3.14;
console.log(PI);

🔐 const bilan e’lon qilingan qiymat hech qachon o‘zgarmaydi.
🎯 Asosan doimiy qiymatlar uchun ishlatiladi.

✅ Qachon qaysi biri ishlatiladi?

let → qiymatni keyin o‘zgartirish kerak bo‘lsa

const → butunlay o‘zgarmaydigan qiymat bo‘lsa

var → ishlatmaslik tavsiya etiladi ❌

🧪 Amaliy masala:

let ism = "Ali";
let yosh = 20;

console.log(ism + " " + yosh + " yoshda.");

🧠 Natija: Ali 20 yoshda.

⏮ Avvalgi postda "JavaScript sintaksisi va konsol" haqida tushuncha berilgan.
⏭ Keyingi postda "Ma’lumot turlari (Data Types)" haqida o‘rganamiz.

🔗 @absJavaScript | #JaSc@absJavaScript

❤‍🔥1👍1

181 viewsedited 11:10

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#JavaScript #Frontend #Dasturlash #LearnJS #WebDevelopment #absJavaScript

2️⃣ Dars 13 – Ma’lumot turlari (Data Types)

🧠 JavaScriptda ma’lumotlar turli ko‘rinishda bo‘ladi. Har birining o‘ziga xos vazifasi bor.

🔸 Primiv (oddiy) ma’lumot turlari:
1. String – matnlar uchun

let ism = "Islombek";

2. Number – butun yoki o‘nlik sonlar

let yosh = 18;
let narx = 12.5;

3. Boolean – true yoki false

let to‘g‘ri = true;
let noto‘g‘ri = false;

4. Undefined – qiymat belgilanmagan

let x;
console.log(x); // undefined

5. Null – bo‘sh qiymat

let qiymat = null;

6. Symbol – noyob identifikator (kam ishlatiladi)
7. BigInt – katta sonlar uchun

let kattaSon = 1234567890123456789012345678901234567890n;

🔹 Obyekt turlari (Complex types):
Object

let talaba = {
  ism: "Ali",
  yosh: 20
};

Array (Massiv)

let ranglar = ["qizil", "yashil", "ko‘k"];

Function

function salomBer() {
  console.log("Salom!");
}

📌 typeof operatori
Ma’lumot turini aniqlash uchun ishlatiladi:

let yosh = 18;
console.log(typeof yosh); // number

📘 Har bir ma’lumot turi o‘z joyida ishlatiladi. Masalan, tugmani bosilganini tekshirishda boolean, ismni saqlashda string, narxda number kerak bo‘ladi.

⏮ Avvalgi postda "Oʻzgaruvchilar: var, let, const" o‘zgaruvchilari haqida tushuncha berilgan.
⏭ Keyingi postda "Operatorlar (Amallar)" haqida o‘rganamiz.

🔗 @absJavaScript | #JaSc@absJavaScript

❤‍🔥1👍1

259 viewsedited 03:01

JavaScript | 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹 𝗰𝗵𝗮𝗻𝗻𝗲𝗹

#JavaScript #Frontend #Dasturlash #LearnJS #WebDevelopment #absJavaScript

2️⃣ Dars 14 – Operatorlar (Amallar)

🔧 JavaScriptda operatorlar orqali qiymatlar ustida turli hisob-kitoblar va solishtirishlar amalga oshiriladi.

🔹 Aritmetik operatorlar:

let a = 10;
let b = 3;

console.log(a + b); // 13
console.log(a - b); // 7
console.log(a * b); // 30
console.log(a / b); // 3.333...
console.log(a % b); // 1

➕ + — qo‘shish
➖ - — ayirish
✖️ * — ko‘paytirish
➗ / — bo‘lish
♻️ % — qoldiqni olish

🔹 Tayyorlovchi (assignment) operatorlar:

let x = 5;
x += 2; // x = x + 2
console.log(x); // 7

➡️ = – belgilash
➕ +=, ➖ -=, ✖️ *=, ➗ /=, ♻️ %=

🔹 Solishtirish operatorlari:

console.log(5 == "5");   // true
console.log(5 === "5");  // false
console.log(5 != 3);     // true
console.log(5 > 3);      // true
console.log(5 <= 5);     // true

✅ == – qiymat tengmi?
✅ === – qiymat va turi tengmi?
❌ !=, !== – teng emas
🔼 <, >, <=, >=

🔹 Mantiqiy (logical) operatorlar:

let yosh = 20;
console.log(yosh > 18 && yosh < 25); // true

&& – va
|| – yoki
! – inkor (not)

✅ Amaliy masala:

let yosh = 16;

if (yosh >= 18) {
  console.log("Siz katta yoshdasiz");
} else {
  console.log("Siz hali voyaga yetmagansiz");
}

⏮ Avvalgi postda "Ma’lumot turlari (Data Types)" haqida tushuncha berilgan.
⏭ Keyingi postda "Shart operatorlari (if, else, switch)" haqida o‘rganamiz.

🔗 @absJavaScript | #JaSc@absJavaScript

❤‍🔥1👍1

363 viewsedited 03:00

About

Blog

Apps

Platform