Angular JS 입문 3

이전에 이어서 의존성에 대해 알아 보도록 하자.

2번째 포스팅부터는 책을 먼저 참고하여 포스팅 중이다. 기초지식을 먼저 쌓고 코딩은 이 후에 할 예정이다.

의존성

$scope는 부모가 전역 앱 스코프인 스코프 객체다. 일반적으로 HTML에 ng-controller로 컨트롤러가 명시될 때 앵귤러가 자동으로 $scope를 생성한다. 여기서 전부를 다루기에는 $scope와 관련된 속성과 함수가 너무 많다. 그러므로 여기에 관해서는 먼저 이곳을 알아 두고 살펴보길 바란다.

$scope 에는 $digest 루프와 상호작용하고 추가적인 $watch 값을 생성하기 위한 함수가 붙어 있으며 다른 앵귤러 객체에 이벤트를 송신하고 다른 앵귤러 객체에서 이벤트를 수신하기 위한 메커니즘을 존재한다.

$http 는 HTTP 요청을 만들기 위한 프라미스 기반의 모듈이다. 주 함수는 HTTP 요청의 다른 여러 속성과 함께 라우트, 함수, 페이로드를 명시할 구성 객체를 받는다. $http() 함수는 .then(), .success(), .errer() 함수를 포함한 프라미스 객체를 반환한다.

앵귤러는 의존성 주입 시스템을 내장하고 있다. 아직 의존성 주입(dependency injection)이 낯설어도 걱정하지 않아도 된다. 그리 어려운 개념이 아니다.

생성되고 나서 클라이언트 객체 상태의 일부가 될 때, 의존성을 의존 객체(여기서는 main 컨트롤러)에 주입하는 디자인 패턴이다. 의존성 주입은 클라이언트와 의존성 논리를 분리하며 한걸음 더 나아가 클라이언트를 의존성에서 분리시킨다. 세부적인 것은 여기나 이곳을 참고 하자.

$http 모듈을 컨트롤러에 주입하기에 컨트롤러는 $http 모듈을 찾아서 생성할 책임을 지지 않는다. 그 대신 $http는 인자로 전달된다. 최대한 테스트를 작게 만들고 개발자 코드만 테스트하기를 원한다. 의존성 주입을 사용하면 정적으로 고정된 값을 컨트롤러에 반환하는 가짜(mock) $http 모듈을 넘길 수 있다. 이렇게 하면 서버와 앵귤러 $http 모듈을 테스트에서 완전히 제외하는 방법으로 컨트롤러 논리만 격리해서 테스트 할 수 있다.

이 이후부터는 실제 예제를 가지고 서버와 통신을 하고, CSS를 이용해 본격적인 어플 하나를 만들기 시작한다. 따라서 더이상의 내용은 후에 추가하던지 부분적으로 필요한 부분을 적어 넣는 방식으로 할 것이고 앞서 어려웠던 개념들을 되새길 겸 코딩 사이트에서 코딩을 한번 해보도록 하자.

포스팅이 상당히 짧은데 아마 다음 포스팅을 하게 된다면 코딩사이트에서 코딩을 다 한 이후, 서버와 연동할 때 쓰게 될 듯 하다. 어쩌면 node js에 대한 내용을 쓴 이후 쓰게 될지도 모르겠다.