ES6 주요 문법 활용하기

export & import

//file: fibonacci.js

//since these variables are not exported
//they are private to the module. Code
//in other modules can't reference them
let fib1 = 0;
let fib2 = 1;

/**
 * next() returns the next number in the Fibonacci sequence.
 * @returns {number}
 */
export function next() {
    let current = fib1;
    fib1 = fib2;
    fib2 = current + fib1;
    return current;
}

/**
 * reset() resets the Fibonacci generator.
 */
export function reset() {
    fib1 = 0;
    fib2 = 1;
}

import로 export한 모듈 전체 불러오기 

import * as fibonacci from "./fibonacci.js";

let (i = 0; i < 20; i++) {
    console.log(fibonacci.next());
}

fibonacci.reset();

 

필요한 모듈만 불러오기

import {next} from "./fibonacci.js"

let n = next();

default 로 export , import 하기

//file: fibonacci.js
export default function next() {
    //...
}


//file: index.js
import next from "./fibonacci.js"
let n = next();

 

Destructuring 구조분해할당

let size = "10x20";
//split size into two-element array
let sizeSegments = size.split("x"); //returns ["10", "20"]

//extract each element into separate variable
let width = sizeSegments[0];
let height = sizeSegments[1];

console.log(width);  // => 10
console.log(height); // => 20

let size = "10x20";

//destructure array returned by .split()
//into two different variables, width & height
let [width, height] = size.split("x");

console.log(width);  // => 10
console.log(height); // => 20

 

Spread 스프레드 연산자 활용하기

function sum(n1, n2) {
    return n1 + n2;
}

let nums = [10,20];
//spread array elements into separate parameters
console.log(sum(...nums)); // => 30

요소가 많을 경우 나머지 요소 

let size = "10x20x30x40";
let [width, height, ...rest] = size.split("x");
console.log(width);  // => 10
console.log(height); // => 20
console.log(rest);   // => ["30", "40"];

 

가변함수 활용하기

매개변수에 대해 입력 개수에 상관없이 합계를 구할 수 있다. 

function sum(...numbers) {
	return numbers.reduce((accumulator, n) => accumulator + n, 0);
}

sum(10,20,30,40); // => 100

 

Reference

drstearns.github.io/tutorials/es6/