JavaScript Type

Dalaran·2022년 1월 16일
0

React & JavaScript

목록 보기
7/15
post-thumbnail

JavaScript의 변수는 어떤 특정 타입과 연결되지 않기때문에 모든 타입의 값으로 할당, 재할당이 가능하다. 또한 타입은 원시 값과 객체로 나뉜다.

⚙︎ 원시 값

  1. Boolean 타입
    : 논리 요소를 나타내며 'true' 와 'false' 두 가지의 값을 가진다.
  2. Null 타입
    : 값으로 null 하나만 갖으며 어떤 값이 의도적으로 비어있음을 표현단다. (Boolean) 연산에서는 'false' 가르킨다.
  3. Undefined 타입
    : 값을 할당하지 않은 변수가 갖는 값
  4. Number 타입
    : 부동소수점, +Infinity, -Infinity, NaN(Not a Number)의 값을 갖는다.
    x / +0 = Infinity, x / -0 = -Infinity
  5. BigInt 타입
    : 임의 정밀도로 정수를 나타낼 수 있는 타입. 큰 정수도 안전하게 저장하고 연한 할 수 있다. (정수 끝에 n을 추가하거나 생성자를 호출해 생성)
    ** BigInt타입은 Number 타입과 혼합해 연산할 수 없다.
  6. String 타입
    : 텍스트 데이터를 나타낼 떄 사용한다. 16비트 부호 없는 정수 값"요소":로 구성된 집합으로 각 요소가 한 자리를 차지한다.
  • 문자열의 타입화
    문자열은 규칙만 잘 정하면 어떤 자료구조라도 문자열로 표현할 수 있다. 하지만 이는 불필요한 유지보수 등 장기적으로 봤을때 좋지않다.
    때문에 문자열은 텍스트 데이터에만 사용하는 것이 좋다.
  1. Symbol 타입
    : 고유하고 변경 불가능한 원시 값으로 객체 ㅗㄱ성 키로 사용할 수 있다.

⚙︎ 객체

객체는 속성의 컬렉션이라 할 수 있다. 객체 리터럴 구문을 사용해 제한적으로 속성을 초기화하거나 추가, 제거할 수 있다. 속성값으로 다른 객체를 포함 모든 타입을 사용할 수 있다. 이러한 속성들은 'Key'값으로 식별하며 이는 문자열, 심볼을 사용할 수있다.

** 객체의 속성으로는 데이터 속성과 접근자 속성이 있다.

⚙︎ Shallow Copy

이러한 참조 값(a)을 다른 변수(b)에 할당하게 되면 b는 a의 실체값을 할당 받는게 아니라 "주소"값을 할당받는다. 즉 a 와 b 는 같은 객체안에서 데이터를 공유하게 된다. 이러한 경우를 얕은 복사(Shallow Copy)라 하며 데이터가 의도치 않게 같이 변해버리는 위험이 있다.

⚙︎ Deep Copy

위와 같은 문제를 회피하기 위한 깊은 복사(Deep Copy)에는 몇가지 방법이 있다.
1. Object.assign()
: assign 메소드는 빈객체에 복사할 객체를 그대로 복사할 수 있다.
2. Spread 연산자

const rootObj = {
	name: Dalaran
}
const copyObj = {...rootObj}

위의 두 방법은 깊이 2 (객체안에 객체) 이상일 경우에는 얕은 복사가 발생하는 문제점이 있다.

3. lodash 모듈 사용
: npm install lodash로 모듈 설치 후 require("lodash")로 가져온 뒤 .cloneDeep()함수를 사용
이 방법은 위의 단점을 보완할수는 있지만 lodash 모듈을 설치해야만 사용할 수 있는 단점이 있다.

[참고 사이트]
https://imagineu.tistory.com/49
https://developer.mozilla.org/ko/search?q=deep+copy

0개의 댓글