본문 바로가기
JavaScript

[JavaScript/자바스크립트] 리터럴과 타입

by hans-j 2022. 12. 23.

리터럴이란 사람이 이해할 수 있는 문자 또는 미리 약속된 기호로 표기한 코드.

리터럴은 값으로 평가된다. 따라서 리터럴도 표현식.
** 값으로 평가될 수 있는문은 모두 표현식**

 

리터럴의 종류는 아래와 같음..엄청 많네

정수 리터럴

부동소수점 리터럴

2진수 리터럴

8진수 리터럴

16진수 리터럴

문자열 리터럴

불리언 리터럴

null 리터럴

undefined 리터럴

객체 리터럴

배열 리터럴

함수 리터럴

정규 표현식 리터럴

템플릿 리터럴(ES6)

 

ES6부터 새로 도입된 문자열 표기법 템플릿 리터럴

작은따옴표(' ') 혹은 큰따옴표(" ")같은 일반적인 따옴표 대신 백틱(` `) 을 사용해서 표현한다. 
ex) 'Template literal`


원시 타입 : 객체가 아니면서 메서드도 가지지 않는 데이터타입

숫자타입 // 숫자 타입은 모두 실수(float)로 처리된다.

var integer = 2; // 정수
var double = 10.12; // 실수
var negative = -20; // 음의 정수
console.log(10 / 0); // Infinity
console.log(10 / -0); // -Infinity
console.log(1 * ' String '); // NaN (Not a Number)

문자열 타입

var string;
string = '문자열'; // 작은따옴표
string = '문자열'; //큰따옴표
string = `문자열`; //백틱(ES6)

~ES5

var first = 'Eun-woo';
var last = 'Cha';

console.log('My name is '+ first + ' '+ last + '.');

ES6

var first = 'Eun-woo';
var last = 'Cha';

console.log(`My name is ${first} ${last}. `); //백틱으로 감싸기 !

불리언 타입

var foo = true;
console.log(foo);

undefined 타입

var foo ;
console.log(foo); //undefined

null타입

변수에 값이 없다는 것을 의도적으로 명시할 때 사용. 

변수에 null을 할당하는 것은 변수가 이전에 참조하던 값을 더이상 참조하지 않겠다는 의미.


심벌(symbol)타입

다른값과 중복되지 않는 유일무이한 값

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

symbol 함수를 호출해 생성.

//심벌 값 생성
var key = Symbol('key');
console.log(typeof key);

// 객체 생성
var obj = {};

//유일무이한 값인 심벌을 프로퍼티 키로 사용한다.
obj[key] = 'value';
console.log(obj[key]);

 

여기까지가 원시 타입(원시 값 / 원시 자료형)

모든 원시 값은 불변하여 변형할 수 없다.

원시값을 할당한 변수를 혼동하지 않는 것이 중요!


참조형 타입 : 원시형 타입을 제외한 모든 타입

객체 (object)

foo = {}; //객체
console.log(typeof foo);
var car2 = { name : '소나타', price : 50000 };
car2['name'] = '그랜저';
console.log(car2['name']);
<script>
      var car2 = { name: "소나타", price: [50000, 3000, 4000] };
      document.querySelector('.car-price').innerHTML;
      console.log(car2.price[0]);
</script> 
//원하는 데이터 출력하기

 

배열 (순서대로 데이터를 넣기 때문에 데이터의 양이 많다면 객체를 이용하는 것이 낫다.)

foo = []; //배열
console.log(typeof foo);
//JS에서는 배열도 객체이기때문에 출력값은 object
var car = ['소나타', 50000, 'white'];
car[1] = 60000;
console.log(car[1]);

 

함수

foo = function (){}; //함수
console.log(typeof foo);

함께보면 좋은 포스트 

https://www.zerocho.com/category/JavaScript/post/572c6f759a5f1c4db2481ee3

 

https://www.zerocho.com/category/JavaScript/post/572c6f759a5f1c4db2481ee3

 

www.zerocho.com

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array

 

Array - JavaScript | MDN

JavaScript Array 클래스는 리스트 형태의 고수준 객체인 배열을 생성할 때 사용하는 전역 객체입니다.

developer.mozilla.org


**모던 자바스크립트 deep dive (이응모 선생님), 코딩애플 강의를 듣고 참고하여 작성하는 글입니다 **