[Javascript]ECMAScript6(ES6)에 추가된 문법

ES6 (ECMAScript 2015)은 ECMAScript 언어의 6번째 버전입니다. ES6는 많은 새로운 문법과 기능을 도입하여 JavaScript를 더욱 강력하고 유연한 언어로 만들었습니다. ES6에 추가된 주요 문법 몇 가지를 살펴보겠습니다.

1. let, const 키워드: 기존 var 키워드 대신에 let과 const 키워드가 추가되었습니다. let은 블록 스코프 변수를 선언할 때 사용하며, const는 상수를 선언할 때 사용합니다.
   

   let x = 10;
   x = 20; // 가능
   
   const y = 10;
   y = 20; // 불가능

2. 화살표 함수: 화살표 함수는 함수를 더 간결하게 작성할 수 있도록 해줍니다. 이전에는 함수를 선언할 때 function 키워드를 사용해야 했지만, 화살표 함수에서는 이 키워드를 생략할 수 있습니다.
   

   const add = (a, b) => a + b;

3. 템플릿 리터럴: 템플릿 리터럴은 문자열을 더욱 편리하게 작성할 수 있도록 해줍니다. 템플릿 리터럴에서는 문자열을 백틱(`)으로 감싸고, 변수나 표현식은 ${} 안에 넣어 사용합니다.
   

   const name = 'Alice';
   const greeting = `Hello, ${name}!`;

4. 클래스: ES6에서는 클래스를 정의할 수 있습니다. 클래스는 객체 지향 프로그래밍에서 흔히 사용되며, 객체의 속성과 메서드를 정의하는 데 사용됩니다.
   

   class Animal {
     constructor(name) {
       this.name = name;
     }
   
     speak() {
       console.log(`${this.name} makes a noise.`);
     }
   }
   
   class Dog extends Animal {
     constructor(name) {
       super(name);
     }
   
     speak() {
       console.log(`${this.name} barks.`);
     }
   }
   
   const dog = new Dog('Rufus');
   dog.speak();

5. 모듈: 모듈은 코드를 모듈화하여 코드의 재사용성을 높이는 데 사용됩니다. ES6에서는 모듈을 정의하는 문법이 추가되었습니다.
   

   // module1.js
   export const add = (a, b) => a + b;
   
   // module2.js
   import { add } from './module1.js';
   console.log(add(2, 3)); // 5

6. 프로미스: 프로미스는 비동기 작업을 처리할 때 사용됩니다. 이전에는 콜백 함수를 사용하여 비동기 작업을 처리했지만, 프로미스를 사용하면 더욱 간결하고 효율적인 코드를 작성할 수 있습니다.
   

   const fetchUserData = () => {
     return new Promise((resolve, reject) => {
       fetch('https://api.example.com/users')
         .then(response => response.json())
         .then(data => resolve(data))
         .catch(error => reject(error));
     });
   };
   

7. for...of 반복문: for...of 반복문은 배열이나 이터러블 객체를 순회하는 데 사용됩니다. 이전에는 for...in 반복문을 사용했지만, 이 반복문은 객체의 속성을 순회할 때 사용하며 배열의 순서를 보장하지 않습니다.
   

   const fruits = ['apple', 'banana', 'orange'];
   for (const fruit of fruits) {
     console.log(fruit);
   }
   

8. 디폴트 매개변수: 디폴트 매개변수는 함수의 매개변수에 기본 값을 지정하는 데 사용됩니다. 이전에는 매개변수에 값을 전달하지 않으면 undefined가 할당되었지만, ES6에서는 디폴트 값을 지정할 수 있습니다.
   

   const greet = (name = 'Anonymous') => {
     console.log(`Hello, ${name}!`);
   };
   
   greet(); // Hello, Anonymous!
   greet('Bob'); // Hello, Bob!
   

9. 전개 연산자: 전개 연산자는 배열이나 객체를 펼쳐서 함수의 인수로 전달하는 데 사용됩니다. 전개 연산자를 사용하면 코드를 더욱 간결하고 가독성 있게 작성할 수 있습니다.
   

   const numbers = [1, 2, 3];
   const sum = (a, b, c) => a + b + c;
   
   console.log(sum(...numbers)); // 6

10. 객체 리터럴 확장
    

    const name = 'Alice';
    const age = 30;
    const person = { name, age };
    
    console.log(person); // { name: 'Alice', age: 30 }
    

이외에도 ES6에는 많은 다른 새로운 문법이 있습니다. 이러한 기능들은 JavaScript를 더욱 강력하고 유연한 언어로 만들어주며, 개발자들이 코드를 더욱 효율적으로 작성할 수 있도록 도와줍니다.