자바스크립트(Javascript) UI Part 2 - 재사용 패턴

코드 재사용

코드 재사용은 대부분의 언어에서 필요한 기능입니다 . 비슷한 요구사항에 맞춰서 동일한 기능을 반복적으로 개발하는 것은 중복코드를 증가시켜 결국 낭비로 이어집니다 . UI 개발과정에서도 이런 문제는 존재하며 다른 언어와 마찬가지로 그 해법도 크게 다르지 않습니다 .

UI 개발의 경우는 재사용을 위해서 자바스크립트 코드를 재사용할 수 있고 , CSS Framework(less 나 Sass 등 ) 을 통한 CSS 코드를 재사용하는 방법들도 존재합니다 .

자바스크립트의 경우 객체 지향적으로 모듈화를 통해 개발 할 수 있음에도 불구하고 , Java 와 같이 ‘extend’ 와 같은 명시적인 상속을 위한 기능이 존재하지 않습니다 . 다행히 이런 부분이 최근 ECMAScript 6 에 반영되고 있는 중입니다 .

물론 지금 상속을 구현하기 위해서 아무것도 할 수 없는 것은 아닙니다 . 이미 대부분의 자바스크립트 라이브러리와 이를 기반으로 제작된 많은 UI 콤포넌트들은 ‘prototype’ 이라는 속성을 통해 상속을 구현하고 있으며 , 결과적으로 이것을 활용해 코드 재사용이라는 목적을 달성할 수 있습니다 .

본 문서에서는 자바스크립트의 대표적인 재사용패턴을 설명하며 , 그에 앞서 prototype 이 문서에의 prototype 은 prototype 이라는 자바스크립트 코어에 해당하는 핵심 개념을 설명합니다 .

• 왜 Prototype 인가 ?
• Prototype 을 통한 상속
• Object.create() 를 활용한 Prototypal inheritance

자세히 보기 →