본문 바로가기

Dev.

 (341)
[JS_Design Pattern] 2. 모듈 패턴 ( Module Pattern ) Module Pattern 자바스크립트의 모듈 패턴은 javascript 의 코드 관리 기법 중 하나로 객체 핸들링을 위한 방법론 중 하나이다. 객체에 유효범위를 주어 private, public을 구분하여 캡슐화를 할 때 사용하는 방법이다. Namespace pattern에 Lexical Scope를 추가한 것으로 보면 된다. Module Pattern 이란, 즉시 실행 함수(Immediately Invoked Function)에 this인자를 넘겨주고 함수 내부에서 exports란 인자로 접근할 수 있는 패턴을 말한다. basic>123(function(){ //something to do})();cs 모듈 패턴을 사용하는 예를 코드를 통해 살펴보자.code>12345678910111213141516..
[JS_Design Pattern] 1. 네임 스페이스 패턴 ( NameSpace Pattern ) NameSpace Pattern 전역 변수를 기초로 하는 JavaScript의 단점 때문에, 여러 스크립트가 한 페이지 안에 함께 있는 소스코드에서는 변수가 많아질 수록 이름이 겹칠 우려가 있다. 이는 협업에서도 상당히 중요한 부분이다. 뿐만 아니라 어느 곳에서도 접근할 수 있는 전역 변수이기에 소스의 신뢰도가 낮아질 수 있다. 이러한 단점들을 보완하기 위한 패턴이 네임스페이스 패턴이다. 네임 스페이스란 구분이 가능하도록 정해놓은 범위나 영역을 의미한다. 이름 그대로, 이름 공간을 선언하여 다른 공간과 구분하도록 하는 것이다. 객체 리터럴 네임 스페이싱(Object Literal NameSpacing) 하나의 전역 객체를 생성한 다음. 모든 함수, 객체, 변수를 이 전역객체에 추가하여 구현하는 방법이다...
$proxy 메소드에 대해서 알아보자. $proxy 메소드에 대해서 알아보자. 123456789function Person(el) { this.name = ''; var self = this; // store reference to this $(el).change(function(event) { self.name = this.value; // captures self in a closure });}Colored by Color Scriptercs this.name에서의 this는 Person이라는 함수를 가리키고 있을 것이다. Person 함수를 내부에서도 가리킬 필요가 있다면 어떻게 해야할까? 우리는 이 함수를 생성한 객체를 가리키고 있는 this를 끌고 내려오기 위해, this의 주소를 self라는 변수에 저장하여 끌고 내려왔다. 이렇게 ..
#JavaScript MVC 모델 연습 - spinbox #JavaScript로 알아보는 MVC 모델 웹 프로그래밍에서 가장 중요한 개념 중 하나인 MVC 모델에 대해서 알아보도록 하자.최근 들어서 서버 사이드 렌더링 말고도,클라이언트 사이드 렌더링과 관련된 프레임워크들이 많이 등장하고 있다. (Angular, Ember, 등)JavaScript로 MVC는 어떻게 설계하는가?간단한 예제인 SpinBox sample을 통해서 MVC 구조에 대해 간단하게 알아보자.>> MVC 모델이란? >> 1단계. JavaScript의 작동을 확인할 기본적인 html 구조를 잡자.1234567891011121314151617181920212223242526 spinbox MVC Spinbox + - Colored by Color Scriptercs html에서 주의할 점 중 하..
#미니 MVC FrameWork 작동원리 정리 First, 웹 애플리케이션의 실행WAS가 실행되면 서블릿 컨테이너( Tomcat )가 '메소드' 를 호출한다.이 메소드는 ContextLoaderListener.java 에 있는 contextInitialized(event) 메소드이다.실행이라는 event를 인자로 받아 실행되는 것이다.ContextLoaderListener 클래스는 ServletContextListener라는 인터페이스를 구현하고 있다.WAS의 실행을 Listen하고 있는 것이다. contextInitialized(event) 메소드의 역할이 메소드는 ServletContext 저장소에서 propertiespath를 꺼내온다.그리고 이 propertiespath를 이용하여 ApplicationContext 클래스를 생성한다.이 App..
#미니 MVC FrameWork 만들기 네번째 단계, 의존성 주입 자동화 미니 MVC Framework 만들기 네번째 단계,프로퍼티와 어노테이션을 활용한 의존성 주입 자동화. 문제점 착안, 지금까지, 각 요청에 따른 페이지 컨트롤러를 생성하고, DAO객체를 주입하는 과정을 하드코딩을 통해 해결했다. 그 결과 ContextLoaderListener 클래스가 매우 지저분해졌다. 이를 해결하기 위해 프로퍼티 파일과 어노테이션을 이용하여, 객체를 생성하고 의존성을 주입하는 부분을 자동화할 것이다. 해결방안,프로퍼티 파일에 설정된 객체와 어노테이션을 통해 설정된 객체를 준비하는 일을 할 ApplicationContext라는 클래스를 만든다. 이 클래스는 ContextLoaderListener에 의해 호출된다. 구체화,ContextLoaderListener> 웹 애플리케이션이 실행되면서..
#미니 MVC FrameWork 만들기 세번째 단계, 프런트 컨트롤러 자동화 미니 MVC Framework 만들기 세번째 단계,리플랙션 API를 이용하여 프런트 컨트롤러를 자동화 하자. 문제점 착안, 프런트 컨트롤러에서 VO 객체를 생성하는 부분이 상당히 지저분하다. 각 요청에 따른 Member 객체를 생성해야하기 때문이다. 나중에 요청이 개수가 더 많아질 경우에, 그에 맞는 VO를 또 생성하는 코드를 작성하는 것은 유지보수성을 떨어뜨린다. 해결방안,DataBinding을 이용하자. getBinder라는 메소드를 선언하는 DataBinding Interface를 만들고, 각각의 페이지 컨트롤러들이 DataBinding Interface를 구현한다. 페이지 컨트롤러는 이 getBinder라는 메소드를 통해 프런트 컨트롤러에게 요청에 필요한 DataName과 DataType을 전달한..
#미니 MVC FrameWork 만들기 두번째 단계, DAO 조작 미니 MVC Framework 만들기 두번째 단계,MemberDao Interface를 통한 다형성 핸들링,Dao를 외부로부터 주입받아 의존성을 주입하자. 문제점 착안,현재까지는 MemberDao를 ContextLoaderListener에서 생성하여 ServletContext에 보관한 다음에, 각각의 서블릿에서 꺼내 사용하였다. 이렇게 되면 각각의 서블릿에서 중복되는 코드가 발생하며 유지보수성이 떨어지게 된다. 그리고 MemberDao 클래스에 작성된 쿼리문들은 Mysql기반으로 작성되어 있다.만약에, 서비스를 구축하고 있는 데이터베이스의 종류가 변경된다면,쿼리문 뿐만 아니라, MemberDao에 관련된 코드들을 모두 수정해야하는 상황이 발생한다. 해결방안,각각의 페이지 컨트롤러에는 MemberDao를 ..

티스토리툴바