본문 바로가기

2. 우당탕탕 개발자111

13Jan2020 TIL 상위 개체의 메소드를 불러오는 방법 : 상위개체.prototype.method.call(this, arguments) FlyingHorse.prototype.goSomewhere = function(destination, milesToDestination) { if (milesToDestination < 10) { return Horse.prototype.goSomewhere.call(this, destination); } else { return this.name + " is flying to " + destination + "!"; } }; 굳이 따로 지정해줄 필요는 없었다. 아래의 예제 처럼 (내가 쓴것^^!) var FlyingHorse = function(name, color) { Horse.c.. 2020. 1. 13.
11Jan2020 TIL prototype 과 상속 (pseudo-classical style) var Horse = function(name) { this.name = name; }; Horse.prototype.goSomewhere = function(destination) { return this.name + " is galloping to " + destination + "!"; }; var FlyingHorse = function(name, color) { Horse.call(this, name); this.color = color; this.oldGoSomewhere = Horse.prototype.goSomewhere.bind(this); }; FlyingHorse.prototype = Object.create(Ho.. 2020. 1. 12.
10Jan2020 TIL 라이브러리란? 사용이 잦은 로직을 재활용하기 위해 class 혹은 function 으로 정의한 것을 의미. 다른 사람들이 만든 라이브러리를 사용할 수 있고, 직접 만들 수도 있다. Underbar Review _.map(collection, iterator) _.map = function(collection, iterator) { let arr =[]; for(let el of collection) { arr.push(iterator(el)); } return arr; } _.reduce(collection, iterator, accumulator) _.reduce = function(collection, iterator, accumulator) { if (Array.isArray(collection)).. 2020. 1. 11.
09Jan2020 TIL Functional Bind Checkpoint windowTimers.setTimeout() 의 this 특징 setTimeout()에 의해 실행된 코드는 별도의 실행 컨텍스트에서 setTimeout이 호출된 함수로 호출됩니다. 호출된 함수에 대해서는 this 키워드를 설정하는 일반적인 규칙이 적용되며, this를 설정 혹은 할당하지 않은 경우, non-strict 모드에서 전역(혹은 window) 객체, strict모드에서 undefined를 기본 값으로 합니다. (출처 : mdn) 2번 - What message will eventually be alerted? After how long? var name = "Window"; var alice = { name: "Alice", sayHi: func.. 2020. 1. 10.
06Jan2020 TIL Frame work VS Library Frame work는 그 틀 안에서 코드를 작성, Library 는 필요에 따라 그것을 가져다가 쓰는 것. Library를 이용하여 새로운 Frame work를 작성해도 좋으나, 해당 프레임 워크 속에 버그나 오류를 내가 하나하나 수정해 가며 만들어야 하기 때문에, 보통은 사람들이 이미 안정화 되었다고 판단한 프레임 워크를 사용한다. 설령 오류를 발견하더라도 이용자들이 빠르게 수정/보완하기 때문에. 또한, 프레임 워크를 사용하다 내가 생각한 방향대로 되지 않으면 프레임 워크의 방향을 크게 수정하기 보다는 다른 프레임 워크를 가져다 쓰는게 이롭다. 의사 코드 작성법 (위키하우) 어떤 것도 상상에 맡기지 않는다. 프로그램의 작동 과정에 필요한 모든 것을 빠짐없이 기록하.. 2020. 1. 7.
01Jan2020 TIL Today I learned : Find closest element event 위치가 랜덤으로 설정된 엘리먼트들 중 클릭한 타겟 엘리먼트에서 가장 가까운 위치에 있는 엘리먼트에게 새로운 이미지를 추가하는 이벤트를 구현하려고 한다. 과제 가이드라인에 따르면, Pythagorean theorem (피타고라스의 정리)를 이용하여 대각선의 길이가 가장 짧은 엘리먼트를 구하는 과정이 필요했다. 우선, 화면에 구현된 이벤트 타겟이 어떤 것을 의미하는지 console.log(event.target)를 통해 살펴보았다. Span 이나 Div가 아닌 이미지가 찍혀서 해당 이미지의 style 을 살펴 보았더니 style 로 지정된게 없었다. 따라서 해당 이미지의 부모 엘리먼트를 살펴볼 필요가 있었다. 해당 부모 노트를 .. 2020. 1. 2.