본문 바로가기

Web 프로그래밍/Javascript59

[Javascript] 클래스 방식의 상속패턴 #1 - 기본패턴 자바스크립트에서 상속이란 주제를 다룰 때 클래스 방식의 용어를 듣게 된다. 하지만 자바스크립트에는 클래스라는 개념이 없다. 자바스크립트는 매우 유연하고 동적인 언어이어서 상속패턴을 새롭게 구현을 해서 사용할 수 있다. 궁극적인 목표를 잊어서는 안된다. 자바스크립트에서 상속을 하는 이유는 코드를 재사용하기 위함이다. 상속은 하나의 방법이지 유일한 방법은 아니다. 코드의 재사용을 접근할 때 GOF가 한 말로 '클래스 상속보다 객체 합성을 우선시 해야한다' 라는 말을 주의 깊게 생각 해보자 [자바스크립트 코딩기법과 핵심패턴]의 내용에 의하면 5가지 클래스 방식의 상속 패턴을 사용할 수 있다.1) 기본패턴2) 생성자 빌려쓰기3) 생성자 빌려쓰고 프로토타입 지정해주기4) 프로토타입 공유5) 임시 생성자 우선 기본.. 2016. 6. 6.
[Javascript] method, 메서드 객체를 생성하게 되면 this라는 전역변수에 동적으로 추가를 하는데 이는 객체를 생성시마다 this에 있는 변수, 함수, 프로퍼티 등을 모두 생성하게 되어 메모리를 많이 잡아 먹는다.이를 해결하기 위해서 prototype에 공통되는 함수, 재사용 되는 함수를 프로퍼티에 추가해서 사용을 했었다. 자바스크립트 객체생성패턴에서 필수로 알아야 하는 것은 아닌 것 같다. 이런 방법도 있구나 라고 한 번 보고 익히는 것이 좋을 듯 싶다. method는 prototype에 추가해서 사용할 수 있으며 구현 코드는 다음과 같다. 2016. 6. 6.
[Javascript] 체이닝 패턴 체이닝패턴은 간단하다.여러개의 함수를 한줄로 호출 할 수 있도록 하는 패턴이다. 코드량이 줄고 간결해져 하나의 문장처럼 읽을 수 있다. 반면에 디버깅 하기는 힘들 수도 있다. 2016. 6. 6.
[Javascript] 샌드박스 패턴(sandbox pattern) ※ 샌드박스 (Sandbox)샌드박스를 이해하려면 먼저 어원을 알아보기로 하자.샌드박스는 영어 그대로 해석하자면 "모래상자"라는 뜻이다. 아이들이 놀이터에서 놀 수 있는 공간을 의미한다. 모래 상자 안에는 당연히 모래가 있겠고 아이들이 모래를 가지고 놀다보면 그 공간은 상당히 더러워(?)질 수가 있다. 어원에 담겨 있듯이 샌드박스란 정해진 공간 안에서 형식 없이 마음껏 자유자재로 놀아라는 뜻을 가지고 있다. 즉 컴퓨터에서는 어떤 프로그램/코드를 실행할 때 제한된 공간에서 벗어나지 않고 허용되는 범위 안에서 마음껏 작업을 할 수 있음을 뜻한다. 자바스크립트에서 샌드박스 패턴을 사용하면 콜백함수로 코드를 감싸기 때문에 전역 네임스페이스를 보호할 수 있다. 샌드박스 생성자구현 (자바스크립트 코딩기법과 핵심패턴.. 2016. 6. 6.
[Javascript] 모듈패턴(module pattern) ※ 모듈패턴자바스크립트에서 모듈 패턴은 전역 영역에서 특정 변수영역을 보호하기 위해 하나의 객체 안의 private/pulbic 변수를 포함하는 클래스 형식의 개념을 구현모듈 패턴은 복잡한 코드를 구조화시키고 정리하는 데 최적의 패턴이다. 모듈패턴을 사용하면 개별적인 코드를 느슨하게 결합시킬 수 있는 장점이 있다. 즉 개발중에라도 끊임없는 요구사항에 따라 기능을 추가하거나 삭제하거나 자유롭게 사용이 가능하다. 모듈패턴은 여러개 패턴을 조합해서 사용한다.1) 네임스페이스패턴 2) 즉시 실행함수 3) 비공개 멤버와 특권멤버 4) 의존 관계 선언 예제를 따라해보면 이해가 될 것이다. 2016. 6. 6.
[Javascript] 프로토타입과 비공개 멤버 생성자를 사용하여 객체를 만들어서 사용할 때 객체를 생성하면 객체안에 모든 변수 및 프로퍼티들이 새로 재생성 된다.이와 같은 방법은 객체를 한 개만 생성할 때는 문제가 되지 않지만 여러객체를 사용해야 할 경우에는 메모리낭비가 있다. 일반적인 클로저를 이용한 함수객체 생성법이다. 프로토타입도 객체이다. 메모리를 절약하기 위해서는 공통 프로퍼티와 메서드를 prototype에 추가해서 사용하는 것이 바람직하다. 2016. 6. 6.

티스토리툴바