모던 자바스크립트 (스터디) 5장 ~ 6장

표현식과 문

값이란?

식(표현식)이 평가되어 생선된 결과를 말한다.

편가란 식을 해석해서 값을 생성하거나 참조하는 것을 의미한다.

 

변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름이다.

따라서 변수에 할당되는 것은 값이다.

 

값은 다양한 방법으로 생성할 수 있는데 기본적인 방법은 리터럴을 사용하는 것이다.

 

리터럴이란?

사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생섯하는 표기법

사람이 이해할 수 있는 아라비아 숫자를 사용해 숫자 리터럴3을 코드에 기술하면 자바스크립트 엔진은 이를 평가해 숫자 값 3을 생성한다.

 

리터럴은 사람이 이해할 수 있는 문자 또는 미리 약속된 기호('',"",[]...등)로 표기된 코드이다.

자바스크립트 엔진은 코드가 실행되는 시점임 런타임에 리터럴을 평가해 값을 생성한다.

 

리터럴을 사용하여 생선한 다양한 종류의 값

리터럴	예시
정수 리터럴	100
부동소수점 리터럴	10.5
2진수 리터럴	0b01000001
8진수 리터럴	0o101
16진수 리터럴	0x41
문자열 리터럴	'Hello' "world"
불리언 리터럴	true false
null 리터럴	null
undefined 리터럴	undefined
객체 리터럴	{ name: 'Lee', address: 'Seoul'}
배열 리터럴	[ 1, 2, 3 ]
함수 리터럴	function() {}
정규 표현식 리터럴	/[A-Z]+/g

 

표현식이란?

값으로 평가될 수 있는 문, 즉 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조한다.

var score = 100

100은 리터럴이다. 리터럴 100은 자바스크립트 엔진에 의해 평가되어 값을 생성하므로 리터럴은 그자체로 표현식이다.

var score = 50 + 50
// 50+50 = 100

score
// 100

식별자 참조는 값을 생성하지는 않지만 값으로 평가되므로 표현식이다.

 

값으로 평가될 수 있는 문은 모두 표현식이다.

 

문이란?

프로그램을 구성하는 기본 단위이자 최소 실행 단위다.

 

문은 여러 토큰으로 구성된다.

토큰이란?

문법적인 의미를 가지며, 문법적으로 더 이상 나눌 수 없는 코드의 기본 요소를 의미

예를들어 키워드, 식별자, 연산자, 리터럴, 세미콜론이나 마침표 등의 특수기호는 문법적인의미를 가지며, 문법적으로 더 이상 나눌 수 없는 코드이 기본 요소이므로 모두 토큰이다.

 

문은 컴퓨터에서 내리는 명령이고, 문이 실행되면 명령이 실행되고 무슨일인가가 일어나게 된다.

문은 반복분, 선언문, 할당문, 조건문 등으로 구분할 수 있다.

 

세미콜론과 세미콜론 자동 삽입 기능

세미콜론은 문의 종료를 나타낸다.

0개이상의 문을 중괄호로 묶은 코드블록 {...}뒤에는 세미콜론을 붙이지 않는다. 

예) if문, for문, 함수 등의 코드블록

 

세미콜론은 생략 가능하다. 

개발자가 세미콜론 자동 삽입 기능의 동작을 제대로 예측하지 못해 제대로 활용하지 못하는 경우가 있다.

세미콜론을 반드시 붙여야 한다는 주장이 다수를 차지하지만 붙이지 말아야 한다는 주장도 설득력이 있다. 

하지만 ESLint 같은 정적 분석 도구에서도 세미콜론 사용을 기본으로 설정하고 있다.

 

표현식 문과 표현식이 아닌 문

표현식은 문의 일부일 수도 있고 그 자체로 문이 될 수도 있다.

 

표현식과 문을 구별하는 방법 

표현식인 문은 값으로 평가될 수 있는 문이며, 표현식이 아닌 문은 값으로 평가될 수 없는 문이다.

변수 선언문은 값으로 평가될 수 없다. 따라서 표현식이 아닌 문이다.

표현식인 문과 표현식이 아닌 문을 구별하는 가장 간단하고 명료한 방법은 변수에 할당해 보는 것이다.

표현식이 아닌 문은 값으로 평가할 수 없으므로 변수에 할당하면 에러가 발생한다.

var foo = var x; 
//에러발생

var foo = x = 100;
console.log(foo); // 100

표현식인 문인 할당문은 할당한 값으로 평가된다. 

즉, x = 100은 x변수에 할당한 값 100으로 평가된다.

 

데이터 타입

값의 종류, 자바스크립트의 모든 값은 데이터 타입을 갖는다. 자바스크립트(ES6)는 7개의 데이터 타입을 제공하고 원시타입, 객체타입으로 분류된다.

숫자타입

자바스크립트의 숫자 타입은 정수만을 위한 타입이 없고 모든 수를 실수로 처리한다.

정수로 표시되는 수끼리 나누더라도 실수가 나올 수 있따.

console.log(1 === 1.0); // true
console.log(4 / 2); // 2
console.log(3 / 2); // 1.5

Infinity: 양의 무한대

-Infinity : 음의 무한대

NaN: 산술 연산 불가 (자바스크립트는 대소문자를 구별하므로 NAN,Nan,nan과 같이 표현하면 에러가 발생한다)

 

문자열 타입

문자열은 0개 이상의 16비트 유니코드 문자의 집합으로 전 세계 대부분의 문자를 표현할 수 있다.

문자열을 따옴표로 감싸지 않으면 자바스크립트 엔진은 키워드나 식별자 같은 토큰으로 인식한다.

 

템플릿 리터럴

ES6부터 도입, 편리한 문자열 처리기능을 제공하고 런타임에 일반 문자열로 변환되어 처리된다. 백틱(``)을 사용해 표현한다.

 

• 멀티라인 문자열
  일반 문자열 내에서 줄바꿈 등의 공백을 표현하려면 백슬래시(\)로 시작하는 이스케이프 시퀀스를 사용해야 한다. 

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

 

• 표현식 삽입
  문자열은 문자열 연산자 +를 사용해 연결할 수 있다. 
  
  

var first = 'uri'
var last = 'choi'

// ES5 문자열 연결
console.log('my name is ' + first + ' ' + last + '.'); // my name is uri choi

템플릿 리터럴 내에서는 가독성 좋고 간편하게 문자열을 조합할 수 있다.

var first = 'uri'
var last = 'choi'

// ES6 문자열 삽입
console.log(`my name is ${first} ${last}.`); // my name is uri choi

 

 

심벌타입

변경 불가능한 원시 타입의 값, 심벌 값은 다른 값과 중복 되지 않는 유일무이한 값이다. 

주로 이름이 충돌할 위험이 없는 객체의 유일한 프로퍼티 키를 만들기 위해 사용된다.

 

데이터 타입의 필요성

 

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

값은 메모리에 저장하고 참조할 수 있어야 한다. 메모리에 값을 저장하려면 먼저 확보해야할 메모리 공간의 크기를 결정해야하는데, 몇 바이트의 메모리 공간을 사용해야 낭비와 손실 없이 값을 저장할 수 있는지를 알아야한다. 

 

컴퓨터는 한 번에 읽어 들여야 할 메모리 셀의 크기를 어떻게 알 수 있는 것일까?

score변수에 숫자타입의 값이 할당되어 있다면 자바스크립트 엔진은 score변수를 숫자 타입으로 인식한다.

숫자타입은 8바이트 단위로 저장되므로 score변수를 참조하면 8바이트 단위로 메모리 공간에 저장된 값을 읽어 들인다.

 

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

모든 값은 데이터 타입을 가지며, 메모리에 2진수, 즉 비트의 나열로 저장된다.

score변수에 할당된 값은 숫자 타입의 값이다. 따라서 score변수를 참조하면 메모리 공간의 주소에서 읽어들인 2진수를 숫자로 해석한다.

 

데이터 타입의 필요한 이유

1. 값을 저장할 때 확보해야 하는 메모리 공간의 크기를 결정하기 위해

2. 값을 참조할 때 한 번에 읽어 들여야 할 메모리 공간의 크기를 결정하기 위해

3. 메모리에서 읽어 들인 2진수를 어떻게 해석할지 결정하기 위해

 

동적 타이핑

동적 타입 언어와 정적 타입 언어

c나 자바같은 정적 타입 언어는 변수를 선어할 떄 데이터 타입을 사전에 선언해야한다. 이를 명시적 타입 선언이라고 한다.

정적 타입 언어는 컴파일 시점에 타입 체크를 수행한다. 체크를 통과하지 못했다면 에러를 발생시키고 프로그램의 실행 자체를 막는다. 

 

자바스크립트는 변수를 선언할때 타입을 선언하지 않는다. 

자바스크립트의 변수는 정적 타입 언어와 같이 미리 선언한 데이터의 타입의 값만 할당할 수 있는게 아닌 어떤 데이터 타입의 값이라도 자유럽게 할당할 수 있다.

 

자바스크립트의 변수는 선언이 아닌 할당에 의해 타입이 결정된다. 그리고 재할당에 의해 변수의 타입은 언제든지 동적으로 변할 수 있다.

 

변수는 타입을 갖지 않고 값은 타입을 갖는다. 따라서 현재 변수에 할당되어 있는 값에 의해 변수의 타입이 동적으로 결정된다고 표현하는것이 적절하다. 변수는 값에 묶여 있는 값에 대한 별명이다.

 

동적타입 언어와 변수

동적 타입 언어의 특징은 데이터 타입에 대해 무감각해질 정도로 편리하지만 위험도 도사리고 있다.

 

변수 값은 언제든지 변경될 수 있기 때문에 복잡한 프로그램에서는 변화하는 변수 값을 추적하기 어려울 수 있다.

동적 타입 언어의 변수는 값의 변경에 의해 타입도 언제든지 변경될 수 있어서 값을 확인하기 전에는 타입을 확신할 수 없다.

잘못된 예측에 의해 작성된 프로그램은 당연히 오류를 뿜어낼 것이다.

결국 동적타입 언어는 유연성은 높지만 신뢰성은 떨어진다.