JavaScript의 ES란? ES5/ES6 문법 차이

ES

ECMAScript(줄여서 ES)는 JavaScript 언어의 표준을 정의하는 문서이다. 즉, ECMAScript는 JavaScript 언어를 사용할 때 어떤 문법이나 기능을 사용할 수 있는지를 규정한다.
ES5, ES6, ES7 등은 ECMAScript 문서의 버전을 의미한다. 각각의 버전에 따라 JavaScript 언어의 문법이나 기능이 업데이트되어 사용할 수 있는 기능이 달라진다.
예를 들어, ES5는 var 키워드로 변수를 선언하고, function 키워드로 함수를 선언하는 등의 문법을 사용한다. 그러나 ES6부터는 let, const 키워드로 변수를 선언하고, 화살표 함수( = () =>)를 사용하여 함수를 선언할 수 있다.
따라서, JavaScript를 사용할 때 ECMAScript의 버전을 고려하여 어떤 문법과 기능을 사용할 수 있는지 확인하고 개발하는 것이 중요하다.

 

ECMA Script(European Computer Manufacturer's Association Script)

정보와 통신 시스템을 위한 국제적 표준화 기구 ECMA 인터내셔널에 의해 제정된 ECMA-262 기술 규격에 의해 정의된 범용 스크립트 언어
ECMAScript는 JavaScript와 같은 스크립트 언어의 표준을 말한다 
ECMAScript는 스크립트 언어가 준수해야 하는 규칙, 세부 사항 및 지침을 제공한다
JavaScript는 ECMAScript를 기반으로 하며 ECMAScript 사양을 준수하는 범용 스크립팅 언어다 
ECMAScript 언어 중 가장 인기 있는 언어로 알려져 있다

 

 

 

 

 

ES5/ES6 문법 차이

 

변수 선언 방식

ES5                                              
var a = 1;                     
                                                                 ES5에서 ES6로 넘어오면서 호이스팅에 대한 문제 등으로 
ES6                                                          var 로 변수를 선언 하는것보다  let, const 로 변수를 선언한다.
let a = 1;
const a = 1;

변수를 선언하는 키워드로 var, let, const가 있다. var는 함수 단위로 변수의 스코프가 제한되며, 중복 선언이 가능하다.

let과 const는 블록 단위로 스코프가 제한되고, 중복 선언이 불가능하다. const는 값이 변경될 수 없는 상수를 선언할 때 사용된다. 이러한 변화는 JavaScript의 발전과 함께 이루어졌으며, 코드의 가독성과 유지보수성을 높여준다.

 

 

화살표 함수

// ES5
function add(a, b) {
  return a + b;
}

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

ES6에서 추가된 화살표 함수는 간결하고 가독성이 좋아서 많이 사용된다. 이전의 함수 선언 방식보다 function 키워드를 생략하고 화살표(=>)를 사용하여 함수를 간결하게 표현할 수 있다. 이러한 특징으로 인해, 화살표 함수는 함수 크기가 작을 경우에 유용하며, 코드의 가독성과 유지보수성을 높여준다.

 

 

클래스

// ES5
function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.sayHello = function() {
  console.log('Hello, my name is ' + this.name);
};

// ES6
class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  sayHello() {
    console.log(`Hello, my name is ${this.name}`);
  }
}

ES5에서는 클래스 개념이 없었기 때문에 함수를 이용해서 객체를 생성하고 관계를 구현했다. ES6에서는 class 키워드를 이용해서 클래스를 정의할 수 있다. 이렇게 하면 생성자 메서드, 인스턴스 메서드, 정적 메서드 등을 더 쉽게 구현할 수 있다. 클래스는 객체 지향 프로그래밍을 더욱 쉽게 구현할 수 있도록 도와준다.