ES6

OwlSuri·2022년 7월 20일
0

JavaScript

목록 보기
9/9

ES6는 무엇?

  • ECMAScript6, ECMAScript 표준의 가장 최신 버전
  • ECMA스크립트(ECMAScript, 또는 ES)는 자바스크립트를 표준화 하기위해 만들어진, ECMA-262 기술 규격에 따라 정의하고 있는 표준화된 스크립트 프로그래밍 언어

ES6의 새로운 기능

const and let
Arrow functions(화살표 함수)
Template Literals(템플릿 리터럴)
Default parameters(기본 매개 변수)
Array and object destructing(배열 및 객체 구조분해할당)
Import and export(가져오기 및 내보내기)
Promises(프로미스)
Rest parameter and Spread operator(나머지 매개 변수 및 확산 연산자)
Classes(클래스)

ES6 문법

const and let

const, let, var 설명

Arrow function(화살표함수)

  • javascript에서 함수를 정의하는 function 키워드 없이 함수를 만들 수 있다.
  • return 키워드 없이, 식을 계산한 값이 자동으로 반환된다.
  • () 안에 함수의 인자가 들어가고, => 오른쪽에는 결과를 반환한다.

Template Literals(템플릿 리터럴)

const myFunc = (name, age) => {
	return `Hello ${name}, 이제 너는 ${age}살이 되었구나!`; 
};

console.log(myFunc('수리', 4));
// Hello 수리, 이제 너는 4살이 되었구나!
  • 내장된 표현식을 허용하는 문자열 리터럴
  • 여러 줄로 이뤄진 문자열과 문자 보간기능 사용가능
  • 백틱(``)을 이용

Default parameters(기본 매개 변수)

-매개 변수를 쓰지 않은 경우 매개 변수가 이미 기본값에 정의되어 있으므로 정의되지 않은 오류가 반환되지 않는다.

const myFunc = (name, age) => {
	return `Hello ${name}, 이제 너는 ${age}살이 되었구나!`; 
};

console.log(myFunc('수리'));
// Hello 수리, 이제 너는 undefined살이 되었구나!

age를 정의하지 않은 경우 이렇게 undefined로 출력이 되지만,

const myFunc = (name, age=10) => {
	return `Hello ${name}, 이제 너는 ${age}살이 되었구나!`; 
};

console.log(myFunc('수리'));
// Hello 수리, 이제 너는 10살이 되었구나!

이렇게 Default parameter를 정해놓은 경우엔 값을 주지 않아도 미리 정한 값을 출력하게 된다.

Array and object destructing(배열 및 객체 구조분해할당)

구조분해할당 설명

Import and export(가져오기 및 내보내기)

  • 별도의 재사용 가능한 구성요소를 작성할 수 있다.
    => JavaScript 응용프로그램에서 import 및 export를 사용하면 성능이 향상된다.

Promises

Rest parameter and Spread operator(나머지 매개 변수 및 확산 연산자)

rest Parameter 설명

spread operator 설명

Class

  • 객체지향프로그래밍의 핵심이다.
  • 코드를 안전하게 캡슐화할 수 있다.

Generator

  • 제너레이터는 함수의 실행을 중간에 멈추었다가 필요한 시점에 다시 재개할 수 있다(Coroutine).
  • 하지만, 코루틴과는 다르게 멈출 때 돌아갈 위치를 직접 지정할 수 없고, 단순히 호출자에게 제어권을 넘겨주게 된다.

마무리

코딩을 시작한지 얼마되지 않았기 때문에 내가 당연한 듯 쓰는 Javascript 문법은 모두 ES6문법이었다. 문법이 이렇게 바뀐 이유가 있고, 현재는 편리하다고 느끼지만 또 발전하는 때가 올 것이다. 여기에만 머물지 말고 흐름에 맞게 공부해야겠다😀

참고

profile
기억이 안되면, 기록을 -

0개의 댓글