JavaScript for 문

for문장이 루프를 생성하며, 조건(condition)의 계산 결과가 true로 평가되면 지정된 문장을 실행합니다.

단지조건(condition)false로 바뀌면 루프가 멈춥니다.

JavaScript는 다음과 같은 몇 가지 루프를 제공합니다:

for -코드 블록을 여러 번 순회적으로 탐색합니다
for...in-객체의 속성을 순회적으로 탐색합니다
while-지정된 조건이 true인 경우, 코드 블록을 순회적으로 탐색합니다
do...while -do...while

루프를 한 번만 실행한 후에 지정된 조건이 true일 때까지 반복합니다break루프를 종료하고 다음 값을 사용하여 현재 루프를 종료합니다.continue루프 중의 값을 건너뜁니다.

문법:

for (initialization; condition; final-표현식) {
　//실행할 문장
　}

예제

for (let n = 0; n <　5; n++) {
document.write("<br>The number is "　+　n);
}

테스트해보기‹/›

브라우저 호환성

모든 브라우저는 for 문을 완전히 지원합니다:

문장
for	는	는	는	는	는

매개변수 값

매개변수	설명
초기화	（ 선택 사항 ） 루프가 시작하기 전에 실행되는 것입니다. 일반적으로 이 문장은 카운터 변수를 초기화하기 위해 사용됩니다. 여러 값을 시작하려면 각 값을 콤마로 구분합니다.
조건	（ 선택 사항 ） 루프가 실행되기 전에 정의되는 조건입니다. 일반적으로 이 문장은 카운터 변수의 조건을 평가하기 위해 사용됩니다. 반환된 값이 true라면 루프가 다시 시작됩니다; 반환된 값이 false라면 루프가 종료됩니다. 주의: 생략된 경우, 조건은 항상 true입니다. 이는 브라우저가 쓰러질 수 있습니다.
최종-표현식	（ 선택 사항 ） 루프가 실행된 후에 실행됩니다. 일반적으로 이 문장은 카운터 변수를 증가시키거나 감소시키기 위해 사용됩니다.

기술 세부 사항

JavaScript 버전:	ECMAScript 1

더 많은 예제

배열을 오름차순으로 순회합니다:

예제

var fruits = ["39;Apple', &39;Mango', &39;Banana', &39;Orange'];
var txt = '';
for (var i = 0; i < fruits.length;++) {
txt　+= fruits[i]　+　"<br>";
}

테스트해보기‹/›

배열을 내림차순으로 순회합니다:

예제

var fruits = ["39;Apple', &39;Mango', &39;Banana', &39;Orange'];
var txt = '';
for (var i = fruits.length　-1; i >= 0; i--) {
txt　+= fruits[i]　+　"<br>";
}

테스트해보기‹/›

NodeList 객체의 노드를 순회하며 목록에 있는 모든 요소의 배경색을 변경합니다:

예제

var x = document.querySelectorAll(".demo");
for (let i = 0; i < x.length;++) {
x[i].style.backgroundColor = "coral";
}

테스트해보기‹/›

내장 루프는 대부분의 곳에서 사용됩니다. 그것은 행렬 곱셈, 테이블 표시 및 다른 많은 곳에서 사용됩니다:

예제

var txt = "";
for (var row = 0; row <　10; row++) {
　　　for (var col = 0; col < row;++) {
　　　txt　+= ""　*　";
　　　}
　　　txt　+= "<br>";
}

테스트해보기‹/›

다음 함수는 break 문장을 가지고 있으며, i가3일 때, 루프를 종료합니다:

예제

var text = "";
for (let i = 0; i <　6; i++) {
if (i ===　3) {
　　　break;
}
text　+= "The number is "　+　i　+　"<br>";
}

테스트해보기‹/›

다음 예제는 for 루프가 continue 문장을 가지고 있음을 보여줍니다. 이 문장은 i의 값이3시행됩니다:

예제

var text = "";
for (let i = 0; i <　6; i++) {
if (i ===　3) {
　　　continue;
}
text　+= "The number is "　+　i　+　"<br>";
}

테스트해보기‹/›

JavaScript 객체

JavaScript 참조 매뉴얼

JS DOM 참조 매뉴얼

JavaScript for 문

문법:

브라우저 호환성

매개변수 값

기술 세부 사항

더 많은 예제

관련 참조