JavaScript フレームワークの比較: ユーティリティ関数

著者：Eve Cole 更新時間：2010-04-26 15:52:05

ユーティリティ関数

多くのJavaScript フレームワークには、 JavaScript を使用したアプリケーションの開発を容易にする多数のユーティリティ関数が付属しています。この記事には付け加えるべきことが多すぎるため、ほとんどのフレームワークで最も魅力的な機能の 1 つについて説明します。

JavaScript配列を使用したことがある場合は、ループを使用して配列を反復処理し、その値を操作することに慣れているでしょう。たとえば、リスト 2 のコードを考えてみましょう。

リスト 2: JavaScript 配列を反復処理する従来の方法

var フルーツ = ['リンゴ', 'バナナ', 'オレンジ'];
for(var i = 0; i < Fruit.length; i++) {
アラート(フルーツ[i]);
}

リスト 2 のコードは正しいですが、少し面倒です。ほとんどの JavaScript フレームワークには、配列内の各要素に対して特定の関数を呼び出す each 関数が含まれています。 MooTools を使用すると、リスト 2 と同じ操作をリスト 3 のコードを使用して実行できます。

リスト3: MooToolsの各機能の使い方

['リンゴ', 'バナナ', 'オレンジ'].each(function(item) {
アラート(アイテム);
});

リスト 3 は、構文的には Prototype および jQuery と同じですが、YUI と ExtJS では若干の違いがあります。ただし、ハッシュまたはオブジェクトに適用される構文は、フレームワークによって異なります。たとえば、MooTools では、次のリストのコードを使用できます。

リスト 4: キーと値のペアの個々のオブジェクトに対する MooTools の各関数の使用

var hash = new Hash({名前: "ジョーレノン"、電子メール: " [email protected] "});
hash.each(関数(値, キー) {
アラート(キー + ": " + 値);
});

ただし、Prototype ライブラリを使用すると、これはリスト 5 のコードのようになります。

リスト 5: キーと値のペアの個々のオブジェクトに対する Prototype の each 関数の使用

var hash = $H({名前: "ジョー・レノン", 電子メール: " [email protected] "});
hash.each(関数(ペア) {
アラート(ペア.キー + ": " + ペア.値);
});

各フレームワークには、より実用的な関数が多数含まれており、通常は文字列関数、数値関数、配列関数、ハッシュ関数、日付関数などに分かれています。詳細については、関連する JavaScript フレームワークの API マニュアルを参照してください。

転載アドレス： http://www.denisdeng.com/? p=716