2021/03/01 2

자바스크립트 프로토타입(Prototype)과 프로토타입 체인(Prototype Chain) 기초 다지기

본 내용에 들어가기 앞서, 자바스크립트는 클래스라는 개념이 없다. 기존의 객체를 복사하여 새로운 객체를 생성하는 프로토타입 기반의 언어이다. 즉, 프로토타입을 사용하여 새로운 객체를 만들어낸다. (참고로, ES6 표준에서 클래스 문법이 추가되었다.) 프로토타입이란? 한국어로는 단순히 원형(원래 형태)으로 번역된다. 말 그대로 객체의 원형이라고 할 수 있다. 자바스크립트의 객체지향 프로그래밍을 지탱하고 있는 핵심 개념이며, 이를 활용하여 상속 개념을 제공하고 있다. [목표] 프로토타입의 기초를 다져보자 아래 코드를 보고 상상해보자. 'o' 객체의 'ultraProp' 프로퍼티에 접근했을 때 어떤 값이 출력될 것 같은가? function Ultra(){} Ultra.prototype.ultraProp = t..

Javascript 2021.03.01

리팩토링 작업 - 중복 제거와 this 키워드

리팩토링이란? 비효율적인 코드를 가독성이 높고, 유지보수가 편리하며, 중복된 코드의 수가 낮은 효율적인 코드로 개선하는 작업이다. 틈틈이 리팩토링 작업을 하는 것이 좋은 프로그래머의 자세이자 좋은 프로그램을 만들 수 있다. [목표] 비효율적인 코드를 제거하는 리팩토링 작업 학습 우선, Night 버튼 기능을 웹 페이지 하단에서도 동작하도록 해보자 이때, 하단 버튼을 클릭하면 버튼의 값이 바뀌는 대상은 상단에 위치한 버튼이다. 그 이유는 input 태그의 id의 값이 동일하기 때문이다. 이 경우 하단 버튼의 id 값을 'night_day2'로 수정하면 정상 작동한다. 그러나, 버튼이 여러 개라면 수많은 버튼을 일일이 변경해줘야 하는 불편함이 발생한다. 이 불편함을 해결하기 위해 this 키워드를 사용한다...

Javascript 2021.03.01