220927_TIL
오늘 한 일
- prototype과 class 복습
- 코딩테스트 4문제 풀이
prototype은 constructor의 함수를 생성할 때 자동으로 만들어지는 비밀공간이라고 할 수 있으며 부모의 유전자라고 할 수도 있다.
prototype에 임의로 값을 넣어놓으면 그 값은 자식들이 물려 받을 수 있다.
function 기계() {
this.name = 'Kim';
this.age = 15;
}
기계.prototype.gender = '남';
var 학생1 = new 기계();
var 학생2 = new 기계();
console.log(학생1.gender); //'남'이 출력됨
이렇게 학생1과 학생2의 부모인 기계에다가 prototype으로 gender 값을 넣어주면 자식은 부모로부터 gender의 값을 물려 받을 수 있다.
console창에 학생1.gender를 치면 ‘남’이라는 값이 출력되는 것을 보면 알 수 있다. 이와 같은 원리는 다음과 같다. 자바스크립트는 오브젝트에서 값을 출력할 때 묻는 순서가 있다는게 중요한 포인트다.
(1) 학생1에 직접 gender라는 값이 있는가?
(2) 그럼 부모 유전자에 gender라는 값이 있는가?
(3) 그럼 부모의 부모 유전자에 gender라는 값이 있는가?
(4) 그럼 부모의 부모의 부모의 유전자에 .. 그게 있는가?
자바스크립트는 이런 알고리즘으로 작동한다. 그냥 쉽게말하자면 오브젝트에서 값을 뽑을 때,
-
내가 직접 가지고 있는지 검사
-
내가 가지고 있지 않으면 부모 유전자들을 차례로 검사하는구나
라고 잘 기억해주면 될듯. 이런 원리를 이해하고 보니.. sort, push, toString, map, forEach 등 이런 것들을 array에 붙여서 사용가능한데 이런 것도 부모의 유전자를 물려받았다는 것을 알 수 있다.
var arr = [1, 2, 3];
console.log(arr.toString()); //가능
내가 만든 array에 arr.toString() 이렇게 붙일 수 있는 이유는 내가 만든 array의 부모 유전자가 toString()을 가지고 있기 때문. (혹은 부모의 부모)
var arr = [1, 2, 3];
var arr = new Array(1, 2, 3);
위 코드 두줄은 같은 완전 똑같은 의미이다. 중요한 점은 위는 인간이 array 만드는 방식, 밑은 컴퓨터가 array 만드는 방식인데 사람은 귀찮아서 [] 그냥 대괄호쳐서 만드는데 내부적으로는 저렇게 new 키워드를 항상 이용해서 array/object를 만들어준다는 것이다.
아랫 줄의 코드는 풀어설명하면 Array라는 기계로부터 자식을 하나 새로 라는 뜻
console.log(Array.prototype);
이렇게 쳐서 출력 값을 보면 평소에 쓰던 sort, map, push, forEach 이런 것들이 있는데 이런 걸 보면 확실하게 알 수 있었다.
두번째로 공부하면서 중요했던 포인트는. prototype으로 상속시키는거랑 constructor로 상속시키는거랑 차이를 아는 것!
A. 자식들이 값을 직접 소유하게 만들고 싶으면 constructor로 상속시키시면 되고
부모만 가지고 있고 그걸 참조해서 쓰게 만들고 싶으면 prototype으로 상속시키면 된다. 보통은 그래서 상속할 수 있는 함수 같은 것들은 prototype으로 많이 만들어 놓는다고 한다.
class를 저번에 공부하면서 확실하게 이해가 안된 것 같아서 한번 더 봤다. extends를 하여 부모로부터 상속받아 쉽게 오브젝트를 여러개 만드는 방법과 이 때 자식으로부터 따로 값을 넣고 싶을 때 사용하는 super 그리고 좀 더 효율적으로 class를 작성하기 위한 getter와 setter를 복습했다. 한 번 해보고 다시 강의를 보고 코드를 쳐보니 전에 처음 들었을 때보다 머리에 각인이 더 잘 됐다.
코딩문제를 자바스크립트로 풀기 시작했다. 앞으로 코딩문제 풀이는 til 카테고리가 아닌 coding test 카테고리에 추가해볼 예정이고 이러한 카테고리 변화는 git 연습도 됨과 동시에 coding test 연습을 위한 나의 각오이기도 할 수 있다.
오늘은 3개의 수 중 최댓값 출력, 삼각형이 되는지 판단, n까지의 총합, 7개의 array에서 최솟값 출력 등의 문제를 풀어봤다.
댓글남기기