JavaScript ES5+ | data types, let vs var, hoisting

1.Variable (변수), rw(read/write)

:변경될 수 있는 값 / 읽고 쓰기가 가능.

let (added in ES6) : 변수를 정의

name은 ellie다.

name은 hello다.

 

 

 

2.Block scope

{ } 밖에 있는 내용은 { }안에 있는 내용을 볼 수 없게 됨.

{ }밖에 있는 console.log(name);은 아무 것도 나타나지 않음.

 

반면,

{ }밖에 정의하는 변수를  'global scope' 이라고 부름.

어느곳에서나 접근이 가능함.

어플리케이션이 실행되고 끝날때까지 메모리에 탑재 되어있기 때문에

최소한으로 사용하는 것이 좋음.

 

*var 선언은 지양

Why?

- 변수를 선언하고 값을 할당하는 것이 순서다.

하지만 var는 값을 쓰고 변수를 선언하거나

심지어 출력후에 변수를 선언하는 것이 가능함.

(var는 console에 undefined라고 뜸. let은 바로 에러가 뜸)

이것을 var hoisting이라고 함.

(어디에 선언했냐에 상관없이 항상 제일 위로 선언을 끌어 올려주는 것)

 

- { }Block scope이 없음.

{ }안에 작성해도 { }에 출력하면 나옴.

 

 

3.Constant (const), r(read only)

:한번 할당하면 값이 절대 바뀌지 않음. 읽기만 가능.

Immutable 타입 ->값 변경이 불가능. /primitive types, frozen objects (i.e. object.freeze())

Mutable 타입 -> 값을 계속 변경할 수 있음. /all objects by default are mutable in JS

 

favor immutable data type always

-security 보안상의 이유

-thread safety 

-reduce human mistakes 실수 방지

 

 

4.Variable types

• primitive, single item: number, string, bloolean, null, undefiedn, symbol
• object, box container
• function, first-class function

primitive은 value로 값이 저장.

object는 object가 가리키는 래퍼런스에 값이 저장된다.

 

 

number

 

(다른 언어와 달리 javascript는) 정수나 소수점에 상관없이 number type으로 할당 됨.

 

 

speicla numeric values: infinity, -infinity, NaN

 

dom요소를 javascript이용해서 포지션을 바꾼다던지 다양한 계산을 해야할 때

나누고자 하는 값이 0인지, 숫자인지 확인도 하지 않고 연산을 하면 

숫자가 아닌 infinity, -infinity, NaN가 나와 에러가 발생할 수 있음.

 

 

bigInt (fairly new, don't use it yet)

 

숫자 제일 마지막에 n만 붙이면 bigInt 값으로 인식.

(최근에 추가된 사항이라 크롬과 파이어폭스에서만 지원. 때문에 많이 쓰이지는 않음.)

 

 

string

 

template literals (string) ->`텍스트 내용 ${변수}`

:변수의 값이 자동적으로 붙여져서 나옴.

 

*  ` ${  }`  사용하는 이유

console.log('value:' + helloBob + 'type:' + typeof helloBob);

' ' + ' ' 작성해야하는 방식을

console.log(`value: ${helloBab}, type: ${typeof helloBab}`);

이렇게 더 간단하게 작성할 수 있음.

 

 

boolean

false: 0, undefined, NaN, ''

true: any other value

 

 

 

null

: 텅텅 비어있는 값이라고 지정해주는 것.

 

 

 

undefined

: 선언은 했지만 값이 지정되어있지 않은 것.

 

 

 

symbol, create unique identifiers for objects

: 고유한 식별자가 필요할 때 사용함.

 

 

 

for을 이용해서 같은 심볼로 만들 수 있음.

 

 

 

symbol은 꼭 .description 을 이용하여 출력해야 함. (그냥하면 사진처럼 에러 뜸)

 

 

 

.description

 

 

 

object, real-life object, data structure

const ellie={name:'ellie', age:20};

ellie.age=21;

ellie는 const로 지정된 object라서 다른 object로 변경이 불가.

하지만 그 안에 name이나 age는 값을 변경할 수 있음.

*중요하기 때문에 다음 수강때 더 자세하게 노트할 예정.

 

 

 

5. Dynamic typing: dynamically typed language

:선언할 때 어떤 타입인지 선언하지 않고

프로그램이 동작할 때 할당된 값에 따라서 타입이 변경될 수 있음.

 

 

자바스크립트가 선언된 것을 읽어서 string인지 number인지 타입을 결정함.

 

 

 

 

개발자가 글자를 출력하려고 해도 중간에

number로 인식해버려서 에러가 발생하게 됨.

그래서 나온 것이 타입스크립트!