제4장: ES6+ 주요 기능 (스프레드/레스트, 구조 분해, 템플릿 리터럴, 기본 파라미터, 모듈)
ES6+ 시대의 문법 혁신
자바스크립트는 ES6(ECMAScript 2015) 이후 혁명적인 문법 변화와 기능 확장을 맞이했습니다. 새로운 언어 도입이 활발했던 이 시기는, 복잡한 코드를 간결하고 읽기 편하게 바꾸고, 개발자 경험을 한층 업그레이드하는 데 집중했습니다. 이제는 현대 프론트엔드 프레임워크와 라이브러리 개발에 없어서는 안 될 다양한 기능들이 기본 언어에 포함되어 있습니다. 이 장에서는 실무와 현장에서 가장 자주 활용되는 ES6+ 주요 기능들을 중급 시각으로 분석합니다.
스프레드와 레스트: 데이터의 확장과 집계
스프레드(Spread)는 ...
문법을 사용해 배열이나 객체의 요소를 낱개로 풀어 새 배열·객체를 생성하는 데 활용됩니다. 반대로 레스트(Rest)는 함수에서 인자를 묶어 배열로 수집합니다. 예를 들어, 여러 값을 하나의 변수에 모아야 할 때 매우 유용합니다.
const arr1 = [1, 2];
const arr2 = [3, 4];
const merged = [...arr1, ...arr2]; // [1, 2, 3, 4]
function sum(...numbers) {
return numbers.reduce((acc, cur) => acc + cur, 0);
}
sum(1, 2, 3); // 6
스프레드는 데이터 결합, 복제와 같은 상황에서 코드의 반복을 줄이고, 레스트 파라미터는 함수 인자의 유연성을 높여줍니다.
구조 분해 할당: 객체와 배열을 손쉽게 분리하기
배열이나 객체에서 원하는 값만 뽑아 변수에 할당하는 과정이 혁신적으로 간편해졌습니다. 이를 구조 분해 할당(Destructuring)이라 부르며, 불필요한 중복을 줄이고 코드의 의도를 분명하게 만듭니다.
const user = { name: '민수', age: 27 };
const { name, age } = user; // user.name, user.age와 동일
const [first, second] = [10, 20]; // first=10, second=20
기본값을 지정하면 값이 없을 때 대체됩니다.
function greet({ name = '손님' }) {
return `안녕하세요, ${name}!`;
}
greet({}); // '안녕하세요, 손님!'
템플릿 리터럴: 동적 문자열의 새로운 시대
따옴표 대신 백틱()과
${}` 표현식을 써서, 변수와 결과값 삽입이 자연스러워졌습니다. 줄바꿈, 동적 값 삽입 등 복잡한 문자열 작성을 깔끔하게 해결합니다.
const product = '노트북';
const price = 1200000;
const message = `구매하신 상품은 ${product}이며, 가격은 ${price}원입니다.`;
기본 매개변수: 함수 호출의 실수 줄이기
함수의 인자에 값이 전달되지 않을 때 자동으로 사용할 기본값을 지정할 수 있습니다. 다양한 상황에서 에러 없이 함수가 작동하도록 만드는 예방책이 됩니다.
function multiply(a, b = 1) {
return a * b;
}
multiply(3); // 3 * 1 = 3
기본값은 구조 분해 할당과 함께 활용하면 더욱 강력합니다.
모듈 시스템: 코드의 분리와 재사용
복잡한 애플리케이션에서는 코드를 논리적 단위로 나누는 일이 필수입니다. ES6 모듈 시스템은 import
, export
키워드를 활용해 변수, 함수, 클래스를 다른 파일로부터 불러오거나 내보낼 수 있습니다. 각 파일은 독립적인 스코프를 가짐으로써, 전역 변수 충돌 위험 없이 안정적인 구조를 지원합니다.
// math.js
export function add(x, y) { return x + y; }
// app.js
import { add } from './math.js';
add(1, 2); // 3
모듈 시스템을 올바르게 이해하고 사용하면, 규모가 큰 프로젝트도 견고하게 유지되고 유지보수가 쉬워집니다.
ES6+의 등장 이후 자바스크립트는 단순한 스크립트 언어를 넘어, 대규모 소프트웨어 개발에도 손색이 없는 현대적인 언어로 거듭났습니다. 위 기능들은 중급 개발자로 성장하는 데 꼭 필요한 도구이자, 자주 접할 수밖에 없는 현실적인 기술입니다. 다음 장에서는 이러한 문법들이 실제 서비스와 프로젝트에서 어떻게 녹아드는지, 더 깊이 파고들겠습니다.