[혼공JS] 반복문 chapter 4

2024. 1. 12. 08:16· 프로그래밍 공부/Javascript
목차
  1. 배열
  2. 배열 생성하기
  3. 배열 요소에 접근하기
  4. 배열 요소 개수 확인하기
  5. 배열 뒷부분에 요소 추가하기
  6. 배열요소 제거하기
  7. 배열의 특정위치에 요소 추가하기
  8. 자료처리의 비파괴적 처리와 파괴적 처리
  9. 반복문
  10. for in 반복문
  11. for of 반복문
  12. for 반복문
  13. while반복문
  14. Break 키워드
  15. continue키워드

배열

배열 생성하기

배열이란 여러개의 변수를 묶어서 활용할 수 있는 특수한 자료구조 입니다.

대괄호 [ ~~~~,~~~,~~]를 사용해 생성하고 쉼표(,)를 통해 구분합니다.

내부에 들어있는 값을 요소라고 합니다.

어떠한 자료형도 요소가 될 수 있습니다.

배열 요소에 접근하기

문자열 인덱스와 동일하게 0부터 시작하며 대괄안에 번호로 호출합니다.

배열[인덱스]

배열 요소 개수 확인하기

배열.length

 

배열 뒷부분에 요소 추가하기

push()메소드를 사용해 배열 뒷부부 추가하기

배열.push(요소) // 어라?! 컴퓨터 구조 stack 명령어인뎅?

인덱스를 사용해 배열 뒷부분에 추가하기

배열[추가할 인덱스번호 위치]= 자료

배열요소 제거하기

인덱스로 제거하기

배열.splice(인덱스, 제거할 요소 개수)

splice로 5번째 :비어있음 과 6번째 : 비어있음을 제거

값으로 요소제거하기

const 인덱스= 배열.indexOf(요소) -특정 요소의 인덱스 위치를 파악

배열.splice(인덱스,1) -파악한 요소의 인덱스로 제거

특정 요소만 제거!

※indexOf()는 특정 문자열의 위치를 파악하는데도 도움을 준다.

※특정값을 가진 요소를 모두 제거하고 싶을땐 filter() 메소드 사용 --224페이지에서 다시 배움

 

배열의 특정위치에 요소 추가하기

배열.splice(인덱스 ,0,요소)

저녁먹기 추가

 

자료처리의 비파괴적 처리와 파괴적 처리

비파괴적 처리 : 처리후 원본 내용이 변경되지 않음

파괴적 처리 : 처리후 원본 내용이 변경됨

 

반복문

for in 반복문

for (const 반복변수 in 배열 또는 객체)
{
	문장
}

 예제

<script>
        const todos= ["아침먹기",'점심먹기',"저녁먹기","잠"]
        for (const i in todos)
        {
            console.log(`${i}번째 할일 : ${todos[i]}`)
        }
</script>

결과

for in 블록일때

for (const key in todos) {
            if (Object.hasOwnProperty.call(todos, key)) {
                const element = todos[key];
                console.log(`${key}번째 할일 : ${element}`)
            }
        }

for of 반복문

for (const 반복 변수 of 배열 또는 객체) 
{
            문장
}

반복 변수에 요소의 값이 들어감

for (const todo of todos) {
            console.log(`오늘 할일 : ${todo}`)
        }

for 반복문

for 반복문을 특정횟수만큼 반복시키고 싶을때

for(let i =0; i< 반복횟수; i++) 
{
	문장
}

예제

for(let i=0; i<5; i++)
{
	console.log(`${i}번쨰 반복입니다.`)
}

for반복문과 함께 배열 사용하기

배열의 length만큼 반복하는 형태로 많이씀

<script>
        const todos= ["혼공JS",'혼공컴운',"냐옹냐옹","잠"]
        
            for(let i=0; i<todos.length; i++)
            {
                console.log(`${i}번째 할일 : ${todos[i]}`)
            }
    </script>

 

 

while반복문

조건문이 true이면 반복하는 반복문

while(불표현식)
{
	문장
}

예제

 let i =0
while(true) //조건식이 true라 무한반복
{
	alert(`${i}번쨰 반복입니다.`)
	i+=1
}

while문과 배열사용하기 예제

let i =0
const array =[1,2,3,4,5]
while(i<array.length)
{
	console.log(`${i} : ${array[i]}`)
	i+=1
}

 

횟수 기준으로 간결한 반복문 : for

큰 비중의 조건이 있을때 : while ( 특정시간동안 어떤 데이터를 받을때 까지)

 

Break 키워드

무한반복문을 벗어나는 키워드

		let i =0
        while(true)
        {
            
            alert(`${i}번째 반복문입니다.`)
            const isContinue = confirm("계속하시겠습니까?")
            if(!isContinue)
            {
                break
            }
            i+=1
        }

 

continue키워드

반복작업을 멈추고 다음 반복작업을 진행합니다.

let output = 0
for (let i =1; i<=10; i++)
{
	if(i%2 ===1) //나머지가 1 = 홀수
	{
		continue
	}
	output +=i
}
alert(output)

 

'프로그래밍 공부 > Javascript' 카테고리의 다른 글

[혼공JS] 2주차 미션  (1) 2024.01.15
[혼공JS] 함수 chapter 5  (1) 2024.01.15
[혼공JS] 조건문 chapter3  (0) 2024.01.12
[혼공JS] 1주차 미션 및 궁금증 해결  (0) 2024.01.07
[혼공JS] 자료와 변수 chapter 2  (2) 2024.01.07
  1. 배열
  2. 배열 생성하기
  3. 배열 요소에 접근하기
  4. 배열 요소 개수 확인하기
  5. 배열 뒷부분에 요소 추가하기
  6. 배열요소 제거하기
  7. 배열의 특정위치에 요소 추가하기
  8. 자료처리의 비파괴적 처리와 파괴적 처리
  9. 반복문
  10. for in 반복문
  11. for of 반복문
  12. for 반복문
  13. while반복문
  14. Break 키워드
  15. continue키워드
'프로그래밍 공부/Javascript' 카테고리의 다른 글
  • [혼공JS] 2주차 미션
  • [혼공JS] 함수 chapter 5
  • [혼공JS] 조건문 chapter3
  • [혼공JS] 1주차 미션 및 궁금증 해결
공대핫산
공대핫산
공대핫산
공대핫산의 개발블로그
공대핫산
전체
오늘
어제
  • 분류 전체보기 (54)
    • 취업 (0)
      • IT 기업 취업하기 (0)
    • 프로그래밍 공부 (27)
      • HTML,CSS (0)
      • Javascript (25)
      • Python (0)
      • JAVA (0)
      • git (1)
      • SQL (1)
    • 컴퓨터 사이언스 (26)
      • 컴퓨터 구조 & 운영체제 (26)
      • 네트워크 (0)
      • Linux (0)
      • 클라우드컴퓨팅 (0)
      • 알고리즘 & 자료구조 (0)
      • 혼공얄코 (0)

인기 글

태그

  • SQLD독학
  • SQL자격증
  • 혼공JS
  • 자바스크립트
  • SQLD교재
  • SQLD시험일정
  • 우분투
  • 입문
  • ssh
  • 혼공단
  • 코딩자율학습단
  • 깃허브
  • 깃

최근 댓글

hELLO · Designed By 정상우.v4.2.2
공대핫산
[혼공JS] 반복문 chapter 4
상단으로

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.