पाठ 22, कुल 30 में

JavaScript While Loop — जब तक वाला लूप

6 मिनट पढ़ें · मुफ़्त · बिना लॉगिन

English हिंदी

JavaScript For Loop — गिनती वाला लूप JavaScript Type Conversion — एक type से दूसरा type

for लूप तब के लिए है, जब आप जानते हैं कि कितनी बार दोहराना है — पाँच छात्र, दस कप, सौ लाइनें। पर कभी-कभी संख्या पहले से पता नहीं होती। एक छात्र तब तक number अनुमान लगाता रहता है, जब तक वह सही न हो जाए। Login form तब तक password माँगता रहता है, जब तक वह सही न हो। खेल तब तक चलता रहता है, जब तक कोई जीत न जाए। इसके लिए while लूप इस्तेमाल होता है: यह तब तक दोहराता है जब तक शर्त सही है, और जैसे ही शर्त गलत होती है, रुक जाता है।

Diagram — देखें, यह सब कैसे जुड़ता है

नल से बाल्टी भरने की तरह सोचिए। आप पहले से सेकंड नहीं गिनते — आप नल तब तक खुला रखते हैं जब तक बाल्टी भरी नहीं होती, और भरते ही बंद कर देते हैं। while लूप वही idea है: शर्त सही रहने तक चलते रहिए, गलत होते ही रुक जाइए।

ऐसे याद रखिए: for गिनता है, while इंतज़ार करता है — break बाहर निकलता है, continue छोड़ता है।

while — जब तक शर्त सही है, दोहराइए

while लूप के कोष्ठकों में सिर्फ एक हिस्सा होता है: शर्त। हर round से पहले कंप्यूटर उसे जाँचता है। सही का मतलब है block फिर से चलाइए; गलत का मतलब है रुक जाइए।

let cups = 0;
while (cups < 5) {
  cups = cups + 1;
  console.log("Cup " + cups + " poured");
}
// Cup 1 poured, Cup 2 poured, ... Cup 5 poured

ध्यान दीजिए, for लूप से फर्क यह है: counter लूप के बाहर रहता है, और कदम (cups = cups + 1) block के अंदर रहता है। आप counter खुद सँभालते हैं। यही while को लचीला बनाता है — शर्त कुछ भी हो सकती है, सिर्फ गिनती नहीं: 'जब तक password गलत है', 'जब तक खिलाड़ी के पास जान बची है', 'जब तक total 100 से कम है'।

Note: while लूप की सबसे खतरनाक गलती है कदम भूल जाना। अगर block के अंदर कुछ भी शर्त को नहीं बदलता, तो वह हमेशा सही रहती है और लूप कभी खत्म नहीं होता — infinite loop। Browser का tab रुक जाता है और उसे बंद करना पड़ता है। आपके हर while लूप के अंदर एक लाइन होनी चाहिए, जो शर्त को गलत की ओर ले जाए।

do...while — पहले चलाइए, फिर जाँचिए

सादा while लूप पहले round से पहले शर्त जाँचता है। अगर शर्त पहले से ही गलत है, तो block एक बार भी नहीं चलता — एक बार भी नहीं। do...while लूप इसे पलट देता है: वह पहले block चलाता है, फिर जाँचता है। इसलिए block कम से कम एक बार हमेशा चलता है, चाहे शर्त शुरू से गलत ही क्यों न हो।

let number = 10;
do {
  console.log("Number is " + number);
  number = number + 1;
} while (number < 5);
// "Number is 10" — printed once, even though 10 is not less than 5

यह कब काम आता है? किसी भी काम के लिए जो कम से कम एक बार करना ही है: मेनू दिखाना, password माँगना, पासा फेंकना। आप हमेशा एक बार पूछते हैं, और उसके बाद ही तय करते हैं कि फिर पूछना है या नहीं। ध्यान दीजिए, while (number < 5); के बाद semicolon है — do...while इकलौता लूप है जो semicolon पर खत्म होता है।

break — लूप से जल्दी बाहर निकलिए

कभी-कभी आप वह चीज़ पा लेते हैं जो आप ढूँढ रहे थे, लूप के अपने आप खत्म होने से पहले। break सीधे लूप से बाहर कूद जाता है, बाकी सब कुछ छोड़कर — बचे हुए rounds और मौजूदा round का बाकी हिस्सा।

let marks = [45, 82, 30, 91, 67];
let i = 0;
while (i < marks.length) {
  if (marks[i] === 30) {
    console.log("Found the fail mark at position " + i);
    break;
  }
  i++;
}
// "Found the fail mark at position 2" — the loop stops early

break के बिना लूप पाँचों अंक जाँचता। उसके साथ, खोज उसी पल रुक जाती है जिस पल जवाब मिलता है। break का यही काम है: 'मिल गया, अब रुक सकता हूँ।'

continue — यह round छोड़िए, आगे बढ़िए

continue, break का उल्टा है। यह लूप नहीं छोड़ता — यह मौजूदा round का बाकी हिस्सा छोड़कर अगले round पर चला जाता है। इसका मतलब है 'इसे छोड़िए, पर चलते रहिए'।

let marks = [45, 82, 30, 91, 67];
for (let i = 0; i < marks.length; i++) {
  if (marks[i] < 40) {
    continue;
  }
  console.log(marks[i] + " passed");
}
// 45 passed, 82 passed, 91 passed, 67 passed — the 30 is skipped

30 test में fail होता है, इसलिए continue उसकी print लाइन छोड़कर अगले अंक पर चला जाता है। लूप खुद चलता रहता है। एक चेतावनी: while लूप में कदम continue से पहले रखिए — नहीं तो counter कभी आगे नहीं बढ़ेगा और लूप हमेशा घूमता रहेगा।

Tip: break और continue for लूप और while लूप दोनों में काम करते हैं। लूप चुनते समय एक सवाल पूछिए: 'क्या मुझे पता है कितनी बार?' अगर हाँ, तो for इस्तेमाल कीजिए। अगर नहीं, तो while इस्तेमाल कीजिए। अगर जवाब है 'कम से कम एक बार, शायद ज़्यादा', तो do...while इस्तेमाल कीजिए।

आम गलतियाँ

while लूप के अंदर कदम भूल जाना — शर्त कभी बदलती नहीं, लूप कभी खत्म नहीं होता, और browser का tab रुक जाता है।
while लूप में continue को कदम से पहले रखना — counter कभी आगे नहीं बढ़ता, इसलिए लूप हमेशा घूमता रहता है। कदम पहले रखिए।
continue की जगह break इस्तेमाल करना — break लूप को पूरी तरह छोड़ देता है, continue सिर्फ एक round छोड़ता है।
do...while लूप में while (...); के बाद semicolon भूल जाना — यह इकलौता लूप है जो semicolon पर खत्म होता है।
सादे while लूप में ऐसी शर्त लिखना जो कभी सही नहीं होती, और उम्मीद करना कि block एक बार चलेगा — वह शून्य बार चलता है। एक बार चलाने के लिए do...while है।

याद रखें

for गिनता है, while इंतज़ार करता है — break बाहर निकलता है, continue छोड़ता है।
while हर round से पहले जाँचता है; do...while पहले एक बार चलाता है और बाद में जाँचता है।
हर while लूप के अंदर एक कदम होना चाहिए, जो शर्त को गलत की ओर ले जाए।
break लूप छोड़ देता है; continue एक round छोड़ता है और आगे बढ़ता है।

उदाहरण समझिए

let target = 7; — वह number जिसका छात्र को अनुमान लगाना है, जैसे lucky-draw number।
let guess = 0; — मौजूदा अनुमान, 0 से शुरू ताकि लूप पक्का चले।
while (guess !== target) — लूप तब तक चलता है जब तक अनुमान 7 नहीं होता। जैसे ही वह 7 बनता है, लूप रुक जाता है।
guess = guess + 1; — कदम: हर round में अनुमान target के एक करीब जाता है, इसलिए लूप पक्का खत्म होता है।
document.getElementById("result").innerHTML = ... — button दबाने पर कितनी कोशिशें लगीं, यह पेज पर लिखा जाता है।

उदाहरण

Example

<!DOCTYPE html>
<html>
<head>
<title>Guessing Game — JavaScript While Loop</title>
<style>
body { font-family: Verdana, sans-serif; padding: 20px; }
h1 { color: #1e3a5f; }
button { background-color: #e13611; color: white; border: none; padding: 10px 18px; font-size: 16px; cursor: pointer; }
p { font-size: 18px; }
.result { background-color: #f1f5f9; padding: 12px; }
</style>
</head>
<body>

<h1>Guessing Game</h1>
<p>The lucky number is 7. The computer guesses 1, 2, 3... until it finds it.</p>
<button onclick="playGame()">Play the Game</button>
<p class="result" id="result">Click the button to start guessing.</p>

<script>
function playGame() {
  let target = 7;
  let guess = 0;
  let tries = 0;
  while (guess !== target) {
    guess = guess + 1;
    tries = tries + 1;
  }
  document.getElementById("result").innerHTML =
    "Found it! The lucky number is " + guess +
    "<br>Tries taken: " + tries;
}
</script>

</body>
</html>

परिणाम

परिणाम — ब्राउज़र में यह कैसा दिखता है

खुद करके देखें — लाइव एडिटर

नीचे दिया गया कोड बदलें और चलाएँ दबाएँ — परिणाम तुरंत दिखेगा। कोई फाइल सहेजनी नहीं है, कोई लॉगिन नहीं चाहिए।

पूरे एडिटर में खोलें

परिणाम

खुद क्यों सीखें — AI से पूछने के बजाय?

AI आपके लिए कोड लिख सकता है, लेकिन वह आपके लिए सोच नहीं सकता। जब आप HTML खुद सीखते हैं, तो आपका दिमाग असली कौशल बनाता है: आप समझते हैं कि पेज ऐसा क्यों दिखता है, टूटने पर उसे ठीक कर सकते हैं, और परीक्षा या इंटरव्यू में बिना मदद के जवाब दे सकते हैं। यही कौशल नौकरी दिलाता है — कॉपी किया हुआ जवाब नहीं।