let은 어떻게 쓰여지는가?
- application을 실행하게 되면 메모리가 할당이 된다.
- 메모리는 비워져있는 박스라고 생각하기
- application마다 쓸 수 있는 박스들의 개수는 제한되어 있다.
- let을 사용하는 순간 name이라는 변수가 저장할 수 있는 공간이 생긴다.
(name이라는 메모리가 할당됨) - let name → hello
- 변수 'name'이 가리키는 메모리에는 hello가 저장이 된다..
- 'name'에는 다른 값을 저장할 수도 있게 된다.
- 블록스코프(block scope)
- 블럭안에서 선언한 변수는 블럭 외부에서 접근할 수가 없다.
- 글로벌 스코프(global scope)
- 블록이 아닌 파일안에다가 변수를 선언하는 방법
- 어느 곳에서든 접근이 가능하다(블럭안에서, 밖에서).
- 블록 밖에서 변수 선언을 해도 블록 내부에서 사용이 가능
- global scope는 선언하는 순간 메모리에 항상 저장이 되어있기 때문에 가급적 적게 쓰는 편이 좋다.
let vs var의 차이점
- 일반적인 프로그래밍 언어에서는 변수를 선언하고 나서 값을 할당한다.
- var는 선언을 하기도 전에 값을 할당하고 출력이 가능하다.
let으로 변수선언 (일반적인 프로그래밍 언어와 같음)
let age; // age라는 변수를 선언
age = 4 // age에 4라는 값을 할당var는 선언을 하기전에도 값을 할당이 가능하다. (비정상적)
console.log(age); // undefined - 값이 없을뿐 변수는 정의가 되어 있음
age = 4;
console.log(age); // 4 - age에 할당이 되어버림
var age; // 변수 정의가 가장 늦게 되었는데도 출력이 잘된다.- var은 변수 선언시 가장 위로 이동을 하게 되는데 이러한 것을 var hoisting 이라고 한다.
- 호이스팅?
- 뜻 : 끌어올려주다
- 어디에서 선언을 했느냐와 상관없이 항상 제일 위로 선언을 끌어올려주는 것을 뜻한다.
- var는 블록 스코프가 통하지 않는다.
- block 안에서 변수를 선언해도 block 밖 어디에서도 값을 가지고 올 수 있다.
- 블록안에서 변수를 선언해도 호이스팅이 된다.
{
age = 4;
var age;
}
console.log(age)// 4가 출력됨Constant를 쓰는 이유는?
- 값을 한번 선언하고 할당한 이후에 값은 변경이 불가능하게 잠궈버린다.
- 값을 계속 변경할 수 있는 data를 Mutable data라고 한다.
- let은 mutable data type을 위한것
- const는 immutable data type을 위한 것
Immutable data type을 사용하는 이유 3가지
1) 수정이 불가능하기 때문에 보안적인 측면에서 방지가 가능
2) 여러 스레드가 동시에 변수의 값에 접근하여 변경을 하는 경우에
변수값이 변하는 것을 방지
3) 개발자들이 코드를 바꿀때 실수를 방지할 수 있음.
const 변수의 할당값이 object 일때
const hello = {
name : 'choi',
age : 10
}
// const hello는 값이 변경이 안되지만
// 객체값은 변경이 가능하다.
hello.name = 'jun';
console.log(hello.name) // jun 변수의 타입종류 (Variable types)
- 원시타입(primitive type), single item
- number, string, boolean, null, undefind, symbol
- 더 이상 작은 단위로 나눠질 수 없는 한 가지의 아이템을 뜻함
- 객체타입(objects), box container
- 더 이상 작은 단위로 나눠질 수 없는 한 가지의 아이템을 뜻함
- function, first-class function
- sing item을 여러개로 묶어서 하나의 묶음으로 관리
백틱 사용
- 백틱을 사용하면 코드가 간결해짐
```jsx
console.log('value: ' + helloBob + 'type:' + typeof helloBob);
console.log(`value: ${helloBob} type: ${typeof helloBob}`)
```boolean
FALSE : 0, null, undefined, NaN, ''
TRUE : any other value
- 전부 같은 값으로 간주- NULL
- 명확하게 emepty 값을 지정 (아무것도 아닌 값이라고 지정)
- let nothing = null; (값이 없다고 할당)
- undefined
- 선언은 되었지만 할당할 값이 지정되어있지 않은것..
- Null과는 확실이 다름
- symbol - 추가적으로 공부
- symbol을 사용하면 동일한 string이라도 다르게 작동한다
- 주어지는 string에 상관없이 고유한 string을 만들때 사용
- 고유한 식별자가 필요하거나 동시 다발적인 상황에서 우선순위를 주고 싶을 때 사용
- 변경 불가능한 원시 타입의 값이며, 다른 값과 중복되지 않는 고유한 값
Dynamic typing: dynamically typed language
- 변수를 선언할 때 어떤 타입인지 선언하지 않고 runtime이 동작할 때 할당된 값에 따라서 type이 변경이 될 수 있음
text = '7' + 5; // string + number
console.log(`value:${text}. type ${typeof text}`);
// value:75 , type: string
// string으로 type 저절로 변함
text = '8'/'2'; // string / string
console.log(`value:${text}. type ${typeof text}`);
// value:4 , type:number
// 자동적으로 숫자로 인식하고 type을 변경
- javascript는 런타임이 될때 type이 변할 수 있기 때문에 처음에 계획하고 예상했던 type이 중간에 바뀔 수 있으므로 위험하다.
회고
메모리에 대한 기본적인 CS 공부가 필요함을 느낌..
또한 앞으로 Var를 쓰는일은 절대로! 없도록하자!
하지만 구글에 있는 레거시한 코드를 이해하기 위해서라도 var 호이스팅에 대한 이해는 필요하다!
스스로 성장하는 개발자