axnuo

[혼공단 / JS] 3주차 Chapter 04 반복문 본문

JS/혼공단

[혼공단 / JS] 3주차 Chapter 04 반복문

axnuo 2023. 7. 23. 23:20

3주차

<aside> 💡 진도 : Chapter 04

</aside>

<aside> 💡 기본 미션 : 비파괴적 처리와 파괴적 처리의 의미와 장단점 설명

</aside>

<aside> 💡 p. 173 확인문제 3번 풀고 풀이과정 설명하기

</aside>

 

기본 미션

비파괴적 처리는 처리 후에 원본 내용이 변경되지 않는 처리이며 파괴적 처리는 처리 후에 원본 내용이 변경되는 처리이다. 파괴적 처리는 메모리를 절약할 수 있다는 장점이 있으나 원본이 사라지기 때문에 위험하다는 단점이 있고 반대로 비파괴적 처리는 파괴적 처리에 비하여 메모리를 많이 차지하지만 원본을 유지할 수 있다는 장점이 있다.

 

선택미션

p. 163 확인문제 3번 풀기

1 → 비파괴적 처리 : 처리 후 strA가 변경되지 않음.

2 → 파괴적 처리 : 처리 후 arrayB가 변경됨.

3 → 비파괴적 처리 : 처리 후 arrayC가 변경되지 않음

4→ 비파괴적 처리 : 처리 후 strD가 변경되지 않음.

 


04-1 배열

  • 배열 : 자료를 묶어서 활용할 수 있는 자료
  • → 요소 : 배열 내부에 들어있는 값
  • 배열 요소 개수 확인
    • arr.length
  • 배열 뒷부분에 요소 추가
    • arr.push(x)
    • arr[n] = x → 이렇게 하면 빈 인덱스가 만들어질 수 있음 (empty)
    • arr[arr.length] = x → 이렇게 하면 배열의 마지막 위치에 요소 추가
  • 배열 요소 제거
    • arr.splice(n, k) → n번째 인덱스부터 k개의 요소 제거
    • arr.indexOf(x) →x의 인덱스를 찾음.
    <aside> 💡 indexOf()와 splice()는 배열 내부 요소를 하나만 제거 가능, 배열 내부에서 특정 값을 가진 요소를 모두 제거하고 싶을 땐 filter() 메소드 사용
  • </aside>
  • 배열 특정 위치에 요소 추가
    • arr.splice(n, 0, x) → n번째 인덱스에 x추가 (0은 아무것도 제거하지 않겠다는 의미)
  • 자료의 비파괴와 파괴
    • 비파괴적 처리 : 처리 후에 원본 내용이 변경되지 않음 → 메모리를 많이 차지하지만 자료가 보호됨.
    • 파괴적 처리 : 처리 후에 원본 내용이 변경됨 → 메모리를 절약할 수 있지만 원본이 사라짐.

04-2 반복문

  • for in 반복문
    • 배열 요소를 하나하나 꺼내서 특정 문장을 실행함.
    for (const i in arr){
    	문장
    }
    
    //------
    
    const todos = ['우유 구매', '업무 메일 확인하기' , '필라테스 수업']
    
    for (const i in todos) {
    	console.log(`${i}번째 할 일: ${todos[i]}`)
    }
    
    → 반복변수 i를 활용해 배열 요소에 접근 가능
  • for of 반복문
    • for in에 비해 요소의 값을 반복할 때 안정적으로 사용할 수 있음
    for( const i of arr){ // i 는 요소의 값
    	문장
    }
    //-----
    const todos = ['우유 구매', '업무 메일 확인하기' , '필라테스 수업']
    
    for (const todo in todos) {
    	console.log(`오늘의 할 일: ${todo}`)
    }
    
  • for 반복문for 반복문은 i< todos.length로 범위를 설정 할 수 있고 반복을 역으로 돌릴 수도 있다~
  • for(let i=0; i<n; i++{ 문장 }
  • while 반복문while은 true이면 무한 루프가 발생한다~이렇게 하면 사용자가 확인을 클릭할 때 true → 취소를 클릭하면 false로 바뀜
  • while(confirm('계속 진행하시겠습니까?')) { alert(`${i}번째 반복입니다.`) i = i+1 }
  • while ( 불 표현식 ) { 문장 }
  • break 키워드
    • switch 조건문이나 반복문을 벗어날 때 사용하는 키워드
  • continue 키워드
    • 반복문 안의 반복 작업을 멈추고 반복문의 처음으로 돌아가 다음 반복 작업 진행