컴퓨터 프로그래밍에서는 데이터를 처리하는 것이 매우 중요한 일입니다. 이번 시간에는 자바스크립트라는 컴퓨터 언어에 어떤 형태의 데이터가 있는지 살펴보고, 각각의 특징에 대해 살펴보겠습니다.
자바스크립트의 다양한 데이터 타입을 살펴보겠습니다. (MDN | JavaScript Data Type)
✔️ 기본 자료형 (Primitive) 인 여섯 가지 데이터 타입
✔️ 별도로 Object(객체) 도 있음
typeof
연산자를 배우겠습니다.typeof
연산자를 통해 이 값, 이 변수는 무슨 데이터 타입인지 알 수 있습니다.typeof
연산자를 적용하면 다음 문자열 중 하나를 반환합니다.typeof
연산자는 다음과 같이 사용합니다.let msg = "message";
console.log(typeof msg); // "string"
console.log(typeof 100); // "number"
typeof null
→ "object"
console.log(typeof []);
"object"
입니다.typeof
연산자로 배열을 확인하면 "object"
가 출력된다는 것만 기억하시고 넘어가주세요.1 + 1 // 더하기
2 - 1 // 빼기
2 * 4 // 곱하기
6 / 2 // 나누기
" "
) 혹은 작은따옴표(' '
)로 감싼 모든 표현을 뜻합니다.// 문자열 데이터 타입 변수 선언
let name = "wecode";
// .length >> 문자열이 몇 글자로 되어 있는지 확인
name.length // 5
// .toUpperCase >> 문자열을 대문자로 출력
name.toUpperCase() // "WECODE"
// .indexOf >> 특정 텍스트의 포함 유무 및 위치 확인
name.indexOf('c') // 2
name.indexOf('j') // -1
alert("안녕하세요! " + userName + "님");
console.log("안녕" + "하세요");
console.log("안녕" + "하" + "세요");
console.log("안녕" + "하세" + "" + "요");
let hi = "안녕";
console.log(hi + "하세요");
let ha = "하세요";
console.log(hi + ha);
let message = "감사합니다., ";
let userName = "김개발";
let banger = "님!";
let customMess = message + userName + banger;
console.log(customMess);
이제는 텍스트인 String과 숫자인 Number의 조합을 해보려고 합니다. 아래의 결과는 무엇이라고 나오나요?
console.log("2" + "2");
우리가 보기에는 둘 다 숫자인데, " "
(쌍따옴표)로 감싸져 있기때문에 컴퓨터는 숫자라고 인식하지 않습니다. 그래서 2라는 텍스트(1)와 2라는 텍스트(2)가 붙은 22 라는 문자열이 출력됩니다. 숫자로 표현하려면 쌍따옴표가 없어야 합니다.
console.log(2 + 2); // 숫자 4
이렇게 컴퓨터는 각각의 값이 텍스트인지, 숫자인지 타입을 갖고 있습니다. JavaScript에서는 텍스트와 숫자를 구분하는 것은 " "
(쌍따옴표) 입니다. 그렇다면 아래의 변수 중에 무엇이 숫자이고, 무엇이 텍스트인지 아시겠나요?
const iAmString = "983";
const iAmNumber = 983;
const iAmStringToo = "0";
const iAmNumberToo = 0;
const iAmAlsoString = "-10";
const iAmAlsoNumber = -10;
숫자를 " "
(따옴표)로 감싸지 않은 다음의 결과는 무엇 일까요?
alert("2 더하기 2는 " + 2 + 2);
실행해보셨나요? 우리가 원하는 결과가 아닙니다. 프로그래밍은 왼쪽에서부터 순서대로 실행되기 때문에 다음과 같은 결과가 나온 것입니다.
String + Number
를 시도할 때는 항상 주의해야 합니다.문자열이냐 숫자냐에 따라 결과가 많이 달라지므로 데이터 타입을 정확하게 표현하는 것에 관심을 가질 필요가 있습니다.
true
/ false
✔️ true
로 변환되는 값
{ }
, [ ]
포함)✔️ false
로 변환되는 값
" "
(빈문자열)NaN
null
undefined
true
/false
값을 판단하여 if문을 실행합니다.let sam = 3;
if (sam === 3) { //sam === 3 이 true이면
// 실행
}
아래의 코드를 보겠습니다.
let msg = "message";
if (msg) {
// 실행
}
" "
(빈 문자열)을 제외하고 모두 true
값을 갖습니다.msg
부분은 true
가 되고, if문이 실행됩니다.아래의 if문은 숫자 0이 false
로 변환되는 예시입니다. if문이 실행되지 않습니다.
let number = 0;
if (number) {
// 실행 안됨
}
let
, const
키워드를 사용해서 변수를 정의할 때 초기화 하지 않았다면, 즉 변수를 선언만 하고 값을 할당하지 않았다면 변수에는 undefined
가 할당됩니다.let msg;
console.log(msg === undefined); //true (msg는 선언만 하고, 초기화 하지 않았습니다.)
typeof null
로 확인해보면 "object"
라고 나옵니다.null
은 말그대로 아무것도 아닌 빈 객체를 가리키고 있어서 "object"
라고 나옵니다.const person = {
name : "wecode",
age : 30,
skills : ['HTML', 'CSS', 'Javascript']
}
// 삭제하지 마세요.
function checkType(data) {
let type = typeof data;
let description = `${data}: type - ${type}`;
console.log(description);
return description;
}
// 알고 싶은 데이터 타입을 확인해보세요.
checkType(4);
checkType("true");
checkType(true);
checkType(!0);
checkType(function() {});
// 아래의 코드는 절대로 수정하거나 삭제하지 마세요.
module.exports = {checkType};