• CoreChain의 기술 구성
- Framework 버전과 UI(User Interface) 버전으로 구성되어 있습니다.
- One Object, Client Computing, Component 아키텍처와 메커니즘을 제공합니다.
- 서버 데이터, 그리드(Grid), HTML5 Canvas를 연동하여 차트를 그릴 수 있습니다.
• One Object
HTML Document의 특정 엘리먼트에 background-color를 blue로 설정하기 위해서는
- setStyle()과 같은 라이브러리에서 제공하는 메소드를 사용하며
- 메소드의 파라미터에 {‘background-color’:‘blue’} 형태로 속성과 속성 값을 지정합니다.
- setStyle()이 method이므로 이를 포함하고 있는 오브젝트가 필요하며
- 오브젝트는 엘리먼트를 지정하여 new 연산자로 생성합니다.
var myObject = new Function_Name(‘element_id’);
myObject.setStyle({‘background-color’ : ‘blue’});
반드시 이 형태로 코드를 작성해야하는 것은 아니며
#id가 아닌 className/tagName/Selector를 파라미터에 지정할 수도 있습니다만,
라이브러리 내부에서 이 형태로 변환하게 됩니다.
이 형태는 특정 엘리먼트에 속성 값을 설정하고 다른 메소드를 연속해서 호출할 수 있으며
이때 엘리먼트를 지정하지 않아도 되는 편리함이 있습니다.
엘리먼트는 라이브러리 내부에서 오브젝트에 설정된 엘리먼트를 인식하여 설정합니다.
한편, 다른 엘리먼트를 처리하려면 엘리먼트에 속한 오브젝트가 필요하므로 이를 생성해야 합니다.
이는 주체가 오브젝트가 아니라 엘리먼트이기 때문입니다.
주체를 오브젝트에 둔 것이 One Object 개념입니다.
랜더링할 때 엘리먼트에 관계없이 오브젝트를 하나만 생성합니다.
cc.setStyle({‘background-color’:‘blue’}, ‘element_id’)
cc는 Corechain의 약자로 랜더링할 때 new CoreChain()으로 생성한 오브젝트가 설정됩니다.
메소드를 실행하기 위해서는 두 번째 파라미터에 엘리먼트를 지정해야 합니다만,
오브젝트가 하나이므로
- 엘리먼트에 접근하기 위해 오브젝트를 생성/변경하지 않아도 됩니다.
- cc.method_name(value, element) 형태로 호출하면 됩니다.
- Grid와 같이 다수의 엘리먼트를 반복적으로 처리할 때 더욱 효율적입니다.
CoreChain은 method를 연결해서 사용할 수 있는 아키텍처와 메커니즘을 제공합니다.
- cc.method_name(value, element)을 호출합니다.
- 실행한 메소드는 값을 반환하지 않고 this(cc) 오브젝트를 반환합니다.
- 따라서 메소드를 연결해서 호출할 수 있습니다.
- 메소드 실행 결과는 cc.chian 프로퍼티에 설정됩니다.
- 다음 메소드에서 설정된 값을 사용할 수 있습니다.
cc.createElement('div', 'soccer') //div#soccer 엘리먼트 생성
.setText('worldcup', cc.chain) //생성한 엘리먼트에 text 설정
.createElement('div', 'basketball') //div#basketball 엘리먼트 생성
.setText('NBA', cc.chain) //생성한 엘리먼트에 text 설정
다음 페이지