[JavaScript] Data types - let, var, hoisting

데이터 타입

Posted by dongjune on January 6, 2021

let vs var

ES6 문법부터는 변수 선언시 var를 사용하지 않고 let을 사용합니다.

var를 사용하면 안되는 이유는 var hoisting 때문인데, var hoisting이란 선언이 어디에 있는지 상관없이 선언을 항상 맨 위로 올려주는 것을 뜻합니다.

따라서 var는 다음의 코드에서 error가 나타나지 않지만, let은 error가 나타납니다.

1
2
3
4
5
6
7
// no error because of "hoisting"
age = 4;
var age; 

// error
age = 4;
let age;

또한 var는 철저히 block scope을 무시합니다. var가 block scope 안에서 선언됐다 해도 어느곳에서나 var를 참조할 수 있습니다.

1
2
3
4
5
6
7
8
9
10
{
    var age = 4;
}
console.log(age); // 출력 : 4

{
    let hi = 4;
}
console.log(hi); // Uncaught ReferenceError: hi is not defined

이러한 var의 안전하지 않은 특성 때문에 규모가 큰 javascript 프로젝트에서는 많은 문제점이 발생합니다.

따라서 많은 전문가들이 var보다는 let을 사용하는 것을 권장합니다.

const

위에서 설명한 let과 var는 선언 뒤에도 값을 변경할 수 있는 mutable 데이터 타입입니다.

반면에 const는 값을 변경할 수 없는 Immutable 데이터 타입입니다.

많은 경우에서, 다음의 이유들 때문에 immutable 데이터 타입을 사용하는 것이 권장됩니다.

  1. security

    외부에서 값을 변경하지 못하도록 하여 보안상의 이점이 있다.

  2. thread safety

    여러 thread들이 동시에 값을 변경하려고 하는 문제를 방지한다.

  3. reduce human mistakes

    실수로 값을 변경하여 발생하는 에러를 방지한다.

Variable types

1. number

자바 스크립트는 숫자형 데이터 타입으로 number만 사용합니다.

1
2
3
4
5
// 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

Infinity로 무한대를 표현 할 수 있고 유효하지 않은 값은 NaN으로 표현합니다.

1
2
3
4
5
6
7
// number - speicla numeric values: infinity, -infinity, NaN
const infinity = 1 / 0;
const negativeInfinity = -1 / 0;
const nAn = 'not a number' / 2;
console.log(infinity); // 출력 : Infinity
console.log(negativeInfinity); // 출력 : -Infinity
console.log(nAn); // 출력 : NaN

2. string

C,Java 등의 언어는 문자 한 글자를 char형으로 표현하지만 javascript 는 모두 string으로 표현합니다.

1
2
3
4
5
// string
const char = 'c';
const hi = 'hi world';
console.log(`value: ${char}, type: ${typeof char}`); // value: c, type: string
console.log(`value: ${hi}, type: ${typeof hi}`); // value: hi world, type: string

3. boolean

true, false를 나타내는 data type입니다.

false를 나타내는 것으로는 0, null, undefined, NaN, ‘’ 가 있고, 이것을 제외한 모든 값은 true를 의미합니다.

1
2
3
4
5
6
7
// 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

4. null 과 undefined

null 과 undefined는 비슷하지만 조금은 다른 개념입니다.

null은 비어있다는 것을 명시해주는 데이터 타입이지만 undefined는 값이 할당되지 않은 상태입니다.

1
2
3
4
5
6
7
// null
let nothing = 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

5. Symbol

Symbol은 Object의 식별자를 위해 사용됩니다.

1
2
3
4
5
6
7
8
9
// symbol, create unique identifiers for objects
const symbol1 = Symbol('id');
const symbol2 = Symbol('id');
console.log(symbol1 === symbol2); // false

const gSymbol1 = Symbol.for('id');
const gSymbol2 = Symbol.for('id');
console.log(gSymbol1 === gSymbol2); // true
console.log(`value: ${symbol1.description}, type: ${typeof symbol1}`); // 출력 : value: id, type: symbol