- JavaScript Basics
- JavaScript Tutorial
- JavaScript: where to write
- JavaScript: how to display
- JavaScript: keywords
- JavaScript: comments
- JavaScript: variables
- JavaScript: operators
- JavaScript: data types
- JavaScript Conditional Statements
- JavaScript: if-else
- JavaScript: switch
- JavaScript: for loop
- JavaScript: while loop
- JavaScript: do-while loop
- JavaScript: break and continue
- JavaScript Popup Boxes
- JavaScript: alert box
- JavaScript: confirm box
- JavaScript: prompt box
- JavaScript Popular Topics
- JavaScript: functions
- JavaScript: innerHTML
- JavaScript: getElementById()
- JavaScript: getElementsByClassName()
- JavaScript: getElementsByName()
- JavaScript: getElementsByTagName()
- JavaScript: querySelector()
- JavaScript: querySelectorAll()
- JavaScript: document.write()
- JavaScript: console.log()
- JavaScript: boolean
- JavaScript: events
- JavaScript: Math object
- JavaScript: Math.random()
- JavaScript: Number()
- JavaScript: parseInt()
- JavaScript: parseFloat()
- JavaScript Arrays
- JavaScript: array
- JavaScript: find length of array
- JavaScript: add element at beginning
- JavaScript: add element at end
- JavaScript: remove first element
- JavaScript: remove last element
- JavaScript: get first index
- JavaScript: get last index
- JavaScript: reverse an array
- JavaScript: sort an array
- JavaScript: concatenate arrays
- JavaScript: join()
- JavaScript: toString()
- JavaScript: from()
- JavaScript: check if value exists
- JavaScript: check if array
- JavaScript: slice an array
- JavaScript: splice()
- JavaScript: find()
- JavaScript: findIndex()
- JavaScript: entries()
- JavaScript: every()
- JavaScript: fill()
- JavaScript: filter()
- JavaScript: forEach()
- JavaScript: map()
- JavaScript Strings
- JavaScript: string
- JavaScript: length of string
- JavaScript: convert to lowercase
- JavaScript: convert to uppercase
- JavaScript: string concatenation
- JavaScript: search()
- JavaScript: indexOf()
- JavaScript: search() vs. indexOf()
- JavaScript: match()
- JavaScript: match() vs. search()
- JavaScript: replace()
- JavaScript: toString()
- JavaScript: String()
- JavaScript: includes()
- JavaScript: substr()
- JavaScript: slice string
- JavaScript: charAt()
- JavaScript: repeat()
- JavaScript: split()
- JavaScript: charCodeAt()
- JavaScript: fromCharCode()
- JavaScript: startsWith()
- JavaScript: endsWith()
- JavaScript: trim()
- JavaScript: lastIndexOf()
- JavaScript Date and Time
- JavaScript: date and time
- JavaScript: Date()
- JavaScript: getFullYear()
- JavaScript: getMonth()
- JavaScript: getDate()
- JavaScript: getDay()
- JavaScript: getHours()
- JavaScript: getMinutes()
- JavaScript: getSeconds()
- JavaScript: getMilliseconds()
- JavaScript: getTime()
- JavaScript: getUTCFullYear()
- JavaScript: getUTCMonth()
- JavaScript: getUTCDate()
- JavaScript: getUTCDay()
- JavaScript: getUTCHours()
- JavaScript: getUTCMinutes()
- JavaScript: getUTCSeconds()
- JavaScript: getUTCMilliseconds()
- JavaScript: toDateString()
- JavaScript: toLocaleDateString()
- JavaScript: toLocaleTimeString()
- JavaScript: toLocaleString()
- JavaScript: toUTCString()
- JavaScript: getTimezoneOffset()
- JavaScript: toISOString()
- JavaScript Regular Expression
- JavaScript: regular expression
- JavaScript: RegEx . (dot)
- JavaScript: RegEx \w and \W
- JavaScript: RegEx \d and \D
- JavaScript: RegEx \s and \S
- JavaScript: RegEx \b and \B
- JavaScript: RegEx \0
- JavaScript: RegEx \n
- JavaScript: RegEx \xxx
- JavaScript: RegEx \xdd
- JavaScript: RegEx quantifiers
- JavaScript: RegEx test()
- JavaScript: RegEx lastIndex
- JavaScript: RegEx source
- JavaScript Programs
- JavaScript Programs
while loop in JavaScript with examples
Are you tired of writing code that executes repeatedly until a certain condition is met? Look no further because the JavaScript "while" loop is here to save the day! The while loop is a must-know tool for any aspiring JavaScript developer due to its simple syntax and powerful functionality.
The while loop in JavaScript is used to continue executing some blocks of code until the given condition evaluates to be false.
JavaScript while loop syntax
The syntax of the while loop in JavaScript is:
while(condition) {
// body of the loop
}
Whatever block of code is written as the body of the loop, it will continue its execution again and again until the specified "condition" evaluates to false.
Note: Do not forget to update the loop variable. Otherwise, the loop may go for infinite execution.
JavaScript while loop example
Consider the following code as an example demonstrating the use of the "while" loop in the JavaScript language:
<!DOCTYPE html> <html> <body> <script> let num = 5, i = 1; while(i<=10) { console.log(num*i); i++; } </script> </body> </html>
The snapshot given below shows the sample output produced by the above JavaScript example:
The dry run of the following JavaScript code from the above example is:
let num = 5, i = 1; while(i<=10) { console.log(num*i); i++; }
goes like this:
- Using the first statement, the value 5 will be initialized to num, and 1 will be initialized to i.
- Therefore num=5 and i=1.
- Now the condition of the while loop will be executed. That is, i<=10 or 1<=10 evaluates to true. Therefore, program flow goes inside the loop.
- And the value of num*i, that is, 5*1 or 5 will be printed on the console using the console.log() statement.
- Now the value of i will be incremented by 1 using the last statement. So i=2 now.
- Continue the same process from step no. 3 to step no. 5. This process continues until the condition of the while loop evaluates to false.
Before closing the discussion on the "while" loop, I'm willing to include one more example similar to the previous one, but I'm going to use proper comments to explain the code.
// Set a starting value for the counter variable let counter = 1; // While the counter is less than or equal to 5 while (counter <= 5) { // Print the value of the counter console.log(counter); // Increment the counter by 1 counter++; }
1 2 3 4 5
Advantages of the "while" loop in JavaScript
- The while loop can be used to repeatedly run a block of code as long as a specific condition is met in a variety of contexts. Because of this, it can be used for a variety of programming tasks.
- Even novice programmers can easily understand the while loop's usage.
- Because the while loop only checks the condition once per iteration, it may occasionally be more effective than other loop types (such as for loops).
Disadvantages of the "while" loop in JavaScript
- If you forget to properly update the loop condition in a while loop, you may unintentionally create an infinite loop. Your program may hang or crash as a result of this.
- If the condition is complicated or if there are several conditions to check, while loops may result in overly complicated code.
« Previous Tutorial Next Tutorial »