유틸리티 기능
많은 JavaScript 프레임워크에는 JavaScript를 사용하여 애플리케이션을 보다 쉽게 개발할 수 있도록 해주는 다양한 유틸리티 기능이 함께 제공됩니다. 이 기사에는 추가할 내용이 너무 많기 때문에 대부분의 프레임워크에서 가장 매력적인 기능 중 하나에 대해 논의하겠습니다.
JavaScript 배열로 작업해 본 적이 있다면 아마도 루프를 사용하여 배열을 반복하고 해당 값을 조작하는 데 익숙할 것입니다. 예를 들어 목록 2의 코드를 살펴보세요.
목록 2: JavaScript 배열을 반복하는 전통적인 방법
var Fruit = ['사과', '바나나', '오렌지'];
for(var i = 0; i < 과일.길이; i++) {
경고(과일[i]);
}
목록 2의 코드는 정확하지만 약간 번거롭습니다. 대부분의 JavaScript 프레임워크에는 배열의 각 요소에 대해 특정 함수를 호출하는 Each 함수가 포함되어 있습니다. MooTools를 사용하면 목록 3의 코드를 사용하여 목록 2의 동일한 작업을 수행할 수 있습니다.
목록 3: MooTools의 각 기능 사용하기
['사과', '바나나', '오렌지'].each(function(item) {
경고(항목);
});
목록 3은 구문론적으로 Prototype 및 jQuery와 동일하지만 YUI와 ExtJS 간에는 약간의 차이가 있습니다. 그러나 해시나 개체에 적용할 때 구문은 프레임워크마다 다릅니다. 예를 들어 MooTools에서는 다음 목록의 코드를 사용할 수 있습니다.
목록 4: 키/값 쌍의 개별 개체에 MooTools의 각 기능 사용
var hash = new Hash({이름: "Joe Lennon", 이메일: " [email protected] "});
hash.each(함수(값, 키) {
경고(키 + ": " + 값);
});
그러나 Prototype 라이브러리를 사용하면 이는 목록 5의 코드와 같습니다.
목록 5: 키/값 쌍의 개별 개체에 Prototype의 Each 함수 사용
var hash = $H({이름: "Joe Lennon", 이메일: " [email protected] "});
hash.each(함수(쌍) {
Alert(pair.key + ": " + pair.value);
});
각 프레임워크에는 일반적으로 문자열 함수, 숫자 함수, 배열 함수, 해시 함수, 날짜 함수 등으로 구분되는 더 많은 실용적인 함수가 포함되어 있습니다. 자세한 내용은 관련 JavaScript 프레임워크의 API 매뉴얼을 참조하세요.
재인쇄 주소: http://www.denisdeng.com/?p=716
원래 주소: http://www.ibm.com/developerworks/web/library/wa-jsframeworks/index.html