Javascript ES6 메서드 축약 표현
Javascript의 메소드 선언방식은 ES5와 ES6가 다르다. 현재 ECMAScript 사양에서는 ES5의 방식은 메소드로 인정하지 않으며, 오로지 ES6 방식만을 메소드로 인정한다.
해당 포스팅에서는 예제를 통해 두 방식의 차이를 비교하고자 한다.
메소드 축약 표현
1. ES5 메소드 표현
ES5에서 메소드를 선언하려면 프로퍼티 값으로 함수 선언식을 할당한다.
// ES5
var obj = {
name: 'Lee',
// 프로퍼티 sayHi의 값으로 할당된 것은 일반 함수(constructor)로 정의된 함수이다.
// 현재 ECMAScript 사양에서 메서드로 인정되지 않는다.
sayHi: function() {
console.log('Hi! ' + this.name);
}
};
obj.sayHi(); // Hi! Lee
// ES5의 메서드 선언 방식은 현재 ECMAScript 사양에서는 일반 함수로 정의된다.
// 일반 함수는 constructor이므로 new로 인스턴스를 생성할 수 있다.
new obj.sayHi(); // sayHi {}
2. ES6 메소드 축약 표현
- ES6에서는 메소드를 선언할 때, function 키워드를 생략한 축약 표현을 사용할 수 있다.
- 현재 ECMAScript에서는 ES6 메서드 축약표현만 메서드로 인정한다.
// ES6 메서드 축약표현만 메서드로 인정된다.
const obj = {
name: 'Lee',
// 메소드 축약 표현
sayHi() {
console.log('Hi! ' + this.name);
}
};
obj.sayHi(); // 일반함수 호출: Hi! Lee
// 메소드는 non-constructor이므로 생성자 함수로 호출할 수 없다.
new obj.sayHi(); // Uncaught TypeError: obj.sayHi is not a constructor
Author And Source
이 문제에 관하여(Javascript ES6 메서드 축약 표현), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@dev-redo/Javascript-ES6-메서드-축약-표현저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)