제이스크립트 ES6

ECMAScript 6은 무엇인가요？

ECMAScript 6은 ES6과 ECMAScript 2015로도 알려져 있습니다.

불과 몇몇 사람들은 이를 JavaScript 6으로 부르고 있습니다.

이 장에서는 ES6의 몇 가지 새로운 기능을 소개합니다.

  • JavaScript let
  • JavaScript const
  • 승수 (**)
  • 기본 값
  • Array.find()
  • Array.findIndex()

ES6(ECMAScript 2015)의 브라우저 지원

Safari 10과 Edge 14은 ES6을 완전히 지원하는 첫 번째 브라우저입니다：

Chrome 58 Edge 14 Firefox 54 Safari 10 Opera 55
Jan 2017 Aug 2016 Mar 2017 Jul 2016 Aug 2018

JavaScript let

let 문은 블록 스코프에서 변수를 선언할 수 있도록 합니다.

예제

var x = 10;
// 여기서 x는 10입니다
{ 
  let x = 2;
  // 여기서 x는 2입니다
}
// 여기서 x는 10입니다

직접 시도해 보세요

JavaScript const

const 문장은 상수(상수 값을 가진 JavaScript 변수)를 선언할 수 있도록 합니다.

고정 값은 let 변수는 값을 변경할 수 없습니다.

예제

var x = 10;
// 여기서 x는 10입니다
{ 
  const x = 2;
  // 여기서 x는 2입니다
}
// 여기서 x는 10입니다

직접 시도해 보세요

우리의 JavaScript Let / Const 장에서 JavaScript Let / Const에 대해 더 읽어보세요 let 와 const 의 내용입니다.

지수 연산자

승수 연산자（**를 첫 번째 연산자가 두 번째 연산자의 권을 받습니다。

예제

var x = 5;
var z = x ** 2;          // 결과는 25입니다

직접 시도해 보세요

x ** y 의 결과는 Math.pow(x,y) 동일합니다：

예제

var x = 5;
var z = Math.pow(x,2);   // 결과는 25입니다

직접 시도해 보세요

기본 값

ES6 함수 매개변수에 기본값을 허용합니다.

예제

function myFunction(x, y = 10) {
  // y는 전달되지 않거나 undefined인 경우 10입니다
  return x + y;
}
myFunction(5); // 15을 반환합니다

직접 시도해 보세요

Array.find()

find() 메서드는 테스트 함수를 통해 첫 번째 배열 요소의 값을 반환합니다.

이 예제는 첫 번째로 18보다 큰 요소(의 값)을 찾아(반환)합니다：

예제

var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

직접 시도해 보세요

이 함수는 3개의 파라미터를 받습니다：

  • 항목 값
  • 항목 인덱스
  • 배열 자체

Array.findIndex()

findIndex() 메서드는 테스트 함수를 통해 첫 번째 배열 요소의 인덱스를 반환합니다.

이 예제는 18보다 큰 첫 번째 요소의 인덱스를 결정합니다：

예제

var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

직접 시도해 보세요

이 함수는 3개의 파라미터를 받습니다：

  • 항목 값
  • 항목 인덱스
  • 배열 자체

새로운 수학 속성

ES6는 Number 객체에 다음 속성을 추가했습니다：

  • EPSILON
  • MIN_SAFE_INTEGER
  • MAX_SAFE_INTEGER

예제

var x = Number.EPSILON;

직접 시도해 보세요

예제

var x = Number.MIN_SAFE_INTEGER;

직접 시도해 보세요

예제

var x = Number.MAX_SAFE_INTEGER;

직접 시도해 보세요

새로운 수학 메서드

ES6는 Number 객체에 2개의 새로운 메서드를 추가했습니다：

  • Number.isInteger()
  • Number.isSafeInteger()

Number.isInteger() 메서드

파라미터가 정수라면 Number.isInteger() 메서드가 반환 true.

예제

Number.isInteger(10);        // 반환 true
Number.isInteger(10.5);      // 반환 false

직접 시도해 보세요

Number.isSafeInteger() 메서드

안전한 정수는 더블 프리미스数值로 정확하게 표현할 수 있는 정수입니다。

파라미터가 안전한 정수라면 Number.isSafeInteger() 메서드가 반환 true.

예제

Number.isSafeInteger(10);    // 반환 true
Number.isSafeInteger(12345678901234567890);  // 반환 false

직접 시도해 보세요

안전한 정수는 -(253 - 1)에서 +(253 - 1)까지의 모든 정수를 의미합니다。

이것은 안전합니다：9007199254740991. 이것은 불안전합니다：9007199254740992.

새로운 전역 메서드

ES6는 2개의 새로운 전역 수학 메서드를 추가했습니다：

  • isFinite()
  • isNaN()

isFinite() 메서드

파라미터가 Infinity 또는 NaN이 경우 전체 isFinite() 메서드는 false를 반환합니다。

그렇지 않으면 true를 반환합니다：

예제

isFinite(10/0);       // 반환 false
isFinite(10/1);       // 반환 true

직접 시도해 보세요

isNaN() 메서드

파라미터는 NaN이 경우 전체 isNaN() 메서드가 반환 true이렇지 않으면 false:

예제

isNaN("Hello");       // true를 반환

직접 시도해 보세요

화살표 함수 (Arrow Function)

화살표 함수는 함수 표현식을 작성하는 데 간단한 문법을 사용할 수 있게 합니다.

당신은 필요하지 않습니다 function 키워드,return 키워드 및괄호.

예제

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

직접 시도해 보세요

화살표 함수는 자신의 this.객체 메서드.

화살표 함수는 提升되지 않습니다. 사용할 때앞합니다.

정의 const 사용하는 것보다 var 보다 안전합니다. 함수 표현식은 항상 상수 값입니다.

함수가 단일 문장일 때만 생략할 수 있습니다 return 키워드와 괄호. 따라서 그들을 유지하는 것이 좋은 습관일 수 있습니다:

예제

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

직접 시도해 보세요