[JS] 기본 데이터 타입 1 | TIL # 2

velg·2021년 8월 3일
0

JavaScript

목록 보기
2/12

자바 스크립트의 데이터 타입에 대해 알아보자!


Data Type

자바스크립트는 느슨한 타입 (loosely typed) 언어, 혹은 동적 (dynamic) 언어이다.
때문에 변수 타입을 미리 선언하지 않아도 프로그램이 처리되는 과정에서 자동으로 파악될 것이다.


기본 Data Type

자바스크립트에는 기본 자료형 6개가 존재한다.

  • Number
  • String
  • Boolean
  • Null
  • Undefined
  • Symbol

JavaScript에서 오브젝트를 제외한 모든 값은 변경 불가능한 값 (immutable value) 이며 이런 값을 'primitive value values'(원시 값) 라고 말한다

원시 값 - 객체가 아니면서 메서드도 가지지 않는 데이터

그런데 불변하다는게 어떤거죠? 🤔

예시로 알아보자

예제 1 (string)

// string - immutable
let str = "data";

console.log(str); // "data"
str.toUpperCase();
console.log(str); // "data"
str = str.toUpperCase(); // 새로운 값으로 교체
console.log(str); // "DATA"

string은 메서드를 사용해도 변형 되지 않는다.
대입은 교체하는 것이기 때문에 가능하다.


예제 2 (string)

// string - immutable
let str = "data";

str[0] = "type"; // #1
console.log(str) // "DATA";
str = "type"; // #2
cosnole.log(str) // "type";

둘 다 대입연산을 하지만
#1 는 기존 값 중 해당 부분만을 '변형'하는 것이라 불가능하고
#2 는 값 자체를 '교체'하는 것이기에 가능하다.(개인적인 생각)


예제 3 (array)

// array - mutable
let arr = [];

console.log(arr); // []
arr.push("Type");
console.log(arr); // ["Type"]

arr[0] = "Mutable";
console.log(arr); // ["Mutable"]

array는 원시 값이 아니기에 다 된다.


Number

단순하게 1, 2, 3 ... 등 우리가 생각하는 숫자를 표현하는 데이터 타입이다.
사용법의 대부분이 기본 수학적 지식과 동일하기 때문에 '+를 하면 더해지고 -하면 빼지나?' 라고 생각하면 대부분 맞는다.

대입연산자(=), 나머지 연산자(%) 등등 다른 개념도 있다!

NaN? 🤔

JavaScript에는 특이하게 'NaN'이 존재한다.
NaN은 'Not a Number'의 줄임말로 값이 숫자가 아닐 때 표현 된다.

let num = 5;
let str = "mango";

// 연산시 대상이 숫자가 아니었을 때 알려주며
console.log(num / str); // NaN (연산 했는데 숫자가 아닌데?)
console.log(str * 3); // NaN (숫자랑 연산을 해야지 친구야)

// isNaN()을 통해 대상이 NaN인지 직접 알아 볼 수도 있다
console.log(isNaN(num)); // false (요건 숫자!)
console.log(isNaN(str)); // true (숫자 아님 ㅇㅇ)

String

문자를 표현하는 데이터 타입이다.
문자를 표현 할 때는 항상 ' ' 또는 " "을 사용해야 한다.

// 요러케 말이죠
const str = 'ABC';
const str2 = "DEF";

백틱(``)
ES6부터는 ``(백틱)이 추가 되었는데 사용법은 같다.

const str3 = `BACKTICK`;

백틱이 앞에 나온 방법과 다른게 무엇인가요? 🤔

  • 값에 줄바꿈 사용가능
  • 템플릿 리터널에 사용
// 이런게 가능하다.
const numbers = 
`1 1 1
2 2 2
3 3 3`;

console.log(numbers); // 1 1 1
			 2 2 2
                         3 3 3

// 그렇다면 기존 방식은?
const numbers = 
"1 1 1
2 2 2
3 3 3"; // 오류(어림도 없다. 물론 ''도 똑같다)

Expression interpolation(표현식 삽입법)
기존엔 표현식을 일반 문자열 안에 넣었다.

const str1 = "very";
const str2 = "boring";

console.log("표현식 삽입법: " + str + str2); 
// "표현식 삽입법: very boring"

템플릿 리터럴
템플릿 리터럴에서는 $와 {}를 사용하여 표현식을 표기할 수 있다

const str1 = "very";
const str2 = "good";

console.log(`템플릿 리터럴이 사용하기도, 가독성도 좋다 ${str1} ${str2}`);
// "템플릿 리터럴이 사용하기도, 가독성도 좋다 very good"

여기까지 간단하게 String을 표현하는 세 가지 방식 '' "" ``을 알아보았는데,
String은 이외에도 다룰 내용이 많으므로 다음에 따로 정리해야겠다.

다음 데이터 타입은 boolean 이지만
생각보다 글이 길어져서.. 번 글은 기까지!
끝! 🥕

profile
초보 개발자

0개의 댓글