자바스크립트 ES6

Jemin·2023년 6월 30일
0

프론트엔드

목록 보기
33/51
post-thumbnail

JavaScript ES6

ES6는 ECMAScript 2015라고도 불린다. ECMAScript의 6번째 버전이다.

ECMAScript는 JavaScript의 표준화된 버전을 정의하는 규격이다.

변수 선언과 할당

letconst 키워드를 사용하여 블록 스코프 변수를 선언할 수 있다. let은 재할당이 가능한 변수를 선언하고, const 는 재할당이 불가능한 상수를 선언한다.

화살표 함수

() => {} 형태로 간결한 문법으로 함수를 선언할 수 있다.
this의 동작이 기존 함수 선언 방식가 다르기 때문에 주의해야 한다.

const sum = (a, b) => a + b;
console.log(sum(2, 3));
// 출력: 5

클래스

class 키워드를 사용하여 클래스를 정의할 수 있다. 상속, 생성자, 메서드, 정적 메서드 등을 쉽게 정의할 수 있다.

모듈

importexport 키워드를 사용하여 모듈을 정의하고 가져올 수 있다. 파일 단위로 코드를 구성하여 모듈 간의 의존성을 명확하게 관리할 수 있다.

디스트럭처링 할당

배열이나 객체의 값을 편리하게 추출하여 변수에 할당할 수 있다.

const numbers = [1, 2, 3];
const [a, b, c] = numbers;
console.log(a, b, c);
// 출력: 1 2 3

향상된 객체 리터럴

객체 리터럴의 표기법이 개선되어 속성 초기화 단축 문법, 개선된 속성 이름, 메서드 축약 표현 등을 사용할 수 있다.

객체 리터럴은 객체를 생성하기 위한 표기법이다. 중괄호를 사용하여 객체 리터럴을 만들고 그 안에 속성과 값의 쌍인 프로퍼티를 정의한다. 각 프로퍼티는 콜론으로 구분되며, 프로퍼티와 프로퍼티 사이에는 쉼표로 구분한다. 객체 리터럴을 사용하여 쉽게 객체를 생성하고 초기화할 수 있다.

const person = {
  name: 'John',
  age: 30,
  address: {
    city: 'New York',
    country: 'USA'
  },
  sayHello: function() {
    console.log('Hello!');
  }
};

Promise와 비동기 프로그래밍

비동기 작업의 완료 또는 실패를 다루기 위한 Promise 객체를 사용할 수 있다.
async/await 구문을 사용하여 비동기 코드를 동기적으로 작성할 수 있다.

비동기 통신

탬플릿 리터럴

탬플릿 리터럴(백틱)로 문자열 보간과 여러 줄 문자열을 편리하게 작성할 수 있다.

const greeting = `안녕하세요, 제 이름은 ${name}이고, 나이는 ${age}살입니다.`;

스프레드 문법

(...)배열이나 객체를 펼쳐서 전개할 수 있다.

const numbers = [1, 2, 3];
const expandedNumbers = [...numbers, 4, 5];
// 출력: [1, 2, 3, 4, 5]

Map과 Set

키-값 쌍의 잡합을 다루는 Map 과 중복되지 않는 값의 집합을 다루는 Set을 사용할 수 있다.

참고
[JavaScript] ES6 문법 정리📑

profile
꾸준하게

0개의 댓글