6장 데이터 타입

p59.

자바스크립트(ES6)는 7개의 데이터 타입을 제공한다. 원시 타입(숫자, 문자열, 불리언, undefined, null, 심벌) 6개와 객체 타입(객체, 함수, 배열 등)이다. 원시 타입의 값은 변경 불가능한 값(immutable value)이며 pass-by-value(값에 의한 전달)이다.

 

p60.

C나 자바와 달리 자바스크립트는 독특하게 하나의 숫자 타입만 존재한다. 모든 수를 실수로 처리하며, 정수만 표기하기 위한 데이터 타입이 별도로 존재하지 않는다.

// 숫자 타입은 모두 실수로 처리된다.
console.log(1 === 1.0); // true
console.log(4 / 2); // 2
console.log(3 / 2); // 1.5

 

p61.

NaN(not-a-number)은 산술 연산 불가로 자바스크립트는 대소문자를 구별하므로 NaN을 NAN, Nan, nan과 같이 표현하면 에러가 발생하니 주의해야 한다. null 또한 null 타입의 값은 null이 유일하고 Null, NULL 등과 다르다.

 

p62.

- 자바스크립트의 문자열은 원시 타입이며, 변경 불가능한 값(immutable value)이다.

var str = 'Hello';
str = 'world';
console.log(str); // 'world'

위의 예제에서 문자열 ‘Hello’와 ‘world’는 모두 메모리에 존재하고 있다. 변수 str은 문자열 ‘Hello’를 가리키고 있다가 문자열 ‘world’를 가리키도록 변경되었을 뿐이다.

var statement = 'I am an immutable value'; // string은 immutable value
var otherStr = statement.slice(8, 17);
console.log(otherStr);   // 'immutable'
console.log(statement);  // 'I am an immutable value'

2행에서 String 객체의 slice() 메소드는 statement 변수에 저장된 문자열을 변경하는 것이 아니라 사실은 새로운 문자열을 생성하여 반환하고 있다. 그 이유는 문자열은 변경할 수 없는 immutable value이기 때문이다.

 

- ES6부터 템플릿 리터럴(template literal)이라고 하는 새로운 문자열 표기법이 도입되었다. 템플릿 리터럴은 멀티라인 문자열, 표현식 삽입, 태그드 템플릿 등 편리한 문자열 처리 기능을 제공한다.

- 템플릿 리터럴은 런타임에 일반 문자열로 변환되어 처리되고 일반적인 따옴표 대신 백틱(``)을 사용해 표현한다.

 

p64.

* 멀티라인 문자열 (multi-line string)

일반 문자열 내에서는 줄바꿈(개행)을 \n을 통해서 하지만 템플릿 리터럴에서는 이스케이프 시퀀스를 사용하지 않고도 줄바꿈이 허용되며, 모든 공백도 있는 그대로 적용된다.

 

p.65.

* 표현식 삽입 (expression interpolation)

문자열은 문자열 연산자 +를 사용해 연결할 수 있다. + 연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작하고 그 외의 경우는 덧셈 연산자로 동작한다. 표현식을 삽입하려면 ${ }으로 표현식을 감싼다. 이때 표현식의 평가 결과가 문자열이 아니더라도 문자열로 타입이 강제로 변환되어 삽입된다.

var first = 'Ian';
var last = 'Lee';

// ES5 문자열 연결
console.log('My name is ' + first + ' ' + last + '.'); // My name is Ian Lee.

// ES6 표현식 삽입
console.log(`My name is ${first} ${last}.`); // My name is Ian Lee.

표현식 삽입은 반드시 템플릿 리터럴 내에서 사용해야 한다. 템플릿 리터럴이 아닌 일반 문자열에서의 표현식 삽입은 문자열로 취급된다.

console.log(`1 + 2 = ${1 + 2}`); // 1 + 2 = 3
console.log('1 + 2 = ${1 + 2}'); // 1 + 2 = ${1 + 2}

 

* 태그드 템플릿 (tagged template)

const Title = styled.h1`
  font-size: 1.5em;
  text-align: center;
  color: palevioletred;
`;

React styled-component에서 사용된다. 템플릿 리터럴 앞에 styled.h1이라는 객체의 속성이 붙어 있습니다. 사실 h1은 메서드(함수)입니다. 태그 함수라고 불러도 되겠네요. 함수 뒤에 템플릿 리터럴을 붙여 같이 사용하는 것입니다.

 

p70.

- 데이터 타입이 필요한 이유는 값을 저장할 때 확보해야 하는 메모리 공간의 크기, 값을 참조할 때 한 번에 읽어 들여야 할 메모리 공간의 크기, 메모리에서 읽어 들인 2진수를 어떻게 해석할지 결정하기 위해서이다.

 

- C나 자바같은 정적 타입(static/strong type) 언어는 변수를 선언할 때 변수에 할당할 수 있는 값의 종류, 즉 데이터 타입을 사전에 선언해야 한다. 이를 명시적 타입 선언(explicit type declaration)이라 한다.

 

* 정적 타입 언어 vs 동적 타입 언어

- 정적 타입 언어는 변수의 타입을 변경할 수 없으며, 변수에 선언한 타입에 맞는 값만 할당할 수 있다. 컴파일 시점에 타입 체크를 수행하고 통과하지 못했다면 에러를 발생시킴으로써 타입의 일관성을 강제하고 더욱 안정적인 코드의 구현을 통해 런타임에 발생하는 에러를 줄인다. 대표적으로 C, C++, 자바, 코틀린, 고 등이 있다.

- 동적 타입 언어는 선언이 아닌 할당에 의해 타입이 결정(타입 추론)되고 재할당에 의해 변수의 타입은 언제든지 동적으로 변할 수 있다. 이러한 특징을 동적 타이핑이라 한다. 대표적으로 자바스크립트, 파이썬, PHP, 루비 등이 있다. 동적 타입 언어는 유연성은 높지만 신뢰성은 떨어진다.