값과 console.log

console.log(2 + 3)은 5를 출력하지만 console.log("2 + 3")은 2 + 3을 그대로 출력합니다. 따옴표가 계산할지 그대로 옮길지를 정합니다.

프로그램이 다루는 것은 모두 값입니다

프로그램은 데이터를 다룹니다. 가격, 이름, 점수, 예나 아니요로 답하는 질문의 답 같은 것들입니다. 데이터 한 조각 한 조각을 값이라고 합니다. 숫자 42도 값이고, 글자 "Seoul"도 값이고, 참이라는 답 true도 값입니다. 모든 값에는 타입(자료형)이 있습니다. 타입은 그 값이 어떤 종류인지, 그 값으로 무엇을 할 수 있는지 알려 줍니다. 숫자 둘은 곱할 수 있지만 이름 둘을 곱하는 것은 말이 안 되니, 자바스크립트는 어느 것이 어느 종류인지 알아야 합니다.

기본 타입

자바스크립트에서는 정수와 소수가 모두 하나의 숫자 타입이라서 7과 7.5는 둘 다 number입니다. 문자열은 따옴표 사이에 쓴 글자들의 줄입니다. 양쪽 끝이 같기만 하면 작은따옴표와 큰따옴표 모두 쓸 수 있습니다. 불리언은 true와 false 두 값만 있고 따옴표 없이 씁니다. 마지막 두 개 undefined와 null은 둘 다 「여기 아무것도 없음」을 뜻하며, 변수에 값을 넣지 않았을 때 다시 만나게 됩니다. ECMAScript 표준에는 BigInt와 Symbol도 있지만 이 과정에서는 쓰지 않습니다.

따옴표가 타입을 바꿉니다

값 42와 값 "42"는 출력하면 똑같아 보이지만 타입이 다릅니다. 앞의 것은 계산할 수 있는 숫자이고, 뒤의 것은 글자 4와 2로 된 문자열입니다. 연산자 typeof는 어떤 값의 타입을 알려 줍니다. 지금 다루는 값이 무엇인지 빠르게 확인할 때 씁니다.

console.log(typeof 42);       // number
console.log(typeof "42");     // string
console.log(typeof true);     // boolean
console.log(typeof "true");   // string

계산도 마찬가지입니다. 따옴표가 없으면 자바스크립트가 식을 먼저 계산해서 결과를 출력합니다. 따옴표가 있으면 글자이므로 적힌 그대로 출력합니다.

console.log(2 + 3);     // 5
console.log("2 + 3");   // 2 + 3

2 + 3이나 typeof 42처럼 값을 만들어 내는 코드 조각을 식(expression)이라고 합니다. 자바스크립트는 식을 만나면 평가합니다. 식을 값 하나로 줄인 뒤 그 값을 쓴다는 뜻입니다. console.log(2 + 3)에서는 console.log가 받기 전에 식이 먼저 5로 평가됩니다.

값 여러 개를 한 번에 출력하기

console.log에는 값을 여러 개 넣을 수 있습니다. 쉼표로 나누면 한 줄에 사이사이 빈칸 하나씩 띄워서 출력합니다.

console.log("Age:", 30);              // Age: 30
console.log("Sum:", 4 + 5, "units");  // Sum: 9 units

작업하면서 출력에 이름표를 붙이는 가장 쉬운 방법입니다. 위의 "Sum:"처럼 이름표를 붙여 값을 출력하는 것은 프로그램이 단계마다 무엇을 하는지 확인할 때 프로그래머가 늘 쓰는 방법입니다. 뭔가 이상하게 움직이면 보통 console.log를 하나 넣고 들여다보는 데서 시작합니다.

풀이 예시

예 1. console.log(10 - 4)는 식을 먼저 계산하므로 6을 출력합니다. 예 2. console.log("10 - 4")는 문자열이므로 10 - 4를 출력합니다. 예 3. console.log(typeof "")는 string을 출력합니다. 사이에 아무것도 없는 따옴표 두 개도 문자열이고, 이것을 빈 문자열이라고 합니다. 예 4. console.log(typeof 3.0)는 number를 출력합니다. 소수를 위한 타입이 따로 있지 않습니다.