for / in 문은 일반적인 for 문과는 전혀 다른 형태의 반복문이다.
for / in 문은 해당 객체의 모든 열거할 수 있는 프로퍼티(enumerable properties)를 순회할 수 있도록 해준다.
💡 열거할 수 있는 프로퍼티란 내부적으로 enumerable 플래그가 true로 설정된 프로퍼티를 의미한다. 이러한 프로퍼티들은 for/in 문으로 접근할 수 있게 된다.
이 반복문은 루프마다 객체의 열거할 수 있는 프로퍼티의 이름을 지정된 변수에 대입한다.
이렇게 대입받은 변수를 이용하면 루프 안에서 객체의 열거할 수 있는 프로퍼티에 순차적으로 접근할 수 있다.
for / in 문의 문법은 다음과 같다.
문법
for (변수 in 객체) {
객체의 모든 열거할 수 있는 프로퍼티의 개수만큼 반복적으로 실행하고자 하는 실행문;
}
다음 예제는 for / in 문을 사용하여 배열의 요소에 접근하는 예제이다.
🔔 예제)
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>JavaScript Iteration Statement</title>
</head>
<body>
<h1>for / in 문</h1>
<script>
var arr = [3, 4, 5];
for (var i = 0; i < arr.length; i++) { // 배열 arr의 모든 요소의 인덱스(index)를 출력함.
document.write(i + " ");
}
document.write("<br>");
for (var i in arr) { // 위와 같은 동작을 하는 for / in 문
document.write(i + " ");
}
</script>
</body>
</html>
실행 결과
다음 예제는 for/in 문을 사용하여 객체의 프로퍼티에 접근하는 예제이다.
🔔 예제)
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>JavaScript Iteration Statement</title>
</head>
<body>
<h1>for / in 문</h1>
<script>
var obj = {
name : "이순신",
age : 20
};
for (var i in obj) {
document.write(i + "<br>");
}
</script>
</body>
</html>
실행 결과
💡 for/in 문은 해당 객체가 가진 모든 프로퍼티를 반환하는 것이 아닌, 오직 열거할 수 있는 프로퍼티만을 반환한다.
for / of 문은 반복할 수 있는 객체(iterable objects)를 순회할 수 있도록 해주는 반복문이다.
자바스크립트에서 반복할 수 있는 객체에는 Array, Map, Set, arguments 객체 등이 있다.
이 반복문은 루프마다 객체의 열거할 수 있는 프로퍼티의 값을 지정된 변수에 대입한다.
for / of 문의 문법은 다음과 같다.
문법
for (변수 of 객체) {
객체의 모든 열거할 수 있는 프로퍼티의 개수 만큼 반복적으로 실행하고자 하는 실행문;
}
다음 예제는 for / of 문을 사용하여 배열의 요소에 접근하는 예제이다.
🔔 예제)
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>JavaScript Iteration Statement</title>
</head>
<body>
<h1>for / of 문</h1>
<script>
var arr = [3, 4, 5];
for (var i = 0; i < arr.length; i++) { // 배열 arr의 모든 요소의 인덱스(index)를 출력함.
document.write(arr[i] + " ");
}
document.write("<br>");
for (var value of arr) { // 위와 같은 동작을 하는 for / of 문
document.write(value + " ");
}
</script>
</body>
</html>
실행 결과
다음 예제는 for / of 문을 사용하여 Set 객체의 프로퍼티에 접근하는 예제이다.
<!DOCTYPE html><html lang="ko">
<head>
<meta charset="UTF-8">
<title>JavaScript Iteration Statement</title>
</head>
<body>
<h1>for / of 문</h1>
<script>
var arr = new Set([1, 1, 2, 2, 3, 3]);
for (var value of arr) {
document.write(value + " ");
}
</script>
</body>
</html>
실행 결과
<일반적으로 표현식의 검사를 통해 루프로 진입하면, 다음 표현식을 검사하기 전까지 루프 안에 있는 모든 실행문을 실행한다.
하지만 continue 문과 break 문은 이러한 일반적인 루프의 흐름을 사용자가 직접 제어할 수 있게 해준다.
label 문을 사용하면 continue 문과 break 문의 동작이 프로그램의 흐름을 특정 영역으로 이동시킬 수 있다.
label 문은 프로그램 내의 특정 영역을 식별할 수 있도록 해주는 식별자이다.
label 문을 사용하면 continue 문과 break 문의 동작이 프로그램의 흐름을 특정 영역으로 이동시킬 수 있다.
label 문의 문법은 다음과 같다.
문법
label :
식별하고자 하는 특정 영역
다음 예제에서 라벨인 arrIndex는 그 이후에 나오는 for 문 전체를 가리키는 식별자로 사용되고 있다.
🔔 예제)
arrIndex:
for (var i in arr) {
document.write(i);
}| [JavaScript] 함수 (0) | 2018.10.16 |
|---|---|
| [JavaScript] 배열의 기초 (0) | 2018.10.16 |
| [JavaScript] 기타 연산자 (0) | 2018.10.15 |
| [JavaScript] 변수/연산자 우선순위/비교 연산자 (0) | 2018.10.15 |
| [JavaScript] 타입 변환 (0) | 2018.10.15 |