오늘은 ES6의 주요기능들중에서 템플릿리터럴과 구조분해할당을 학습하였다.
템플릿 리터럴이란 문자열 표기법 중 하나인데,

기존방식의 문자열 연결 방식은

위 사진에서 보는바와 같이 "" 기호와 +를 이용하여 문자열과 변수를 이용해 연결하였다. 상황에 따라 다르지만 길어질수록 가독성과 효율성이 떨어질 수 있다.

이번에 배운 템플릿리터럴을 이용한 문자열 연결 방식은 ` (백틱)을 이용하는 것인데


위 사진과 같이 백틱을 사용하게되면 +를 사용할 필요없이 글을 쓰면되고 변수가 들어가는 경우에는 ${}의 중괄호안에 변수명을 사용하면된다.

구조분해할당이란 객체의 key 와 value가 동일한 이름을 가지고 있을때 value를 생략해서 작성할 수 있도록 하는 것을 말한다.

구조분해할당은 객체와 배열 모두 이용 가능한 기술이다. 하지만 두가지 방법에는 큰 차이점이 있다.

객체 구조분해할당의 경우에는 순서와는 상관이없지만 반드시 변수명이 동일해야 오류가 생기지 않는다.

이와는반대로

배열 구조분해할당의 경우에는 변수명은 변경되어도 상관없지만 요소의 순서가 맞지 않으면 여러가지 값들이 오류가 날 수 있다.

import와 export의 기능에대해서도 간단하게 알아보았다.

퍼사드형태로 읽기 좋게 만들었지만, 같은 js파일안에 각각의 함수들이 다존재하고 있어 헤깔릴수 있다. 이때 함수별로 js파일을 따로 두고 js파일의 함수에 export를 설정해둔 후
퍼스드형태의 함수가 있는 js파일 상단에 import {함수명} from "js파일주소"를 입력하면
조금더 깔끔하고 정리가 된 상태로 코드들을 볼 수 있도록 도와주는 것 같다.

profile
안녕하세요.

0개의 댓글