동적 타이핑 (dynamic Typing)
자바스크립트는 동적 언어로 변수를 설정할 때 미리 타입을 지정하지 않아도 상관없다.
변수의 값에 따라 타입이 지정되기 때문이다.
var ex1 = 42; // ex1은 이제 Number 임
var ex2 = "bar" // ex2는 이제 String 임
var ex3 = true // ex3는 이제 Boolean 임데이터 타입 (Data Type)
최신 ECMAScript(ES)표준은 다음과 같은 7개의 자료형을 갖는다.
- 원시 자료형 (Primitive) 6개
- Null (null)
- Boolean (True/False)
- Undefined (값이 정해지지 않음)
- Number (1, 2, 3.2, 4,-Infinity, +Infinity, NaN...)
- String ('example')
- Symbol : ES6에 추가됨
- 참조 자료형
- Object (+Array)
- Function
원시 자료형 (Primitive Type)
Object를 제외한 모든 원시 자료형 (Primitive Type)은 변경 불가능한 값(immutable Value)이다.
Javascript에서는 string, number, undefined, symbol, boolean, null, bigint 이 있다.
var ex1 = "hello";
console.log(ex1); // hello
ex1 = "hi";
console.log(ex1); // hiex1에 hello를 할당하는 순간 문자열'hello'는 메모리에 쓰여지고,
ex1은 'hello'의 문자열 메모리 주소를 참조하게 된다.
이후 ex1에 다시 hi를 할당할 때, 문자열 'hello'의 메모리를 변경하지 않고 hi를 새로운 메모리에 작성하고 그 주소를 참조하게 된다.
이런식으로 다른 메모리에 다른 String 값을 저장해두었다가 변경되는 시점에 다른 메모리 주소를 참조하게 된다.
즉, 메모리에 할당된 데이터가 변경되지 않는다.
Boolean
True와 False 두 가지 값을 가질 수 있는 논리 타입이다.
Null
null 이라는 한 가지 값만 가질 수 있다. 보통 어떠한 객체도 결과값에 해당되지 않았음을 의미한다.
null과 undefined의 차이
typeof null // "object"
typeof undefined // "undefined"
null === undefined // false
null == undefined // true
null === null // true
null == null // true
!null // true
isNaN(1 + null) // false
isNaN(1 + undefined) // true- 값을 의도적으로 비웠음 null / 값을 처음부터 할당하지 않음 undefined
Undefined
값이 할당되어 있지 않음을 뜻하며 undefined라는 값을 갖는다.
Number
64비트 형식으로 정수(int)위한 타입은 없다. +infinity, -infinity, NaN, 등이 있다.
String
16비트 부호없는 정수값 요소의 집합이다.
Symbol
ES6에서 추가된 타입으로 Object의 key로 사용할 수 있다.
유일하고 변경 불가능한 기본값이다.
문법
Symbol([description])
const symbol1 = Symbol();
const symbol2 = Symbol(42);
const symbol3 = Symbol('foo');
console.log(typeof symbol1);
// expected output: "symbol"
console.log(symbol2 === 42);
// expected output: false
console.log(symbol3.toString());
// expected output: "Symbol(foo)"
console.log(Symbol('foo') === Symbol('foo'));
// expected output: false심볼에 대한 설명을 ()안에 입력할 수 있으나, 그 값을 통해 심볼에 접근하지 못한다.
참조 자료형 (Reference Type)
Object
키(key)와 값(value)의 조합으로,
속성은 key를 통해 식별된다. key는 String 또는 Symbol로 이루어져 있다.
value는 기본 타입의 모든 값이 할당될 수 있어,
다양한 조합의 객체를 생성 할 수 있다.
다만, key값에 Symbol을 설정하는 경우에는 접근이 불가능한 경우도 있다. (for...in 반복문, JSON.Stringify())
Function (함수)
특수 자료형으로 Function이 있다.
객체(Object)의 일종으로 볼 수 있다.
타입 구분을 통해 function을 확인 할 수 있다.
Primitive Type과 Reference Type의 차이
결론적으로 두 타입은 메모리를 사용하고 복사를 하는 방법이 다르다.
let x1 = 3;
let y1 = x1;
y1 = 2
console.log(x1) // 3
console.log(y1) // 2
let x2 = {num: 1}
let y2 = x2
y2.num = 3
console.log(x2.num) // 3
console.log(y2.num) // 3위의 예제를 보면 string(Primitive Type)을 x1에 할당하여 y1에 복사하면 x1, y1은 서로 다른 메모리를 할당하여 그 값 자체를 보관한다.
하지만, 객체인 x2를 y2에 복사하게 되면 그 객체{num:1}의 주소값을 가지고와 메모리에 가지고 있는다.
때문에 서로 같은 객체의 주소값을 각각 x2, y2가 가지고있다.
때문에 x2, y2 중 어느 하나의 num이라는 key의 value를 수정하면 같은 객체가 변경되게 된다.
이러한 상황은 배열에서도 똑같이 일어난다.
때문에 배열이나 객체를 복사하여 조작하는 경우에 원본을 지켜야 한다면 추가적인 조작이 필요하다.
Spread operator (...)
let printNums = function (...arg) {
console.log(arg)
}
printNums(10,20,30); // [10,20,30]
나머지 연산으로 앞에서 특정 변수로 가져간 값들 이외의 나머지 값들을 배열에 담아 가져온다.
let arg = [10,20,30,40];
let newArr = [0,...arg];
console.log(newArr);
let book = {
title: "Hello world",
createdAt: "2020-12-07",
author: "uom",
}
let newBook = {
...book
author: "jaewon"
}
console.log(newBook)
// {title: "Hello world", createdAt: "2020-12-07", author: "jaewon"}배열이나 객체 내부의 값을 펼쳐서 할당하며, overide도 된다.
더 배우기
- 얕은 복사와 깊은 복사
