ES6의 특징

ES6의 특징

let과 const

전통적으로 자바스크립트는 함수스코프와 전역스코프만을 지원하여 변수의 생명주기 및 접근을 제어해왔다. 하지만 ES6에서부터는 블록스코프도 지원하게 되었다. 이를 가능하게 해주는 것이 let과 const이다.

아래의 코드는 블록 스코프를 따르는 여타 언어에서는 에러를 발생시켰을 것이다. 하지만 함수스코프와 전역스코프를 따르는 자바스크립트에서는 문제없이 작동한다. 그러나 이는 많은 에러와 버그의 원인이었으며, let과 const가 도입된 이유이다.

화살표 함수

ES6에서 소개된 가장 인상적인 기능중의 하나는 화살표 함수의 지원이다. 화살표 함수는 함수 정의를 보다 간결한 구문으로 콜백을 정의할 때 특히 유용하다.

const number = [1,2,3,4,5,6,7,8,9]
const even = number.filter(function (x) {
	return x % 2 === 0;
})

위 예시는 일반적인 함수의 예시이다.

const number = [1,2,3,4,5,6,7,8,9]
const even = number,filter(x => x % 2 === 0)

위 예시는 화살표함수로 만든 방법이다. 그 위에 일반적인 함수 방법보다 휠씬 간결하고 짧게 쓸 수 있다.


Template 표기법

const hello = "hello"
const to = 'Everybody!'

console.log(`${hello} ${to}`)
//hello Everybody

간단하다. 빽틱(키보드 Tab키 위에 1 왼쪽에 위치)으로 둘러싸고 원하는 문자열을 입력하면 된다. ${ }안에 넣고 싶은 변수를 넣으면 알아서 해당 위치에 매핑된다.


구조분해할당

let foo = ["one", "two", "three"]

let [one, two, three] = foo

console.log(one) // "one"
console.log(two) // "two"
console.log(three) // "three"

배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 표현식이다.

좋은 웹페이지 즐겨찾기