JavaScript

JavaScript의 ES란?, ES5/ES6 문법 차이

nminy 2023. 4. 9. 22:48

ES

: ECMAScript로 Ecma lnternational ECMA-262 기술 규격에 따라 정의하고 있는 표준화된 스크립트 프로그래밍 언어를 말한다. 자바스크립트를 표준화하기 위해 만들어졌다.

 

자바스크립트에서 변수는 var , let , const 세 가지 방법으로 선언할 수 있다.

var은 예전부터 사용되던 방법이며, let 과 const 는 ECMAScript 6(ES6)에서 새로 도입 된 방법이다.

// var로 변수 선언
var myVar = 'Hello JavaScript'
console.log(myVar) // 'Hello JavaScript'
// let으로 변수 선언
let myLet = 'Hello JavaScript'
console.log(myLet) // 'Hello JavaScript'
// const로 상수 선언
const myConst = 'Hello JavaScript'
console.log(myConst) // 'Hello JavaScript'

ECMAScript 6 (ES6)는 JavaScript의 버전 중 하나로, 2015년에 발표되었어요. ES6는 이전 버전인 ES5에서 새로운 문법과 기능을 도입하여 JavaScript 개발자들이 보다 쉽고 효율적으로 코드를 작성 할 수 있도록 개선했다.

기존에 변수 선언을 위해 존재하던 var 를 대체해서 나온 변수 선언이다.

 

ES6 문법

1.  let, const : 새로 도입

- let : 재할당은 가능하고, 재선언은 불가

- const : 재할당, 재선언이 불가능, 초기값이 없으면 선언 불가능

 

2. 화살표 함수 (Arrow Function) : 처음 소개된 개념

- function 이나 return 키워드 없이 함수를 만드는 방법

- this : function 은 호출을 할 때 this 가 정해지지만, 화살표 함수는 선언할 때 this 가 정해짐

 

3. 삼항 연산자 (ternary operator)

 

4. 구조 분해 할당 (Destructuring)

- 배열 [] 이나 객체 {} 의 속성을 분해해서 그 값을 변수에 담을 수 있게 해주는 문법

 

5. 단축 속성명 (property shorthand)

- 객체의 key와 value 값이 같다면, 생략 가능

 

6. 전개 구문 (Spread)

- 배열이나 객체를 전개하는 문법. 구조분해할당과 함께 정말 많이 사용됨

 

7. 나머지 매개변수(rest parameter)

 

8. 템플릿 리터럴 (Template literals)

- 여러 줄로 이뤄진 문자열과 문자 보간기능을 사용하게 만들어 주는 문자열 리터럴 표현. 백틱( ` ) 과 ${} 로 표현

 

9. named export vs default export

- default Export

- named export