[두잇 자바스크립트 입문] Part2

변수란 무엇일까?

변수는 변하는 값을 저장할 때 사용한다.

변수: 변할 수 있는 값이다. 

상수: 변하지 않는 값이다.

예시 ) 
나이 = 올해연도 - 태어난연도 + 1
변수: 올해 연도, 태어난 연도, 나이,  상수: 1

 

변수를 선언하는 규칙 세 가지

: 변수에는 컴퓨터가 구별할 수 있도록 이름을 붙여야 하는데 이를 '변수를 선언한다'라고 한다. 변수선언은 var 키워드 뒤에 변수 이름을 적으면 됩니다.

var apple;

규칙 1 : 이름은 의미 있게 짓는다

- 예를 들어 올해 연도는 currentYear, 태어난 연도는 birthYear이라고 짓는 것이 좋다.

규칙 2 : 여러 단어를 연결한 변수 이름은 낙타 모양으로 만들어준다.

- 위의 currentYear과 birthYear같이 여러단어를 연결할 때는 첫번째 단어는 소문자, 두번째 단어부터는 대문자로 시작한다. 이를 낙타 표기법이라고 부른다.

규칙 3 : 선언할 수 있는 이름도 있다

- 첫 글자는 반드시 문자나 밑줄(_), 달러기호($)로 시작하고 그 후에는 문자, 밑줄,달러기호,숫자를 사용할 수 있다.

 

변수에 값이나 식 저장하기

- 변수에 값을 저장할 때 '변수를 선언하면서 저장하는 방법' 과 '변수를 선언한 다음에 저장하는 방법'이 있다.

1 ) 변수를 선언하면서 저장하는 방법
var apple="yummy";
2 ) 변수를 선언한 다음에 저장하는 방법
var apple;
apple="yummy";

- 변수에 식을 저장하는 경우에는 식에 있는 변수는 미리 선언해 두어야 합니다.

3 ) 변수를 미리 선언해 두어야 한다
var apple=2000;
var banana=1000;
var total=apple+banana;

 

 

---

자료형 이해하기

자료형의 종류

자료형이란? 컴퓨터가 처리하는 자료의 형태를 말한다. 자료형은 값이 하나인 '기본형'과 여러값을 한꺼번에 담고 있는 '복합형'으로 구별.

 

기본형 )

number(숫자)	따옴표 없이 표기한 숫자를 나타낸다.
string(문자열)	작은 따옴표나 큰 따옴표로 묶어 나타낸다.
boolean(논리형)	참(true)과 거짓(false)이란 두 가지 값만 가지고있다.
undefined	자료형을 지정하지 않았을 때의 유형이다. 변수를 선언만 하고 값을 정의하지 않으면 undefined가 된다.
null	값이 유효하지 않을 때의 유형이다.

복합형 )

array(배열)	하나의 변수에 여러 값을 저장하는 유형이다.
object(객체)	함수와 속성이 함께 포함된 유형이다.

 

typeof 연산자

: 자료형을 확인하는 방법

- 변수 또는 값이 어떤 자료형인지 알고 싶을 때 typeof 연산자를 사용한다.

예시 )
typeof 1990;
"number"
typeof "hello";
"string"

 

기본형

number (숫자형)

: 숫자는 정수와 실수로 나누어 구분한다.

정수

: 소수점 없는 숫자를 가리킨다. 표현 방법에 따라 10진수, 8진수, 16진수의 세가지 유형으로 나누기도 한다.

8진수란? 0~7로 표현한 수입이다. 이때 10진수와 구별하기 위해서 숫자 앞에 0을 붙입니다. ex) 012, 013000

16진수란? 숫자 0~9와 알파벳 A~F로 표현한 수이고 10진수와 구별하기 위해서 0x(또는 0X)를 맨 앞에 붙인다.

                이때 알파벳은 대문자와 소문자 모두 사용가능하다. ex) 0xfff, 0Xfff, 0xFFF

 

실수

: 소수점이 있는 숫자를 가리킨다

*실수를 계산할 때 주의할 점*

예를들어 0.1+0.2 결괏값은 0.3이 아니라 0.3000000000000004이다. 왜냐하면 0.1이나 0.2를 2진수로 변환해서 계산하기 때문에 생긴 결과값이다. 그러므로 정밀하게 숫자를 계산하는 프로그램을 만들 때는 주의해야한다.

 

string (문자형)

: 작은따옴표나 큰 따옴표로 묶은 자료를 의미한다. 숫자도 작은 따옴표나 큰 따옴표로 묶으면 문자형으로 인식한다.

*만약 큰따옴표로 묶은 문장형 안에 큰따옴표로 묶은 문장을 넣으려면?*

-큰따옴표가 중복되지 않도록 큰따옴표를 작은 따옴표로 바꿔줘야한다.

 

boolean (논리형)

: 참(true)과 거짓(false)이라는 값을 표현하는 자료형이다.
- 주로 프로그램에서 조건을 확인할 때 많이 사용한다.

 

undefined와 null

undefined : 자료형이 정의되지 않았을 때의 상태이다. 즉 '처음부터 변수에 값이 할당되지 않았다'를 의미한다.

null : '처음에 할당된 값이 더는 유효하지 않음'을 뜻한다. 보통 변수를 초기화할 때 null을 사용한다.

 

복합형

배열

:하나의 변수에 여러 값을 저장할 수 있다. 여러간으로 나뉜 알약 통에 요일별로 알약을 나누어 넣는것을 상상해보면 이해하기 쉽다.

var spring="봄";
var summer="여름";
var fall="가을";
var winter="겨울";

복합형으로 변경하면,
var seasons=["봄", "여름", "가을", "겨울"];

배열의 특정 값을 가져올 때 사용하는 인덱스

: 배열에 저장된 계절 이름을 하나씩 가져오고 싶을 때 사용한다

1 ) 배열 이름만 사용하면 배열 내용 전체를 가져온다.

2 ) 배열 이름과 대괄호( [ ] )를 사용하면 안에 0,1,2같은 숫자 넣어 사용하면 해당 위치의 값만 가져온다. 인덱스는 0부터 시작한다.

season[0]
"봄"
season[1]
"여름"
season[2]
"가을"
season[3]
"겨울"

 

 

 

---

연산자 이해하기

사칙 연산자

더하기 ( + ) 빼기 ( - ) 곱하기 ( * ) 나누기 ( / )

두 값을 더한다. 앞의 값이 뒤에 값을 뺀다. 두 값을 곱한다. 앞의 값을 뒤의 값으로 나눈다.

나머지 연산자

나머지 ( % )

앞의 값을 뒤의 값으로 나눈 나머지 값을 구한다.

증감 연산자

증가 ( ++ ) 감소 ( -- )

변숫값을 1만큼 증가시킨다. 변숫값을 1만큼 감소시킨다.

할당 연산자

+= -= *= /= %=

예 ) y+=x     의미 ) y=y+x 예 ) y-=x      의미 ) y=y-x 예 ) y*=x      의미 ) y=y*x 예 ) y/=x       의미 ) y=y/x 예 ) y%=x     의미 ) y=y%x

- 더하기 연산자와 연결 연산자 구별하기

더할 때 :

예를 들어 100과 "50"을 +기호로 더하면 +기호는 연결 연산자가 되어 "10050"이 된다

뺄 때 :

예를 들어 100과 "50"을 -기호로 빼면 -기호는 산술 연산자가 되어 50이 된다

곱하기, 나누기, 나머지 구할 때 :

이들은 모두 문자형 자료를 숫자로 자동 인식한다. 그렇기 때문에 곱했을 때 5000, 나눴을 때 2, 나머지 값을 구할 때 0이 된다.

 

비교 연산자

==와 != 

: ==연산자는 두 수 가 같은지 확인하는 연산자고 !=는 그 반대의 다른지의 역할을 한다.

<와 <=, >와 >=연산자 

: 작은지 또는 작거나 같은지, 큰지 또는 크거나 같은지를 확인하는 연산자다.

==연산자와 ===연산자 

: ==와 ===모두 왼쪽과 오른쪽이 같은지 비교하는 연산자이다. 하지만 중요한 차이점이 있다.

==는 문자형과 숫자형 자료가 있을 때 자동으로 자료형을 변환하여 비교한다. 반면, ===연산자는 두 자료형의 변환을 허용하지 않는다.

예시 )
10=="10"
true
10==="10"
false

논리 연산자

OR 연산자

: 왼쪽과 오른쪽 중 하나만 참이면 true로 처리한다. 

AND 연산자

: &&기호이고 왼쪽과 오른쪽 모두 참인 경우에만 true로 처리한다.

NOT 연산자

: ! 기호로 표시하며 true나 false를 반대로 뒤집는다.

 

서로 다른 연산자를 계산하는 순서 )
단항 연산자 - 산술 연산자 - 비교 연산자 -  논리 연산자 - 할당 연산자