객체 라는것은 사람에 비유 했을때,
이름, 성별, 키 라는 어떤 (속성)값이 있고,
말하기, 걷기 라는 어떤 (속성)액션이 있다.
생성자 함수로 만들어낸 객체를 인스턴스(instance)라고 부른다.
function Card(num, color) {
this.num = num;
this.color = color;
this.init();
}
// 각각의 카드에 메서드를 일일히 넣으면 메모리공간을 차지 하기 떄문에..
// 메서드를 한공간에 저장하고 걔를 갖다 쓰려고한다. = prototype
Card.prototype = {
// 새로 Card의 prototype객체를 만들경우 constructor를 명시해 줘야한다.
constructor: Card,
init: function() {
const mainElem = document.createElement('div');
mainElem.style.color = this.color;
mainElem.innerHTML = this.num;
mainElem.classList.add('card');
document.body.appendChild(mainElem);
}
};
const card1 = new Card(1, 'green');
const card2 = new Card(7, 'blue');
각각의 달라지는 속성들은 생성자 함수안에 선언해놓고, 똑같이 공유하는 프로퍼티는 prototype에 저장해 놓고 쓴다………
css에 클래스 스타일은 이미 지정했다는 가정하에 html에 바로 찍힘