기록 ＞ 기억
[JavaScript] 제어문 ② 반복문 (for, while, do while, for in, for of) 본문
반복문
● for 문
/* for(변수 초기값; 조건식; 변수 증감식) {} */
for(let i=0; i<=10; i++) {
/* 반복 처리 로직 작성 */
}
/* for문 처리 순서 */
①. 변수 초기화
②. 조건식 확인
③. 조건식 true 면 반복로직 실행
④. 변수 증가 (또는 감소)
⑤. ② ~ ④ 반복하다 조건식 false 면 for문 빠져나옴<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>gugudan</title>
<style>
textarea {
text-align: center;
padding-top: 30px;
margin-top: 10px;
background-color: teal;
color: white;
font-size: large;
font-weight: bold;
resize: none;
}
</style>
</head>
<body>
<form name="frmGugudan" method="post" action="#">
<label>단수</label>
<input type="text" value="5" name="dan">
<input type="button" value="실행" name="btn"><br/>
<textarea name="result" rows="20" cols="40" readonly></textarea>
</form>
<script>
let frm = document.frmGugudan;
frm.btn.onclick = function() {
let dan = Number(frm.dan.value);
let str = "";
for(let i=1; i<=9; i++) {
str += dan + " * " + i + " = " + (dan * i) + "\n\n";
}
frm.result.value = str;
}
</script>
</body>
</html>
● while 문
/* 변수 초기화; while(조건식) { 반복로직; 증감식; } */
let i = 1;
let sum = 0;
while(i<=10) {
sum += i; /* 조건이 true 면 반복처리 되는 로직 */
i++; /* 증감 */
}
/* while 문 처리 순서 */
①. 변수 초기화
②. 조건식 확인
③. 조건식 true 면 반복로직 실행 → 조건식 false 면 한번도 실행안 될 수 있음!!!!!
④. 변수 증가 (또는 감소) → 안해주면 무한 루프에 빠질 수 있음!!!!!
⑤. ② ~ ④ 반복하다 조건식 false 면 while문 빠져나옴
● do while 문
/* 변수 초기화; do { 반복로직; 증감식; } while(조건식); */
let i = 1;
let sum = 0;
do {
sum += i; /* 조건이 true 면 반복처리 되는 로직 */
i++; /* 증감 */
} while(i<=10)
/* do while 문 처리 순서 */
①. 변수 초기화
②. 반복로직 실행 → 최소 1번은 실행 됨
③. 변수 증가 (또는 감소)!!!!
④. 조건식 true 면 반복로직 실행
⑤. ② ~ ④ 반복하다 조건식 false 면 while문 빠져나옴
● for in / for of 문
/* Array(배열) */
let arr = ["Chelsea", "Liverpool", "Tottenham"];
for(let index in arr) {
console.log(index); //0, 1, 2
}
for(let value of arr) {
console.log(value); //Chelsea, Liverpool, Tottenham
}
/* Object(객체) */
const son = {
birth : 920708,
height : 183,
weight : 77,
team : "Tottenham Hotspur"
}
son.number = 7;
son["country"] = "South Korea";
for(let key in son) {
console.log(key); //birth, height, weight, team, number, country
}
for(let key of son) {
console.log(key); //Uncaught TypeError: son is not iterable (에러발생)
}
'IT국비지원' 카테고리의 다른 글
| [Algorithm] 정렬 알고리즘 (0) | 2021.09.17 |
|---|---|
| [JavaScript] 함수 (function) (0) | 2021.09.15 |
| [JavaScript] 배열 (Array) (0) | 2021.09.14 |
| [JavaScript] 제어문 ① 조건문 (if, switch) (0) | 2021.09.08 |
| [JavaScript] 연산자 (0) | 2021.09.07 |
| [JavaScript] 작성위치, 변수와 상수 (0) | 2021.09.06 |
| [CSS] 반응형 웹 (0) | 2021.09.06 |
'IT국비지원' Related Articles
more
Comments