[javascript]반복문2(for, for-in, for-of, .forEach)

1. for 

for문은 실생활에서 제한횟수가 있는 곳에 사용됨

 

for(초기값; 조건; 증감) {
    반복할 코드
}

 

예시)

for (let i = 0; i < 10; i++) {
            console.log(i) // 0 ~ 9 까지 콘솔에 출력됨
        }

 

2. for-in  문

객체에 사용할 수 있음

객체의 key값과 value값을 반환하는데 유용함

 

for(key in 객체) {

    객체의 프로퍼티의 갯수만큼 반복됨

}

 

▶ 프로퍼티는 객체의 key - value 임

 

예시)

let object1 = {
    name: "룰루",
    age: 27,
    job: student
}

for(let a in object1) {
	console.log(a)
}

name
age
job
//key값 출력됨

 

3. for- of  문

컬렉션 전용임

모든 객체아님 [Symbol.iterator]이라는 속성 값이 있어야 사용 가능 (배열 속성에 있음)

콘솔에 배열 속성 확인

for (요소 of 배열) {    배열인덱스 갯수만큼 반복됨} 

 

예시)

let arr = [a, b, c];

for (let a of arr) {
	console.log(a)
    //콘솔에 arr요소 하나씩 출력
}

a
b
c
//arr 배열 요소들을 하나씩 출력해준다

 

4. .forEach 메서드

Array 객체에만 사용 가능한 메서드이다

 

forEach() 배열의 길이만큼 반복하며 배열 요소, 배열요소의 인덱스, 배열자체를 매개변수로 받을 수 있다.

 

 

배열변수.forEach( function(value, index, arr) {
    console.log(value); //배열 요소 하나씩 출력 
    console.log(index); //index 번호 하나씩 출력

    console.log(arr); //배열자체 한번씩 출력
})

 

예시)

let arr = [1, 2, 3, 4, 5];

arr.forEach(funtion(value, index, arr){
    console.log(value);
    console.log(index);
    console.log(arr);
})

1 //arr[0]
0 //인덱스 번호
[1,2,3,4,5] //배열전체
2 //arr[1]
1 //인덱스 번호
[1,2,3,4,5] //배열전체
3 //arr[2]
2 //인덱스 번호
[1,2,3,4,5] //배열전체
4 //arr[3]
3 //인덱스 번호
[1,2,3,4,5] //배열전체
5 //arr[4]
4 //인덱스 번호
[1,2,3,4,5] //배열전체

 

 

▶함수는 화살표 표식으로 변경가능(function은 >(화살표로 바뀜), {}도 생략 가능)

 

배열변수.forEach(()=>{})

배열변수.forEach(value => console.log(value));

 

let arr = [1, 2, 3, 4, 5];

arr.forEach((value, index, arr) = >{
    console.log(value);
    console.log(index);
    console.log(arr);
})

//결과값은 위와 같음