sitelink1 | |
---|---|
sitelink2 | |
sitelink3 | http://1 |
extra_vars4 | ko |
extra_vars5 | http://www.methodchain.com |
extra_vars6 | sitelink1 |
MethodChain은 Ajax Library로 New Paradigm Shift입니다.
? 시나리오
- 1. div#sports의 color 속성값을 blue로 설정합니다.
- 2. 설정한 값을 추출하여 반환합니다.
var element = document.getElementById('sports'); element.style.color = 'blue'; var value = element.style.color;
? element 오브젝트(인스턴스)를 생성하는 이유는 div#sports Element에 접근할 수 있도록
DOM에서 제공하는 method와 property가 element에 설정되기 때문입니다.
? 이 코드는 단락이 분리된 형태로 코드를 연결해서 작성하면 아래와 같은 형태가 될 것입니다.
var element = document.getElementById('sports').style.color = 'blue'; var value = element.style.color;
? style.color = ‘blue’를 document.getElementById('sports')에 연결해서 작성할 수 있는 것은
document.getElementById('sports')가 오브젝트를 반환하기 때문입니다.
그런데 div#sports에 blue가 설정되지만, element에는 오브젝트가 설정되지 않고
‘blue’ 값이 설정되므로 element.style.color를 연결해서 작성할 수 없습니다.
? 그럼, 어떻게 하면 코드를 연결해서 작성할 수 있을까요?
document.getElementById('sports').style.color = 'blue'에서 알 수 있듯이 값이 아닌
오브젝트를 반환하면 코드를 연결해 작성할 수 있습니다.
클래스의 모든 method가 이런 메커니즘으로 구성된다면 코드를 연결해 작성할 수 있습니다.
? MethodChain은 코드를 연결해서 작성할 수 있는 메커니즘을 제공합니다.
아래의 코드는 위의 시나리오를 MethodChain에서 제공하는 method로 작성한 형태입니다.
var value = mc.setStyle('color: blue', 'sports').chain;
? 코드가 연결된 형태는 시나리오와 오브젝트가 하나가 되어 물이 흘러가듯이 유연한 형태가 됩니다.
? 시나리오와 오브젝트의 결합을 설계하고 구현하는 과정을 통해 높은 차원의 애플리케이션을 개발할 수 있으며, 보다 높은 품질을 실현할 수 있습니다.