객체 생성자

https://learnjs.vlpt.us/basics/10-prototype-class.html
프로토타입이라는것은 생소하다 .
클래스는 많이 사용해서 어떤내용인지 대충 짐작이 가네용

function Animal(type , name , sound ) {
  this.type = type;
  this.name = name;
  this.sound = sound;
  this.say = function(){
    	console.log(this.sound);
  };
}

const dog = new Animal('개' , '멍멍이' , '멍멍');
const cat = new Animal('고양이' , '야옹이' , '야옹');


dog.say(); // 멍멍
cat.say(); // 야옹

함수안에 함수를 만들수가 있네용.
또 뭔가 화살표가 나올것 같은 느낌이 드는데..

프로토타입

function Animal(type , name , sound) {
	this.type = type;
  	this.name = name;
  	this.sound = sound;
}

Animal.prototype.say = function() {
	console.log(this.sound);
};

Animal.prototype.sharedValue = 1 ;

const dog = new Animal('개' , '멍멍이' , '멍멍');
const cat = new Animal('고양이' , '야옹이' , '야옹');

dog.say(); // 멍멍
cat.say(); // 야옹

console.log(dog.sharedValue); // 1 
console.log(cat.sharedValue); // 1 

이것을 적으면서 드는생각은 갑자기 코드가 길어졌넹..
라는 생각밖에 들지 않았습니다.
제가 생각하는 프로토타입은 개발할때 느낀거지만
반복이 2~3 이상 들어가게 되면 함수로 빼거나 객체 생성을 하더라구요 .
프로토타입도 그러한 이유 때문에 만들지 않았나 생각이 듭니다.
function Animal 함수에 say 라는 함수가 있을때 보다
prototype.say 로 빼버려서 Animal 객체 생성할때마다 sound 라는 녀석이
prototype 으로 생성이 되어버리고 만든것 같아요 .

밑에 있는
Animal.prototype.sharedValue = 1 ; 도 같은 이유이지 않나 라는 생각이 듭니다.

프로토타입의 역할은 객체생성자로 무언가를 만들었을때 , 그걸로 만든 객체 들끼리 공유할수 있는 함수가 값

프로토타입 객체 생성자 상속 받기

상속을 받는다..
상속을 받는것은 너무나도 중요한 개념같습니다.

class LoginApiView(View):
이러한 클래스조차도 View 상속을 받습니다 .

그런데 프로토타입 상속받는다는게..
약간 interface 라는 느낌이 들기도 하네요 .

일단 다시 한번 읽어보겠습니다.

function Animal(type , name , sound) {
	this.type = type;
  	this.name = name;
  	this.sound = sound;
}

Animal.prototype.say = function() {
	console.log(this.sound);
};

Animal.prototype.sharedValue = 1;

function Dog(name , sound) {
 	Animal.call(this , '개' , name , sound);
}

Dog.prototype = Animal.prototype;

function Cat(name , sound) {
	Animal.call(this , '고양이' , name , sound);
}

Cat.prototype = Animal.prototype;

const dog = new Dog('멍멍이' , '멍멍');
const cat = new Cat('야옹이' , '야옹');

dog.say();
dog.say();

`function Dog(name , sound) {
Animal.call(this , '개' , name , sound);
}

Dog.prototype = Animal.prototype;

`
이 코드를 보시면
평소 흔하게 super 라고 예상을 했지만 call 이라는 함수를 사용하네요 .

클래스

방금 적었던 코드를 클래스를 이용해서 다시 작성해 보겠습니다.

class Animal{
 constructor(type , name , sound) {
   this.type = type;
   this.name = name;
   this.sound = sound;
 }
 say() {
   console.log(this.sound);
 }
}

const dog = new Animal('개' , '멍멍이' ,'멍멍');
const cat = new Animal('고양이' , '야옹이' , '야옹');

dog.say();
cat.say();

이렇게 바뀌게 되고
여기서 상속이라는 개념을 이용해서 다시 적게 된다면

class Animal{
  constructor(type , name , sound) {
    this.type = type;
    this.name = name;
    this.sound = sound;
  }
  say() {
    console.log(this.sound);
  }
}

class Dog extends Animal {
	constructor(name , sound){
      super('개', name , sound);
    }
}

class Cat extends Animal {
  constructor(name , sound) {
    super('고양이' , name, sound);
  }
}


const dog = new Dog('멍멍이' , '멍멍');
const cat = new Cat('야옹이' , '야옹');
const cat2 = new Cat2('야오오오옹' , '야오오오오옹');

dog.say();
cat.say();
cat2.say();

아하 class 라는 문법이 ES6 부터 나왔고 ,
이게 나오면서 이제 super 라는 함수를 사용하네요 .
extends 로 상속을 받네요. ㅎㅎ