💻 DEV/JavaScript

[모던자바스크립트 Deep Dive] 06장 데이터 타입

웡지 2021. 11. 4. 23:12

6.0 데이터 타입 data type이란?

  • 데이터 타입data type : 값의 종류
    • 원시타입(primitive type) : 변경불가능한 값 (리터럴을 통해 값 생성 - 심벌 제외)
      • 숫자 타입 (정수, 실수 구분 없음)
      • 문자열 타입
      • 불리언 타입 (true, false)
      • undefined 타입 (var 키워드로 선언된 변수에 암묵적으로 할당되는 값)
      • null 타입 ( 값이 없다는 것을 의도적으로 명시할 때)
      • 심벌 타입 (ES6에서 추가된 7번째 타입)
    • 객체 타입(object/reference type)
      • 객체
      • 함수
      • 배열
      • etc..

6.1 숫자 타입

console.log(1 === 1.0); // true

숫자 타입은 모두 실수로 처리된다.

숫자타입의 특별한 값

//숫자 타입의 세 가지 특별한 값
console.log(10/0); // Infinity
console.log(10 /-0); //-Infinity
console.log( 1*'String'); //NaN (Not a Number)

자바스크립트는 대소문자를 구별하므로 NAN, Nan, nan과 같이 표현하면 에러가 발생한다.

var x = nan; //ReferenceError: nan is not defined

6.2 문자열 타입

작은따옴표(''), 큰따옴표(""), 백틱(``)으로 감싼다.

6.3 템플릿 리터럴

  • 템플릿 리터럴은 런타임에 이반 문자열로 변환되어 처리된다.

6.3.1 멀티라인 문자열 ( + 이스케이프 시퀀스 escape sequence)

  • 일반 문자열 내에서 줄바꿈 등의 공백을 표현하려면 백슬래시로 시작하는 이스케이프 시퀀스를 사용해야 한다.
  • 하지만 템플릿 리터럴에서는 이스케이프 시퀀스를 사용하지 않고도 줄바꿈과 공백이 있는 그대로 적용된다.
var template = `<ul>
    <li><a href="#"Home></a></li>
</ul>`

// 출력결과
//<ul>
//    <li><a href="#"Home></a></li>
//</ul>

6.3.2 표현식 삽입 ${}

//ES5
var first = 'lala'
var last = 'Lee'

console.log('My name is' + first + '' + last + '.') // My name is lala Lee.

//ES6
var first = 'lala'
var last = 'Lee'

console.log(`My name is ${first} ${last}.`) // My name is lala Lee.

6.4 불리언 타입

true와 false의 값뿐이며 조건문에서 자주 사용한다.

6.5 undefined 타입

  • 값은 undefined 가 유일하다.
  • 변수 선언에 의해 확보된 메모리 공간은 대부분 비어 있지 않고 쓰레기 값이 들어있는데, 자바스크립트 엔진이 undefined로 초기화 한다.
  • 개발자가 의도적으로 할당하기 위한 값이 아니라 자바스크립트 엔진이 변수를 초기화 할때 사용하는 값이다.
  • !!변수에 값이 없다는 것을 명시하고 싶을 때, undefined보다는 null을 할당한다.

6.6 null 타입

의도적 부재

  • null은 변수에 값이 없다는 것을 의도적으로 명시(의도적 부재)할 때 사용한다.
  • 변수에 null을 할당하는 것은 변수가 이전에 참조하던 값(쓰레기 값)을 더 이상 참조하지 않겠다는 의미이다.
  • 함수가 유효한 값을 반환할 수 없는 경우 null을 반환한다.
    • ex) document.querySelector 메서드는 조건에 부합하는 HTML 요소를 검색할 수 없는 경우 에러 대신 null을 반환한다.

6.7 심벌 타입

  • ES6에서 추가된 7번째 타입
  • 변경불가능한 원시타입의 값
  • 다들 값과 중복되지 않는 유일무이한 값
  • 객체의 유일한 프로퍼티 키를 만들기 위해 사용한다.
  • Symbol함수를 호출해 생성한다.
var key = Symbol('key');
console.log(typeof key); //symbol

//객체 생성
var obj = {};

//이름이 충돌할 위험이 없는 유일무이한 값인 심벌을 프로퍼티 키로 사용한다.
obj[key] = 'value';
console.log(obj[key]) //value

6.8 객체 타입

  • 자바스크립트의 데이터 타입은 크게 원시타입과 객체타입으로 나뉜다.
  • 자바스크립트는 객체 기반의 언어이며, 언어 자체를 이루고 있는 모든 것이 객체이다.

6.9 데이터 타입의 필요성

6.9.1 데이터 타입에 의한 메모리 공간의 확보와 참조

  • 변수에 할당되는 값의 데이터 타입에 따라 확보해야할 메모리 공간의 크기가 결정된다.

6.9.2 데이터 타입에 의한 값의 해석

데이터 타입이 필요한 이유

  1. 값을 저장할 때 확보해야하는 메모리 공간의 크기를 결정하기 위해
  2. 값을 참조할 때 한번에 읽어 들여야 할 메모리 공간의 크기를 결정하기 위해
  3. 메모리에서 읽어 들인 2진수를 어떻게 해석할지 결정하기 위해

6.10 동적 타이핑

6.10.1 동적 타입언어(dynamic/weak type)와 정적 타입(static/strong type) 언어

1 ) 정적타입 언어

  • C나 자바같은 정적 타입언어는 변수를 선언할 때 변수에 할당할 수 있는 값의 종류, 즉 데이터 타입을 사전에 선언해야 한다.
  • 변수의 타입을 변경할 수 없으며 변수에 선언한 타입에 맞는 값만 할당할 수 있다.
  • 컴파일 시점에 타입체크 (선언한 데이터 타입에 맞는 값을 할당했는지 검사하는 처리)를 수행한다.
  • 타입체크를 통해 타입의 일관성을 강제하고 더욱 안정적인 코드의 구현을 통해 런타임에 발생하는 에러를 줄인다.
  • C, C++, 자바Java, 코틀린Kotlin, 고Go, 하스켈Haskell, 러스트Rust, 스칼라Scala

2 ) JavaScript 동적타입언어(dynamic/weak type)

  • 따로 타입을 선언하지 않는다.
  • 미리 선언한 데이터 타입의 값뿐만 아니라 어떠한 데이터 타입의 값이라도 자유롭게 할당할 수 있다.
  • typeof 연산자는 연산자 뒤에 위치한 피연산자의 데이터 타입을 문자열로 반환한다.
  • 자바스크립트의 변수는 선언이 아닌 할당에 의해 타입이 결정된다.
  • 재할당에 의해 변수의 타입은 언제든지 동적으로 변할 수 있다. : 동적 타이핑(dynamic typing)
  • 자바스크립트, 파이썬Python, PHP, 루비Ruby, 리스프Lisp, 펄Perl

6.10.2 동적 타입 언어와 변수

동적타입 언어의 구조적인 단점

  • 복잡한 프로그램에서는 변화하는 변수 값을 추적하기 어렵다.
  • 변수는 값의 변경에 의해 타입도 언제든지 변경될 수 있다.
  • 동적타입 언어의 변수는 값을 확인하기 전에는 타입을 확신할 수 없다.
  • 숫자 타입의 변수일거라 예측하여 프로그램을 작성했지만, 사실은 문자열 타입의 변수인 것처럼 잘못된 예측에 의해 프로그램을 작성하여 오류를 낼 수 있다.
  • 동적타입언어는 유연성은 높지만 신뢰성은 떨어진다.

안정적인 프로그램을 만들기 위해 데이터 타입 체크 시 주의사항

  • 변수의 무분별한 남발은 금물이다.
  • 변수의 유효범위(스코프)는 최대한 좁게 만들어 변수의 부작용을 억제한다.
  • 전역변수는 최대한 사용하지 않는다.
    • 프로그램의 복잡성을 증가시키며 처리 흐름을 추적하기 어렵게 만들고 오류 발생시 오류의 원인을 특정하기 어렵게 만든다.
  • 변수보다는 상수를 사용하여 값의변경을 억제한다.
  • 변수 이름은 변수의 목적이나 의미를 파악할 수 있도록 짓는다.

가독성이 좋은 코드가 좋은 코드다.