[부스트코스 서포터즈3기]Javascript제어문 - 배열 , 반복문

들어가기 전 

___________________________________________________

 

안녕하세요! :) 

 

 

이제 다음 업로드면 2강 Javascript 제어문이 마무리되게 되는데...

 

 

벌써 중간까지 완료했다는 게 믿기지가 않습니다 ㅠㅠ 

 

 

끝까지 화이팅!! 

 

 

오늘은 배열 , 반복문에 대해 알아보도록 하겠습니다! 

 

 

배열

___________________________________________________

 

먼저 배열부터 살펴보겠습니다!

 

 

배열의 학습목표 , 핵심 단어는 다음과 같습니다. 

 

 

 

배열은 말그대로 원소를 저장하는 공간이라고 할 수 있습니다. 조금 더 쉽게 이야기하자면

 

 

집에 있는 물건들을 정리할 때 서랍장 혹은 상자에 정리하는 것처럼 , 

 

 

배열은 서로 연관된 데이터를 정리해서 담아두는 수납상자를 의미합니다.

 

 

그렇다면 , html내에서 배열을 어떻게 활용하는지 코드를 통해 살펴보겠습니다! 

 

 

다음 코드는 html내에서 배열을 선언해주고 그 배열에 duru , taeho라는 값까지 추가한 경우입니다.

 

 

해당 코드를 하나씩 이야기하게되면

 

 

배열 그리고 배열에 넣거나 뺄 때는 script태그에서 이루어짐을 알 수 있습니다.

 

 

또한, 배열을 선언할 때 [  ]을 사용해야 하는 것도 알 수 있으며, 저장 값을 호출할 때 

 

 

해당 자리값을 넣어주면 그 자리에 있는 결과 값이 출력됨을 알 수 있습니다. 

 

 

*이때 기억해야 하는 것이 있는데 컴퓨터는 인간과는 다르게 0 , 1 , 2 , 3 , 4.... 이렇게 자리가 계산되기 때문에

 

 

만약 본인이 출력하고 싶은 자리가 있다면 본인이 생각한 자릿수 -1 인 값을 자리 값으로 넣어주면 됩니다 :)

 

 

또한 배열에 값을 넣어주는 경우, 배열의 길이를 구할 수 있는 경우 두 가지가 표현되어있음을 알 수 있습니다.

 

 

더 자세한 내용은 다음 링크를 참고하여 더 공부하면 될 것 같습니다 :) 

 

 

developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array

Array - JavaScript | MDN

 

위 코드를 입력할 경우 다음과 같은 결과 값을 출력할 수 있습니다! 

 

 

 

Syntax 부분에서 배열을 설정하고, 

 

 

get부분에서 각 배열에 저장된 값을 출력하고 add부분에서 push를 이용해 2개의 값을 더 추가하기 때문에

 

 

count에서는 2개의 값이 더추가된 4가 출력되고 있음을 결괏값을 통해 알 수 있습니다 :) 

 

 

반복문

___________________________________________________

 

이번엔 반복문에 대해 살펴보도록 하겠습니다 :) 

 

 

해당 강의에서는 반복문 while을 이용하여 강의를 진행해 주셨습니다! 

 

 

먼저 학습목표 , 핵심 단어에 대해 살펴보겠습니다! 

 

 

 

 

이전 업로드에서 반복문이 어떤 것인지에 대해 간단히 살펴보았었습니다. 

 

 

그렇기 때문에 이번에는 반복문을 한번 직접 사용하면서 살펴보겠습니다 :) 

 

 

 

반복문 같은 경우 마찬가지로 script 태그 안에 꼭 작성해주셔야 합니다! 

 

 

먼저 while 반복문에 대해 이야기를 하자면

 

 

while은 해당 조건이 True일 때까지 반복을 진행하고 False일 경우는 반복을 종료하고 다음으로 진행하는 반복문입니다.

 

 

해당 코드를 살펴볼 경우  

 

 

1. 변수 i 설정 후 0 삽입

 

 

2. while문을 이용해 i < 3보다 작을 때까지만 반복을 실행

 

 

3. 반복문이 진행됨에 따라 i 에는 1씩 증가 

 

 

4. i 가 3과 같거나 클경우는 False가 되기 때문에 반복문 종료 후 다음 코드 실행

 

 

이러한 결과로 이루어지게 됩니다. 이제 결과창을 통해 살펴본다면

 

 

다음처럼 실행이 되게 됩니다 :) 

 

 

이렇듯 반복문 그리고 조건문에 대해 곰곰이 생각해본다면

 

 

이 두 가지는 순서대로 실행되는 프로그램의 실행 흐름을 제어하는 제어문이라는 것을 알 수 있습니다.

 

 

 

생각해보기

___________________________________________________

 

오늘 내용어 떠셨나요!? 

 

 

한번 생각해보기를 통해 다시 한번 되짚어보는 시간을 가지도록 하겠습니다! 

 

 

배열 생각해보기

반복문 생각해보기

 

한번 다시 생각해보시고 확인해보세요! 

 

.

.

.

.

.

.

.

.

.

.

..

.

.

.

.

.

.

.

.

..

 

배열 생각해보기 정답

반복문 생각해보기 정답 

 

밑 반복문에서 4가 정답인 이유는 0이 먼저 삽입될 경우 i값이 2가 되고 그 상태에서 한번 더 돌리게 되면 i=4가 되는데 

 

 

이는 , i <3까지의 조건에 부합하지 않기 때문에 4가 출력됩니다.

 

 

 

 

마치며

___________________________________________________

 

지금까지 배열과 반복문에 대해 살펴보았습니다 :) 

 

 

수업도 중요하지만 언제나 머슬 메모리가 제일 중요하다는 점을 다시 한번 상기시키며 열심히 해야 할 것 같습니다 ㅠ 

 

 

다음 시간에는 Javascript 제어문의 마지막 배열과 반복문 , 배열과 반복문의 활용을 묶어 업로드하도록 하겠습니다 :) 

 

 

제가 작성하는 모든 내용은 부스트 코스의 자바스크립트 시작에서 배운 내용을 바탕으로 작성됩니다! 

 

 

www.boostcourse.org/cs124

자바스크립트의 시작