자바스크립트_2 / 변수 선언과 데이터 타입, 그리고 다이나믹 타이핑

1. Variable

- 변경될 수 있는 값

- 자바스크립트에서는 let을 사용하여 변수를 표현한다. (ES6에서 추가됨)

- 이전까지는 var를 사용해 변수를 표현했지만 변수를 선언하기 전에 값을 할당할수도 있고, 출력또한 할 수 있는 문제(var hoisting)가 있다. 또한 block scope이 적용되지 않아 지금은 사용하지 않는 추세이다. 

- 어플리케이션마다 사용할 수 있는 메모리가 제한적으로 한정되어있다. 이때 변수를 정의하면 일정한 메모리 공간을 가리키는 포인터가 생긴다. 이때 변수에 저장되는 내용들이 메모리에 저장이된다.

 

1-1. block scope

- {}를 사용해서 코드를 작성하면 블럭 밖에서는 해당 코드를 확인할 수 없다.

- 메모리 최적화 등을 위해 적재적소에서 사용한다.

 

1-2. Constants

- 변수는 가리키고 있는 포인터를 통해 메모리에 저장된 값을 바꿀 수 있었지만 Constants는 선언하는 동시에 할당한 뒤로는 값을 변경할 수 없다.

- 값을 변경하지 못한다는 특징 덕분에 다음과 같은 장점이 있다.

    * 보안 : 외부에서 값을 강제로 변경하는 것을 막을 수 있다.

    * 쓰레드 안정성 : 값을 동시에 변경하는 것을 방지해 thread safety가 있다.

    * 실수를 줄일 수 있음 : 다른 개발자와의 협업 시 실수를 줄일 수 있다.

 

 

2. 데이터 타입

- number, string, boolean, null, undefined, symbol
- object, box container
- function, first-class function (함수를 변수로 할당할 수 있고, 리턴값이나 인자로도 사용할 수 있는 특징)

- C나 자바와는 다르게 변수를 데이터 타입에 따라 따로 적어줄 필요가 없이 let으로 변수 생성이 가능하다. (Dynamic typing)

 

2-0. Dynamic typing

- 자바 스크립트는 데이터 타입을 따로 적어줄 필요없이 유동적으로 변수를 저장할 수 있다는 특징이 있다.

- 하지만 자바 스크립트는 런타임에서 데이터 타입이 저장되기 때문에 몇차례의 변수 데이터 타입을 바꾼 뒤, 이를 이용하려면 에러가 발생하는 경우가 잦다.

- 이를 보완하기 위해서 타임 스크립트가 등장했다.

// 5. Dynamic typing : dynamically typed language
let text = 'hello';
console.log(text.charAt(0)); // h
console.log(`value: ${text}, type: ${typeof text}`);
text = 1;
console.log(`value: ${text}, type: ${typeof text}`);
text = '7' + 5; // 문자와 숫자의 더하기 연산자는 문자끼리의 합으로 됨
console.log(`value: ${text}, type: ${typeof text}`);
text = '8' / '2'; // 문자와 문자의 나누기 연산자는 숫자끼리의 나누기로 됨
console.log(`value: ${text}, type: ${typeof text}`);
// console.log(text.charAt(0)); > 에러 / 자바 스크립트는 런타임에서 데이터 타입이 정해지기때문에 에러가 발생하는 경우가 많다.
// 이를 보완한게 타입 스크립트이다.

 

 

 

2-1. number

- 숫자와 관련된 에러 : infinity, -infinity, NaN

- bigInt: 원래 자바 스크립트에서 숫자는 -2의 53제곱부터 2의 53제곱까지만 쓸 수 있었는데 bigInt를 사용하면 더 사용할 수 있다.

// number
const count = 17; // integer
const size = 17.1; // decimal number
console.log(`value: ${count}, type: ${typeof count}`); // value: 17, type: number
console.log(`value: ${size}, type: ${typeof size}`); // value: 17.1, type: number

// number - special numeric values: infinnity, -infinity, NaN
const infinity = 1/0;
const negativeInfinity = -1/0
const nAn = 'not a number' / 2;
console.log(infinity);
console.log(negativeInfinity);
console.log(nAn);

// bigInt (fairly new, don't use it yet)
const bigInt = 1234567890123567123123123123n; // over (-2**53 ~ 2**53)
Number.MAX_SAFE_INTEGER;

 

2-2. string

// string
const char = 'c';
const brendan ='brendan';
const greeting = 'hello';
console.log(`value: ${greeting}, type: ${typeof greeting}`) // value: hello, type: string
const helloBob = `hi ${brendan}!`; // template literals (string)

 

2-3. boolean

- 다른 프로그래밍 언어와 비슷하다.

// boolean
// false: 0, null, undefined, NaN, ''
// true: any other value
const canRead = true;
const test = 3 < 1; // false
console.log(`value: ${canRead}, type: ${typeof canRead}`); // >>> value: true, type: boolean
console.log(`value: ${test}, type: ${typeof test}`); // >>> value: false, type: boolean

 

2-4. null, undefined

- null은 비어있는 값을 할당한 것이고, undefined는 값이 아무것도 할당되지 않은 것이다.

// null
let nothing = null; // null로 값이 할당되어있는 경우
console.log(`value: ${nothing}, type: ${typeof nothing}`); // >>> value: null, type: object

// undefined
let x; // 아무것도 할당되지 않은 경우
console.log(`value: ${x}, type: ${typeof x}`); // >>> value: undefined, type: undefined

 

2-5. symbol

- 맵이나 다른 구간에서 고유한 식별자가 필요하거나 우선순위를 주고 싶을 때 사용한다.
- string으로 식별자를 줄 경우 값이 중복될 수 있지만 Symbol은 고유한 값을 가지고 있다.

// symbol, create unique identifiers for objects
// 맵이나 다른 구간에서 고유한 식별자가 필요하거나 우선순위를 주고 싶을 때 사용한다.
// string으로 줄 경우 값이 중복될 수 있지만 Symbol은 고유한 값을 가지고 있다.
const symbol1 = Symbol('id');
const symbol2 = Symbol('id');
console.log(symbol1 == symbol2)

// 같은 식별자를 가지게 하는 경우
const gsymbol1 = Symbol.for('id');
const gsymbol2 = Symbol.for('id');
console.log(gsymbol1 == gsymbol2); // true
console.log(`value: ${symbol1.description}, type: ${typeof symbol1}`);

 

2-6. object

- 박스 형태로 객체를 줄 때 사용한다.
- 파이썬의 딕셔너리와 비슷한 형태이다.

- const로 object의 값을 할당한다면 해당 object는 변경이 불가능하지만 object 내부의 값은 변경이 가능하다.

// object, real-life object, data structure
// hanbin은 const여서 변경이 불가능하지만 hanbin object 내부의 값(name, age)은 변경이 가능하다.
const hanbin = {name: 'hanbin', age: 20};
hanbin.age = 25;