Loops
Test Your Knowledge #2
Modify your results from previous Test Your Knowledge (or create a copy of previous version) and implement the following functionality.
Requirement :
1. Display an error message to the console if the user input is not a valid number.
let billTotal = prompt("Please enter the total bill : ");
billTotal = parseFloat(billTotal);
if (isNaN(billTotal)) {
console.error("Error: Please enter the number");
} else {
const tip = 0.1;
let tipTotal = billTotal * tip;
console.log(`For bill of ${billTotal} the tip should be ${tipTotal}`);
}
8.5.1 While and do...while Loops

- One must be sure that the variables that make up the condition are updated inside the loop (or elsewhere) to avoid an infinite loop!
8.5.2 For Loops

- For loops combine the common components of a loop—initialization, condition, and postloop operation—into one statement.
- for...in vs for...of
- for...in 루프: 객체의 열거 가능한 속성(enumerable properties)을 반복할 때 사용됩니다. 객체의 속성 이름(key)을 반복하는데 유용합니다.
let obj = { a: 1, b: 2, c: 3 };
for (let key in obj) {
console.log(key); // "a", "b", "c" 출력
}
- for...of 루프: ES6부터 도입된 반복문으로, 반복 가능한(iterable) 객체(예: 배열, 문자열, Map, Set 등)를 순회할 때 사용됩니다. 각 요소의 값을 반복합니다.
let arr = [10, 20, 30];
for (let value of arr) {
console.log(value); // 10, 20, 30 출력
}
8.5.3. infinite loops
1. 무한 루프란?
- 무한 루프(Infinite loop): 반복문이 종료되지 않고 계속해서 실행되는 상황을 의미.
- 주로 while 또는 for 반복문에서 발생.
- 조건이 항상 참(true)으로 평가될 때 발생하며, 종료 조건을 만족하지 못하는 경우가 원인.
2. 무한 루프의 결과
- 자바스크립트는 클라이언트 측에서 실행되기 때문에, 무한 루프가 발생하면 사용자의 브라우저가 멈춘 것처럼 보일 수 있음.
- 브라우저가 멈추는 현상: 스크립트가 끝없이 실행되면 브라우저가 중단되거나 응답하지 않는 것처럼 보임. 이를 사용자는 "브라우저가 멈췄다"라고 인식할 수 있음.
3. 브라우저의 대처 방식
- 경고 메시지: 스크립트가 너무 오래 실행되면, 브라우저는 사용자가 직접 중지할 수 있도록 경고 메시지를 표시할 수 있음.
- 스크립트 강제 종료: 일부 브라우저는 특정 시간이 지나도 스크립트가 끝나지 않으면, 스크립트를 자동으로 종료하여 무한 루프 문제를 해결하려고 시도함.
4. 무한 루프 예시 (문제 발생 코드)
let count = 0;
while (count < 5) {
console.log("이 코드는 끝나지 않습니다.");
}
- 이 코드에서는 count가 증가하지 않기 때문에, 조건인 count < 5가 항상 참으로 남아 무한 루프에 빠짐.
5. 무한 루프 방지 방법
- 루프 제어 변수 업데이트: 루프 내부에서 제어 변수를 적절하게 업데이트해야 함.
- 종료 조건 설정: 반복문이 적절한 시점에서 종료될 수 있는 조건을 명확히 설정해야 함.
6. 올바른 루프 예시
let count = 0;
while (count < 5) {
console.log("Count is: " + count);
count++;
}
- count++로 제어 변수를 매 반복마다 업데이트하여, 일정 시점에서 종료 조건을 만족시킴.
- 이 코드는 count가 5가 되면 반복이 종료되므로, 무한 루프가 발생하지 않음.
8.5.4. Errors Using Try and Catch
- 자바스크립트는 런타임 오류를 만나면 예외를 발생시킵니다.
- try...catch 블록을 사용하면 이러한 예외를 처리하여 프로그램의 중단을 방지할 수 있습니다.
- try 안에서 오류가 발생하면 catch 블록에서 오류를 처리하여, 프로그램이 안전하게 계속 실행될 수 있게 합니다.
try {
nonexistantfunction("hello");
}
catch(err) {
alert ("An exception was caught:" + err);
}
- try...catch는 자바스크립트 내장 오류만 처리하는 데 사용되는 것이 아니라, 개발자가 직접 사용자 정의 오류를 던지고 처리할 때도 사용할 수 있습니다.
if (x<0) {
throw "smallerthan0Error";
}