🔡 문자형
⌨︎ 입력
const name = "Mike"; //문자형 string
const age = 30;
const name1 = "Mike"
const name2 = 'Mike'
const name3 = `Mike`
const message = "I'm a boy.";
const message2 = 'I\'m a boy.';
const message3 = `My name is ${name}`;
console.log(message3)- 문자형인 string은 ""(큰따옴표),''(작은따옴표),``(백틱)으로 표현가능하다.
큰따옴표, 작은따옴표는 상관없다.
- '를 표현하고 싶은 경우
- ""(큰따옴표)안에 '(작은따옴표)를 넣기
- 작은따옴표로 감싼 문장에 작은따옴표를 출력하고 싶으면 \(역슬래시)를 이용하여 'I\'m a boy.'와 같이 나타내면 된다!
(역슬래쉬를 앞에 넣어주면 특수문자로 인식하기 떄문)
- ``(백틱)은 문자열 내부의 변수를 표현해줄때
사용하면 편리하다. 변수는 ${ } 중괄호 안에 변수를 넣어주면된다.
💻실행결과
${ }를 이용하였더니 변수명이 string문장 안에서 무사히 출력됬음을 알 수 있다.
⌨︎ 입력
const message4 = `나는 ${30+1}살 입니다`;
console.log(message4)💻 실행결과
나는 31살 입니다이렇게 바로 표현식을 넣을 수도 있다!
🔢 숫자형
숫자형은 사칙연산이 가능하다! +, - , *, /, %
⌨︎ 입력
const age = 30; // 숫자형 Number
const PI = 3.14;
console.log(1 + 2); // 더하기
console.log(10 - 3); // 빼기
console.log(3 * 2); // * 곱하기
console.log(6 / 3); // / 나누기
console.log(6 % 4) // % 나머지💻 실행결과
3
7
6
2
2%는 6을 4로 나눈 나머지 값을 의미한다.
그렇다면 0을 나누면 어떻게 될까?
⌨︎ 입력
const x = 1/0; /// ???
console.log(x)💻 실행결과
infinity숫자를 0으로 나누면 infinity(무한대)가 나온다.
이번에는 문자형을 숫자형으로 나누어보자😆
⌨︎ 입력
const name = "Mike";
const y = name/2;
console.log(y)💻 실행결과
NaN문자열을 숫자로 나누면 NaN이 나온다.
NaN은 Not a number의 약자로 숫자가 아니라는 뜻이다.
숫자와 관련된 작업을 할 때 NaN인지 아닌지 항상 염두하면서 작업을 하여야 한다!
🕵♀ Boolean
boolean은 true와 false를 반환하여 참거짓을 알려주는 것을 의미한다.
이 때 true는 참, false는 거짓을 뜻한다.
⌨︎ 입력
// Boolean
const a = true; // 참
const b = false; // 거짓
const name = "Mike";
const age = 30;
console.log(name == 'Mike')
console.log(age > 40)💻 실행결과
true
falsename이 Mike인지, age가 40초과인지 체크하는 것이다.
name은 Mike 이므로 true값이, age는 30으로 선언되었으므로 40보다 작으므로
false값이 출력된다.
❎ null & undefined
null : 존재하지않는 값
undefined : 값이 할당되지 않음
⌨︎ 입력
// null과 undefined
let age;
console.log(age)💻 실행결과
undefined변수를 할당하고 하무것도 할당하지 않으면 undefined를 출력한다.
let user = null;변수에 null을 할당하게 되면 user는 존재하지 않는다는 것으로 이해하면 된다.
이외에도 객체형과 심볼형이 있는데 다음에 자세히 알아보도록 하자!
✔️ type of
type of 연산자는 변수의 자료형을 알아 낼 수 있다.
⌨︎ 입력
// type of 연산자
const name = "Mike'
console.log(typeof 3);
console.log(typeof name);
console.log(typeof true);
console.log(typeof "xxx");
console.log(typeof null);
console.log(typeof undefined);💻 실행결과
| 코드 | console | type |
|---|---|---|
| 3 | number | 숫자형 |
| name | string | 문자형 |
| true | boolean | Boolean |
| "xxx" | string | 문자형 |
| null | object | |
| undefined | undefined | 값 할당 x |
변수를 사용하는 개발자가 직접 작성했다면 typeof 연산자를 쓸 필요가 거의 없겠지만
다른 개발자들이 작성한 변수의 type을 알아야하거나 API통신 등을 통해 받아온 데이터를
타입에 따라 다른 방식으로 처리해야할 때 많이 사용된다.
typeof null이 object가 나왔는데 object는 객체형이다!
하지만 null은 객체가 아니다! (자바스크립트 초기버전의 오류이나
하위호환성을 유지하기 위해 수정하지는 않고있다)
🔍 추가사항
1.아까 `` 백틱으로 ${ }를 이용하여 문자열 안에 변수를 출력할 때
``(백틱)이 아닌""따옴표를 이용하게 되면 ${ } 가 그대로 노출되니 주의하자!
⌨︎ 입력
const name = "Mike";
const message = `My name is ${name}`;
const message2 = "My name is ${name};
console.log(message2)💻 실행결과
"My name is ${name}"2.숫자형에서 +를 사용하였는데 문자열도 +를 사용할 수 있다.
⌨︎ 입력
const name = "Mike"
const a = "나는 ";
const b = " 입니다.";
console.log(a + name + b);💻 실행결과
나는 Mike 입니다.문자형과 문자형을 더해주면 하나의 문자로 합쳐준다.
3.숫자형과 문자형을 섞어서 더할 수도 있다.
이럴 때에는 문자형으로 변경된다는 점을 알고 있어야 한다.
⌨︎ 입력
const name = "Mike"
const a = "나는 ";
const b = "입니다.";
console.log(a + name + b);
const age = 30; // number
console.log(a + age + "살" + b)💻 실행결과
나는 Mike 입니다.
나는 30살 입니다.