🟨 Days 1–7 – JavaScript की नींव · दिन 03
दिन 3: Operators, Conditions और फ़ैसले
⏱ 85 min📶 Beginner🎯 100% self-study
दिन 3 / 30
✅ आज आप सीखेंगे
- Arithmetic और assignment operators (%, **, +=)
- Comparison: === बनाम == और यह क्यों ज़रूरी
- Logical operators &&, ||, ! और truthy/falsy values
- if / else if / else, switch और ternary operator
- आधुनिक helpers: ?? और ?.
🏢 असली दुनिया में
Business नियम conditions हैं: “₹1,500 से ऊपर free delivery”, “5 kg से ज़्यादा orders पर 10% off”, “सोमवार को दुकान बंद”, “quantity 0 हो तो Out of stock दिखाओ”। आप जो भी app बनाएँगे वह इन फ़ैसलों से भरा होगा। एक comparison ग़लत हुआ तो मुफ़्त मिठाई बँट सकती है – या असली customers रुक सकते हैं।
Arithmetic और assignment
JavaScript
const kg = 7, pricePerKg = 500;
console.log('Total:', kg * pricePerKg);
console.log('Boxes of 2 kg:', Math.floor(kg / 2), 'remaining kg:', kg % 2); // % = remainder
console.log('Square:', 3 ** 2); // power
let points = 100;
points += 50; // points = points + 50
points -= 20;
points *= 2;
points++; // +1
console.log('Loyalty points:', points);Total: 3500
Boxes of 2 kg: 3 remaining kg: 1
Square: 9
Loyalty points: 261
Comparison: हमेशा === लें
JavaScript
console.log(5 === 5, 5 === '5'); // strict: value AND type console.log(5 == '5', 0 == ''); // loose: converts types first – surprises! console.log(null == undefined, null === undefined); console.log(1500 >= 1500, 'apple' < 'banana', 5 !== '5');
true false
true true
true false
true true true
⚠️ == का जाल
0 == "" और "1" == 1 true हैं क्योंकि == types बदलता है। if (code == 0) जैसी coupon जाँच ख़ाली string स्वीकार कर सकती है। हर जगह === और !== लें; input पहले Number() से बदलें।
Logical operators और truthy / falsy
JavaScript
const total = 1800, isMember = false, city = 'Jaipur'; console.log(total >= 1500 && city === 'Jaipur'); // AND – both must be true console.log(isMember || total > 2000); // OR – at least one console.log(!isMember); // NOT // Falsy values: false, 0, '', null, undefined, NaN – everything else is truthy const note = ''; console.log(note || 'No message'); // fallback for empty values const qty = 0; console.log(qty || 1, qty ?? 1); // ?? only replaces null/undefined
true
false
true
No message
1 0
| Operator | मतलब | कब |
|---|---|---|
| && | दोनों true | सब नियम पास हों (age ≥ 18 && ID है) |
| || | कम से कम एक true / पहली truthy value | कोई नियम पास, या ख़ाली text का default |
| ! | उल्टा | if (!isLoggedIn) |
| ?? | पहली value जो null/undefined न हो | Defaults जहाँ 0 या "" सही values हैं |
| ?. | null/undefined हो तो रुको | user?.address?.city – data न हो तो crash नहीं |
if, else if, else
JavaScript
function deliveryCharge(total, distanceKm) {
if (total >= 1500) {
return 0; // free delivery
} else if (distanceKm <= 5) {
return 40;
} else if (distanceKm <= 15) {
return 80;
} else {
return -1; // we do not deliver that far
}
}
console.log(deliveryCharge(1800, 20));
console.log(deliveryCharge(600, 3));
console.log(deliveryCharge(600, 12));
console.log(deliveryCharge(600, 30));0
40
80
-1
💡 क्रम ज़रूरी है
Conditions ऊपर से नीचे जाँची जाती हैं और पहली true जीतती है। सबसे ख़ास या ज़रूरी नियम पहले रखें – यहाँ “₹1,500 से ऊपर मुफ़्त” हर दूरी नियम को हराता है।
switch और ternary operator
JavaScript
const day = 'Mon';
switch (day) {
case 'Sat':
case 'Sun':
console.log('Weekend: open 8 am – 11 pm');
break;
case 'Mon':
console.log('Closed for cleaning 🧹');
break;
default:
console.log('Open 8 am – 10 pm');
}
const stock = 0;
const label = stock > 0 ? 'In stock' : 'Out of stock'; // condition ? yes : no
console.log(label);
const user = { name: 'Aarti' };
console.log(user.address?.city ?? 'City not added');Closed for cleaning 🧹
Out of stock
City not added
असली task: grade और discount calculator
HTML + JavaScript
<label>Order total ₹ <input id="t" type="number" value="2400"></label>
<label><input id="m" type="checkbox"> Member</label>
<button id="go">Check offer</button>
<p id="out"></p>
<script>
document.querySelector('#go').addEventListener('click', function () {
const total = Number(document.querySelector('#t').value);
const member = document.querySelector('#m').checked;
let discount = 0;
if (total >= 5000) discount = 0.15;
else if (total >= 2000) discount = 0.10;
else if (member) discount = 0.05;
const pay = total - total * discount;
const delivery = pay >= 1500 ? 0 : 60;
document.querySelector('#out').textContent =
`Discount ${discount * 100}% → pay ₹${pay + delivery} (delivery ₹${delivery})`;
});
</script>🏅 आज के Job Skills
✔ Arithmetic और assignment operators✔ === और !== से सुरक्षित तुलना✔ &&, ||, !, ?? और ?. से नियम जोड़ना✔ if/else, switch और ternary फ़ैसले लिखना
Practice tasks
🏋️ Practice – ख़ुद करें
Task 1: grade(marks) function लिखें जो A+ (≥ 90), A (≥ 75), B (≥ 60), C (≥ 33) या Fail लौटाए। 95, 76, 61, 40, 20 से जाँचें।
Solution देखें
JavaScript
function grade(marks) {
if (marks >= 90) return 'A+';
if (marks >= 75) return 'A';
if (marks >= 60) return 'B';
if (marks >= 33) return 'C';
return 'Fail';
}
for (const m of [95, 76, 61, 40, 20]) console.log(m, grade(m));95 A+
76 A
61 B
40 C
20 Fail
Task 2: Leap year 4 से विभाज्य होता है, सदियों को छोड़कर, जब तक 400 से विभाज्य न हो। && और || से isLeap(year) लिखें।
Solution देखें
JavaScript
function isLeap(y) {
return (y % 4 === 0 && y % 100 !== 0) || y % 400 === 0;
}
console.log(2024, isLeap(2024), 1900, isLeap(1900), 2000, isLeap(2000), 2026, isLeap(2026));2024 true 1900 false 2000 true 2026 false
Task 3: switch से किसी भी weekday नाम के लिए दुकान का समय print करें।
Quick quiz
🧠 Quick Quiz – ख़ुद को जाँचें
1. 5 === '5' है…
अलग types।
2. 17 % 5 बराबर…
शेषफल।
3. कौन सी value truthy है?
ख़ाली नहीं वाली string।
4. 0 ?? 10 देता है…
?? 0 रखता है।
5. break के बिना switch case…
Fall-through।
Interview corner
💼 Interview Corner
== बनाम ===?
=== बिना बदले value और type दोनों तुलना करता है; == पहले types बदलता है, जिससे 0 == "" true जैसे आश्चर्य होते हैं। === लें, सिवाय जानबूझकर x == null जाँच के जो null और undefined दोनों से मेल खाती है।
|| और ?? में क्या फ़र्क?
|| किसी भी falsy बाईं value (0, "", false, NaN, null, undefined) पर दायाँ पक्ष लौटाता है; ?? सिर्फ़ null या undefined पर। जब 0 या ख़ाली string सही values हों तो ?? लें।
सारांश
- % शेषफल, ** घात, += updates छोटे करता है।
- हमेशा === / !==।
- Falsy: false, 0, "", null, undefined, NaN; ?? और ?. ग़ायब data संभालते हैं।
- Ranges के लिए if/else, fixed values के लिए switch, दो नतीजों के लिए ternary।
➡️ आगे
Day 4: loops – काम अपने-आप दोहराएँ: पहाड़े, कई items के bills और attendance reports।
अक्सर पूछे जाने वाले प्रश्न (FAQ)
if की जगह switch कब?
जब एक value को कई fixed विकल्पों से मिलाना हो (दिन, status codes, menu choices)। Ranges (marks ≥ 90) के लिए if/else।
क्या ternary operators nest कर सकते हैं?
कर सकते हैं, पर जल्द पढ़ने लायक नहीं रहता। दो से ज़्यादा नतीजों के लिए if/else लें।
