[JS] 반복문

·2022년 10월 5일
0

JavaScript

목록 보기
7/25

for문

for(초기화식; 조건식; 증감식) {
실행문;
}
초기화식 : 변수 선언
조건식 : 결과(true or false)에 따라 실행문의 실행 여부 판단
증감식 : 실행문 이후 변수의 증감을 나타냄

let i = 0;  // 변수 선언
for (; i < 7; i++) {
	console.log('count: ' + i)
}
//
count: 0
count: 1
count: 2
count: 3
count: 4
count: 5
count: 6

i < 변수.length 암기! 길이(넘버)만큼 순회를 돌게 됨

let data = ['a', 'b', 'c', 'd', 'e']
for (let i = 0; i < data.length; i++) {
    console.log(data[i]);
}
//
a
b
c
d
e
let data2 = [1, 3, 4, 8, 13, 17, 20];
for (let i = 0; i < data2.length; i++) {
    console.log(data2[i+1] - data2[i]);
}
//
2
1
4
5
4
3
NaN 

마지막에 인덱스값 넘어서서 NaN
그러니 i < data3.length - 1 해주면

let data3 = [1, 3, 4, 8, 13, 17, 20];
for (let i = 0; i < data3.length - 1; i++) {
    console.log(data3[i+1] - data3[i]);
}
//
2
1
4
5
4
3

let data4 = [1, 3, 4, 8, 13, 17, 20];
for (let i = 1; i < data4.length; i++) {
    console.log(data4[i] - data4[i-1]);
}
// 결과값 위와 같다
if (true) {
    var a = '1'
    let b = '2' // if 밖에서 쓸 수 없다
    const c = '3' // if 밖에서 쓸 수 없다
}
console.log(a) // 1
for (let i = 0; i < 10; i++){
    // i라는 변수를 스코프마다 잠근다
    var a = '1' 
    let b = '2' // if 밖에서 쓸 수 없다
    const c = '3' // if 밖에서 쓸 수 없다
    console.log(i);
}
console.log(a) // 1 

(var는 출력 가능! b,c는 안됩니다~)
큰 프젝 경우에는 사용할 수 있는 변수명을 지정

while문

조건문이 true이면 코드 실행
조건문이 false 되면 종료 (조건문이 true인 동안 계속 실행)

while(조건문) {
	실행문;
}
let i = 0;
let j = 2;
while (i < 10) {
		i++;
	  console.log(i * j);
}
//
2
4
6
8
10
12
14
16
20
let value = [10, 20, 30, 40];
let x = 0;
while(x < value.length) {
    console.log(value[x]);
    x++;
}
//
10
20
30
40

구구단 암기!

let i = 2;
let j = 1;
while (i < 10) {
    while(j < 10) {
        console.log(`${i} X ${j} = ${i * j}`);
        j++; // 맨 마지막에 10이 되고 j < 10이 아니기 때문에 반복문 탈출
    }
    j = 1
    i++;
}

do...while문

(거의 쓰지 않음)
조건문 전에 실행문이 있어서 실행문 코드가 반드시 한 번은 실행

do {
		실행문;
} while(조건문);
let sum = 0;
let i = 0;
do {
		i++;
		sum += i;
} while (i < 10);
console.log(sum);
// 55

break

조건 종료되기 이전에 종료를 원하면 break! 반복문에서 나온다
break문으로 반복문이 종료되면 그 다음 코드가 실행

for (let i = 0; i < 10 ; i++){
    console.log(i);
    if (i > 3) {
        break;
    }
}
//
0
1
2
3
4
let i = 2;
let j = 1;
while (i < 10) {
    while(j < 10) {
        console.log(`${i} X ${j} = ${i * j}`);
        j++;
    }
    j = 1
    if (i >= 4){
        break;
    }
    i++;
}
// 구구단 2,3,4단 출력
let i = 0;
for(;;) {
    i++;
    console.log(i)
    if (i > 5) {
        break
    }
}

for(;;): while문 괄호 안에 true 넣었을 때처럼 무한루프가 된다

for(let i = 0;;) {
    i++;
    console.log(i)
    if (i > 5) {
        break
    }
}
for(let i = 0;;i++) {
    console.log(i)
    if (i > 5) {
        break
    }
}

결과값 둘 다
//
0
1
2
3
4
5
6

while (i < 100) {
		i++;
	if (i === 14) {
			console.log(i + '살 부터 중학생이 됩니다.');
			break;
	}
}
console.log('중학교 입학을 축하합니다');
// 14살 부터 중학생이 됩니다.
// 중학교 입학을 축하합니다.

continue

반복문을 완전히 빠져나가는 break와 다르게 continue문은 반복문의 다음 반복으로 이동 (실행 안 시키고 다음 루프로 간다)

for (let i = 0; i < 10; i ++) {
    if (i === 4 || i === 5) {
        continue;
    }
    console.log(i);
}
// 4,5 빼고 0...9까지 출력
for (let i = 0; i < 10; i ++) {
    if (i === 4 || i === 5) {
        break;
    }
    console.log(i);
}
//
0
1
2
3
let i = 2;
let j = 1;
while (i < 10) {
    while(j < 10) {
        console.log(`${i} X ${j} = ${i * j}`);
        j++;
    }
    j = 1
    if (i == 4) {
        break;
    }
    i++;
}
// 구구단 4단까지 출력

구구단 4단 무한반복.. 해보지 마세요!

let i = 2;
let j = 1;
while (i < 10) {
    while(j < 10) {
        console.log(`${i} X ${j} = ${i * j}`);
        j++;
    }
    j = 1
    if (i == 4) {
        continue;
    }
    i++;
}
for (let i = 0; i < 20; i++) {
		if (i < 13) continue;
		console.log(i + '살은 청소년입니다.');
}
//
13살은 청소년입니다.
14살은 청소년입니다.
15살은 청소년입니다.
16살은 청소년입니다.
17살은 청소년입니다.
18살은 청소년입니다.
19살은 청소년입니다.
13 미만은 해당 조건의 반복을 넘고(남은 코드 실행되지 않음) if 조건문에 해당하지 않는 13 이상의 변수 값부터 console.log(i + '살은 청소년입니다.') 가 실행

레이블

(협업이 어려움 가독성이 좋지 않다)
식별자로 일종의 코드 블록의 네임태그
반복문 앞에 레이블 붙여 break/continue구문과 함께 사용하면 반복문 컨트롤 용이

  • 레이블은 반드시 break문 또는 continue문 위에 있어야 한다.
  • break문은 모든 레이블에서 사용할 수 있다.
  • continue문은 반복문에서만 사용 가능하다.
timestable:
for (let x = 2; x < 10; x++) {
	for (let y = 1; y < 10; y++) {
		if (x === 4) break timestable;
		console.log(`${x} X ${y} = ${x * y}`);
	}
}
//
구구단 2-3단 출력 (4단에서 빠져나오며 종료)

에어비앤비 컨벤션에서는 for문 지양하고 for..in문과 for..of문 권장

for (let i = 0; i < 10; i++){
}

에어비앤비 컨벤션에 권장
IE 전부 사용 가능

for (const i in ['one','two']) {
    console.log(i);
}

에어비앤비 컨벤션에 권장
IE 전부 사용 불가

for (const i of ['one', 'two', 'three']) {
    console.log(i);
}

object(객체) 반복문

에어비앤비 컨벤션에서는 for문 지양하고 for..in문과 for..of문 권장

for (let i = 0; i < 10; i++){
}

에어비앤비 컨벤션에 권장
IE 전부 사용 가능

for (const i in ['one','two']) {
console.log(i);
}

에어비앤비 컨벤션에 권장
IE 전부 사용 불가

for (const i of ['one', 'two', 'three']) {
    console.log(i);
}

for in 반복문

객체에 포함된 모든 프로퍼티에 대해 반복문을 수행
기본적으로 키 값만 출력하는 반복문

let data = {
    'one' : '하나',
    'two' : '둘',
    'three' : '셋',
    'four' : '넷',
}
for (const i in data) {
    console.log(i);
}
//
one
two
three
four
키가 하나씩 출력
for (const i in data) {
    console.log(i);
    console.log(data[i]);
}
//
one
하나
two
둘
...
four
넷
let data2 = [10, 20, 30, 40];
for (const i in data2) {
    console.log(i);
}
//
0
1
2
3
let data3 = {
    0:10,
    1:20,
    2:30,
    3:40,
}
for (const i in data3) {
    console.log(i);
}
//
0
1
2
3

키 값을 순차적을 가져오고 여기서는 인덱스

for (const i in 'hello world') {
    console.log(i);
}
//
0
1
...
10
  • Object.keys
  • Object.values
  • Object.entries
    배열 형태로 반환

array(배열) 반복문

for of 반복문

let data2 = [10, 20, 30, 40];
for (const i of data2) {
    console.log(i);
}
//
10
20
30
40
for (const i of 'hello world') {
    console.log(i);
}
//
h
e
l
l
o

w
o
r
l
d

문제

  1. 다음 수학점수의 평균을 구하세요
let 수학점수 = [10, 99, 88, 85, 21, 35]
console.log(평균 = (수학점수[0] + 수학점수[1] + 수학점수[2] + 수학점수[3] + 수학점수[4] + 수학점수[5]) / 6);

let s = 0
수학점수.forEach((value => s += value));
console.log(s/수학점수.length);

console.log(수학점수.reduce((a, b) => a + b, 0) / 6)

let s2 = 0;
for (let i = 0; i < 수학점수.length; i++) {
    s2 += 수학점수[i];
}
console.log(s2/수학점수.length);
  1. 여성은 몇 명인지 구하세요
let user = [
    {
        "_id": "633e5b1711926cc42d1fbb4b",
        "index": 0,
        "guid": "e6ef4abc-a6fc-4ed5-a9b0-8060240c48ab",
        "age": 28,
        "name": "Mai Montoya",
        "gender": "female"
    },
    {
        "_id": "633e5b1718d6c001d2f771c7",
        "index": 1,
        "guid": "9b07b16c-7a4a-4152-83cf-fb64625f52fe",
        "age": 22,
        "name": "Shelley Potts",
        "gender": "female"
    },
    {
        "_id": "633e5b17fecc26a897aa2283",
        "index": 2,
        "guid": "cfb29cc6-8381-4695-8c2f-0c273a9d33c2",
        "age": 22,
        "name": "Hensley Flores",
        "gender": "male"
    },
    {
        "_id": "633e5b17267fe16c24f00591",
        "index": 3,
        "guid": "6e189d90-0981-4086-9ee2-12242fda76d1",
        "age": 20,
        "name": "Holmes Morrow",
        "gender": "male"
    },
    {
        "_id": "633e5b17b30766b9c38594f5",
        "index": 4,
        "guid": "f1505113-9383-4249-bbb3-0e5f8ea634b2",
        "age": 25,
        "name": "Elisa Miller",
        "gender": "female"
    }
]
for (i = 0; i < user.length; i++){
    console.log(user[i]);
    if(user[i]['gender'] === 'female'){
        여성 += 1;
    }
}
console.log(여성);
//

user.filter(i => i['gender'] === 'female').length;

user는 배열. user[i]까지 객체. user[i]['gender']는 스트링

남자 몇 명인지 알고 싶으면 똑같은거 돌리지 말고
console.log(user.length - 여성)

  1. 다음 입력된 숫자들의 합
input : '12345'
result : 15

let x = '12345';
let result = 0;
for (let i = 0; i < x.length; i++) {
    result += parseInt(x[i])
}
  1. 1-100까지 8이 몇 번 나오는가? (88은 2로 카운팅)
let x = Array(100).fill(0).map((_, index) => (index + 1)).join('');
let result = 0;
for (let i = 0; i < x.length; i++) {
    if(x[i] === '8'){
        result += 1;
    }
}

문자열로 나열하고 8카운트

암기

(재귀함수 할 때 비교할 for문)

  1. 구구단
for (let 단 = 2; 단 < 10; 단++) {
    for (let 곱 = 1; 곱 < 10; 곱++) {
        console.log(`${단} X ${곱} = ${단 * 곱}`);
    }
}
  1. 문자열 뒤집기
let txt = 'hello world';
let result = '';
for (let i = txt.length - 1; i >= 0; i--) {
    result += txt[i];
}

잘 안 쓰지만 이런 코드도 있다

let txt = 'hello world';
result = '';
for (let i=0; i < txt.length; i++) {
    result = txt[i] + result;
}

아래가 더 익숙한 코드

  1. 시그마 : 누적합 (어떤 숫자부터 어떤 숫자까지 더한다)
let ss = 0;
for (let i = 1; i < 100; i++) {
    ss += 1
}
  1. 팩토리얼 (5! = 54321)
let ss2 = 1;
for (let i = 1; i < 6; i++) {
    ss2 *= i
}
profile
주니어 프론트엔드 웹 개발자 🐛

0개의 댓글