08.10 화 JS > Class & Prototype

목차

 

1. JS  >  Class 문법 & Prototype 문법

class 문법을 언제 써야하는가?

- 쉽게 얘기해서, 같은 형식의 객체를 여러개 찍어내야할 때 사용하면 좋음 → class 사용(객체지향) → 코드의 간결성 & 재사용성 UP!!

 

예시 - LOL 챔피언의 정보를 나타낼 때

eg) class 문법 사용 안할 경우

const akali = {
    q: 'five poist strike',
    w: 'twilight shroud'
}

const zed = {
    q: 'razor shuriken',
    w: 'living shadow'
}

const shen = {
    q: 'twilight assault',
    w: 'sprit\'s refuge'
}

eg) class 문법 사용 할 경우

// ES 5
function champion(skill1, skill2) {
    this.q = skill1;
    this.w = skill2;
}

// ES 6
class champion {
	constroctor(skill1, skill2) {
    	    this.q = skill1;
            this.w = skill2;
    }
}

const akali = new champion('five poist strike', 'twilight shroud')
const zed = new champion('razor shuriken', 'living shadow')
const shen = new champion('twilight assault', 'sprit\'s refuge')

 

 

Prototype이란 무엇인가?

Prototype이란, 부모 class에 대한 '유전자'다!

Prototype 문법을 사용하면, 생성된 자식들에게 공통된 value나 method를 추가할 수 있다. 자세한 것은 아래 영상 참고

https://www.youtube.com/watch?v=wUgmzvExL_E 

 

2. 설계 없이 코딩부터 시작하는 것이 바로 고된 삽질의 시작

알고리즘 문제 풀 때도, pseudo coding 등 자신만의 방식으로 밑그림을 그리고 시작해야 하듯, 프론트 개발도 마찬가지!

논리적인 설계 없이 코드부터 치는 것은 정말 안좋은 습관이다. 

코드 치기 전에 최소 15분은 논리 설계 및 검토를 하는 습관을 들이자!