생활코딩을 통한 CSS(with BGM. 부산 개발자들의 모임)_ch.5

이제 HTML과 CSS의 수업이 끝났습니다!

(지금껏 오신다고 고생 많으셨습니다! ㅠㅠ...

하지만 우린 가야할 길이 많이 남았습니다. 그래서 다시 짐을싸고 공부를 하러 가보도록 하겠습니다~!)

 

 

그리하여...

우리는 이제부터 JavaScript라는 것을 배워볼 것 입니다.

 

 

 

 

 

1. 우리가 자바스크립트를 왜 배우는가?

- 이제껏 우리가 배운 HTML로 웹페이지를 만들수 있었습니다. 하지만 사용자는 웹사이트와의 상호작용을 하기를 원합니다.

하지만 HTML은 정적이기 때문에 한번 화면에 출력되면 그 모습 그대로 나오기 때문에 우리는 우리의 조작에 의해 반응을 하는 동적인 웹페이지를 만들고자 합니다. 그렇기에 이러한 기능을 구현하기 위해서 등장한 언어가 JavaScript입니다.

 

- 기본적으로 자바스크립트는 HTML 위에서 동작하는 언어

*HTML에서 Js를 제어하는 방법은?

스크립트 안에 오는 코드를 Js코드로 인식한다.

 

2. 자바스크립트에서 존재하는 데이터 타입의 종류

- 문자: "" (큰따옴표는 큰따옴표끼리)/ ''(작은따옴표는 작은따옴표끼리) 묶어서 표시해줌

- 숫자: 그냥 숫자로 표시해줌

==> 숫자인지 문자인지 표기에 따라서 결과가 다르게 나오니 데이터 타입의 형식을 잘 구분시켜 줘야합니다

 

 

3. 변수와 대입연산자

- 변수(variable): 값이 바뀔수 있는 값

ex) x = 1; 이라는 식이 있을때 여기서 'x' 는 변수를 의미하고 '=' 는 대입연산자를 의미합니다. 

     또한 이러한 식을 통해서 알 수 있는것은 좌항과 우항의 값을 결합해서 좌항의 값을 나타내는 것을 의미합니다. 

     (+ 가급적 변수명 앞에는 var을 붙여줘서 표기를 해주는것을 추천합니다)

 

- 상수(constant): 값이 항상 같은 값

ex) 1 = 2; 이라는 식은 1이 2가 될수없고 대입연산자를 사용할 수 없다.

 

4. 조건문

- 하나의 프로그램이 하나의 기능으로 가는 것이 아니라 조건에 따라 순서대로 가는 것을 의미합니다.

- "A === B " : 왼쪽에 있는 값과 오른쪽에 잇는 값이 비교해서 같다면 true라고한다. 다르다면 false로 나온다.

- true와 false로 이뤄진 데이터 타입을 boolean이라고 한다.

- if 문의 괄호(true / false) 안에는 boolean 데이터 타입이 옵니다.

 

5. 배열 & 반복문

- 배열: 대괄호로 시작해서 대괄호로 끝남. 그리고 그 안에 내용물을 담음

ex) var ex1 = ["ex2", "ex3", "ex4"];

     *안에 있는 내용물을 꺼낼때는 변수명[index number] 로 꺼내온다.

     *길이를 알고 싶을때: 변수명.length; 로 선언한다면 배열의 길이를 알 수 있다.

     *내용을 추가 할때: 변수명.push("추가할 내용물"); 

     *내용을 배열의 위치를 명령에 따라 다양한 위치로 넣을 수 있다.

 

- 반복문:

ex1). while(){}

         * (): 중괄호 안에 값이 "true"가 된다면 {} 괄호안의 내용이 ()안의 값이 false가 될때까지 반복

 

ex2) 

var i =0

while(i=<3){

     내용물

     i= i + 1;

}

==> i의 값이 3보다 클때까지 내용물을 반복하는 작업

       (괄호안의 값이 false가 될때까지 내용을 반복하게 된다)

 

ex3) for(){}

        * while 과 마찬가지로 괄호안에는 조건식의 값이 들어가고 그 조건식이 false가 될때까지 {} 안의 내용을 반복합니다

 

ex4)

for(var i=0; i=<3; i++){

     내용물

}

==> i의 값이 3보다 클때까지 내용물을 반복하는 작업, while문과 결과는 같습니다.

       (괄호안의 값이 false가 될때까지 내용을 반복하게 된다)

      

 

 

#이렇게 하여 ch_5 자바스크립트 내용 첫번째를 마치겠습니다.

(조건문, 반복문에 대한 이해는 반복해서 익숙해질때까지 생각해보면서 이해해보시면 좋을것 같습니다!!)

#다음 시간에는 함수부터 객체에 대한 전반적인 내용을 정리해서 올려보도록 하겠습니다.

#감사합니다(꾸벅)(꾸벅)