get firstElem() { returnthis._arr.length ? this._arr[0] : null; } set firstElem(elem) { this._arr = [elem, ...this._arr]; //... this._arr은 this._arr을 개별 요소로 분리 } }
const foo = new Foo([1,2,3,4,5]);
foo.firstElem = 100; //set 키워드를 사용한 메서드로 데이터를 할당 할 때 필드명을 사용.
console.log(foo.firstElem); //get 키워드를 사용한 메서드를 불러올 때 필드명을 가져올 때처럼 사용
정적 메서드 (static method)
정적 메서드를 정의 하려면 static 키워드를 사용하면 된다. 정적 메서드는 클래스의 인스턴스가 아닌 클래스 이름으로 호출한다. 그래서 클래스의 인스턴스를 생성하지 않아도 호출할 수 있다.
정적 메서드는 this를 사용할 수 없으며, 정적 메서드 내부에서 클래스 인스턴스를 가리키는 것이 아니라 자기 자신을 기리킨다.
classPerson{ constructor(age) { this._age = age; } static staticMethod() { /** 정적 메서드는 this를 사용할 수 없으며, 정적 메서드 내부에서 클래스 인스턴스를 가리키는 것이 아니라 자기 자신을 기리킨다. **/ return'staticMethod age: ' + this._age; }
prototypeMethod() { returnthis._age } } //정적 메서드는 클래스 이름을 호출 console.log(Person.staticMethod()); //staticMethod age: undefined
const me = new Person(34);
//정적 메서드는 인스턴스로 호출할 수 없다. console.log(me.staticMethod()); //Uncaught TypeError: me.staticMethod is not a function
클래스도 function이고 기존 prototype 기반 패턴의 Syntatic suger일 뿐이다.
var me = new Person(34); console.log(me.prototypeMethod()); //34 console.log(Person.staticMethod()); //staticMethod age: undefined console.log(me.staticMethod());//Uncaught TypeError: me.staticMethod is not a function console.log(Person.prototype === me.__proto__); // true console.log(Person.prototype.constructor === Person); //true
클래스 상속(Class Inheritance)
클래스 상속은 새롭게 정의할 클래스가 기존 클래스와 유사할 경우 상속을 통해 그대로 사용하고 다른 점만 구현할 수 있다. 즉 하위 클래스에서 상속받아 상위 클래스의 정보를 다시 재사용할 수 있는 것이다. 코드의 재사용할 경우 개발 비용을 줄일 수 있다.
get getAge() { returnthis.age; } set setAge(age) { returnthis.age = age; } getInfo() { return'My name is ' + this.name + 'and age is ' + this.age; } }
const child = new Child('hello', 33); console.log(child.getInfo()); //My name is helloand age is 33 child.setAge = 20; console.log(child.getAge); 20 console.log(child.getInfo()); //My name is helloand age is 20 child.setName = 'World'; console.log(child.getName); //World
get getAge() { returnthis.age; } set setAge(age) { returnthis.age = age; } getInfo() { return'My name is ' + super.getName + ' and age is ' + this.age; //super를 통해 getName 참조 } }
const child = new Child('hello', 33); console.log(child.getInfo()); //My name is hello and age is 33 child.setAge = 20; console.log(child.getAge); 20 console.log(child.getInfo()); //My name is hello and age is 20 child.setName = 'World'; console.log(child.getName); //World
super 메서드는 자식 클래스의 생성자 내부에서 부모 클래스 생성자(슈퍼클래스)를 호출한다. 즉 부모 클래스의 인스턴스를 생성한다. 그래서 자식 클래스의 생성자에서 super()를 호출하지 않으면 this에 대한 참조 에러(ReferenceError)가 발생한다.
1 2 3 4 5 6 7 8 9
classParents{}
classChildextendsParents{ constructor() {
} }
const child = new Child(); //Uncaught ReferenceError: Must call super constructor in derived class before accessing 'this' or returning from derived constructor