[javascript] 자바스크립트 ES6 (ECMAScript 2015)

원문: https://www.w3schools.com/js/js_es6.asp

JavaScript let

let은 블록 스코프 내에서 변수를 선언할 수 있게 해줍니다.

var x = 10;
// Here x is 10
{
  let x = 2;
  // Here x is 2
}
// Here x is 10

JavaScript const

const로는 상수를 선언할 수 있습니다. (상수 값을 가지는 자바스크립트 변수)
const는 let과 비슷하지만 값을 수정할 수 없습니다.

var x = 10;
// Here x is 10
{
  const x = 2;
  // Here x is 2
}
// Here x is 10

Arrow Functions

함수를 작성할 화살표 함수로 좀더 짧은 문법을 사용할 수 있습니다.
function 이나 return 키워드를 안써도 되고 상황에 따라 중괄호도 안써도 됩니다.

// ES5
var x = function(x, y) {
   return x * y;
}

// ES6
const x = (x, y) => x * y;

화살표 함수는 먼저 선언을 한 다음 사용해야 합니다.
함수문은 중간에 바뀌지 않기 때문에 변수에 할당하여 사용할 때에는 var 보다는 const를 쓰는게 안전합니다.
return 문과 중괄호는 함수의 내용이 한줄일 때에만 생략할 수 있습니다.

const x = (x, y) => { return x * y };
const x = (x, y) => x * y;

Classes

ES6 부터는 자바스크립트에서 class를 쓸 수 있습니다.
class는 일종의 function 이지만 초기화 시 function 키워드를 쓰지 않고 class 키워드를 사용합니다. constructor 라는 특별한 생성자를 통해 인스턴스화 시 프로퍼티를 초기화 할 수 있습니다. constructor 메소드는 class 객체가 초기화 될 때 마다 호출됩니다.

// Car 라는 이름을 가진 클래스 정의
class Car {
  constructor(brand) {
    this.carname = brand;
  }
}

이제 Car 클래스를 이용해 Car 객체를 만들 수 있습니다.

class Car {
  constructor(brand) {
    this.carname = brand;
  }
}
mycar = new Car("Ford");

Default Parameter Values

ES6에서는 함수의 파라미터가 기본 값을 가질 수 있습니다.

function myFunction(x, y = 10) {
  // y is 10 if not passed or undefined
  return x + y;
}
myFunction(5); // will return 15

Exponentiation Operator

새로운 연산자인 거듭제곱 연산자(**)가 추가되었습니다. 이 연산자는 첫번째 값을 두번째 값으로 거듭제곱한 결과(25 === 5 ** 2)를 리턴합니다.
x ** y 는 Math.pow(x,y)와 같은 결과를 리턴합니다.

var x = 5;
var z = x ** 2;          // result is 25

var a = 5;
var b = Math.pow(a,2);   // result is 25