Description
원문 : https://calvin.hashnode.dev/javascript-classes-are-harmful
꽤 대담한 표현이지만, 자바스크립트를 좀 다뤄본 개발자라면 다들 느끼는 감정일 겁니다.
자바스크립트는 제대로 배우지 않으면 나쁜 코드를 작성하게 됩니다. 그러나 이 점은 반대로 자바스크립트를 숙달하지 않고도 빠르게 개발할 수 있다는 장점이 되기도 합니다. 자바스크립트의 이런 점이 프로그래밍의 두 가지 중요한 패러다임으로 빠지기 전까지 오랫동안 지속되어서는 안됩니다.
- 프로토타입 상속
- 함수형 프로그래밍
자바스크립트 창조자가 이러한 기둥들을 만든 것은 아니지만 자바스크립트는 두 패러다임을 많은 사람들에게 보여주었습니다.
생성자는 항상 틀리다
// constructor function
function Person () {
this.name = 'John',
this.age = 23
}
// create an object
const person = new Person();여러분이 생성자 함수를 만들고 그 함수를 상속할 때 자바스크립트가 가지는 능력을 모두 사용할 순 없습니다.
- 생성자 함수에서 객체를 반환하는 것은 프로토타입 체인을 무너뜨리는데 이는 더 이상 새로운 객체에
this가 바인딩되지 않는다는 뜻입니다. this를 사용할 수 없으므로 진짜 팩토리 함수보다 덜 유연합니다.- strict 모드를 사용하지 않고 생성자 함수를
new로 호출하는 것을 까먹는다면,this에 할당한 모든 것들이 전역 네임스페이스로 이동합니다. 이 점이 아주 치명적이죠.
자바스크립트는 어떠한 함수든 새로운 객체를 반환할 수 있으므로 생성자 함수가 필요하지 않습니다.
객체 리터럴을 사용하거나
const dog = {
name: 'Naya',
sex: 'female',
age: 2,
breed: 'Rottweiler mix'
};**Object.create()**를 사용하거나
const person = {
isHuman: false,
printIntroduction: function() {
console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
}
};
const me = Object.create(person);
me.name = 'Matthew'; // "name" is a property set on "me", but not on "person"
me.isHuman = true; // inherited properties can be overwritten
me.printIntroduction();
// expected output: "My name is Matthew. Am I human? true"동적 객체 확장(dynamic object extension) 을 사용하면 우리가 필요한 모든 것들을 가질 수 있습니다.
const dynamic1 = "Marks";
const dynamic2 = "Age";
const user = {
Name : "GeeksForGeeks",
[dynamic1] : "57",
[dynamic2] : "42"
};팩토리 함수란?
function createJelly() {
return {
type: 'jelly',
colour: 'red'
scoops: 3
};
}자바스크립트에서 팩토리 함수란 new가 필요하지 않고, 전역 공간을 오염시킬 위험성이 없는 생성자 함수입니다.
클래스 상속
클래스 상속은 일반적으로 하나의 조상으로부터 상속받을 수 있으므로 나중에 곤란한 상황에 놓여질 수 있습니다.
개발자들은 보통 모든 OO 디자인이 결국 잘못됐다는 걸 알게 됩니다.
Elliot에 의하면 자식과 부모 클래스의 긴밀함은 모듈식 코드와 재사용 가능한 코드의 정반대에 놓이게 된다고 합니다. 무엇으로부터 무엇을 상속받는지를 다시 구성하기 위해 코드베이스로 다시 돌아가야 하지만 완전히 리팩토링하기에는 결합도가 너무 높을 수 있습니다.
어플리케이션이 커질 수록, 문제는 더욱 심각해지며 클래스의 혼잡함이 가중되어 버그가 나타나면 한 군데가 아니라 버그와 관련된 모든 코드를 고쳐야 할 수 있습니다.
클래스는 해롭습니다
꽤나 대담한 문장이지만 Eliiot은 소프트웨어 재작성과 복제 문제에 의해 큰 기업에서 낭비되는 시간의 양이 더 중요하다고 생각합니다.
큰 기업의 경우 어느정도 여유를 가지고 수정할 수는 있지만 스타트업은 그럴 여유가 없습니다.
ES6은 새로운 문서에서 클래스 패턴을 확장함으로써 이러한 문제를 더 나쁘게 만들었고, 수많은 포스팅과 책에서 클래스의 사용을 강조합니다.
더 깨끗한 코드
자바스크립트 코드에서 생성좌 클래스 상속을 제거한다면
- 읽고 쓰기가 더 쉬워지며
- 더 유연해지고
- 더 표현적인 코드가 됩니다.
언어의 특성에 대해 열린 마음을 가지는 것이 대중적이지만, 무엇이 옳은 방법이고 그른 방법인지는 분명히 있습니다. 올바른 방법을 선택하세요. ~ Eric Elliott