書籍転載:JavaScriptライブラリ実践活用[厳選111]
JavaScriptベースのデータベース[TaffyDB]
書籍転載の18本目(書籍内の番号は「69」)。JavaScriptのJSON形式のデータに対して、データベースのような感覚でアクセスするためのライブラリ「TaffyDB」の基礎と、基本的な使い方を解説する。
書籍転載について
ご注意
本記事は、書籍の内容を改変することなく、そのまま転載したものです。このため用字用語の統一ルールなどはBuild Insiderのそれとは一致しません。あらかじめご了承ください。
TaffyDBは、JavaScriptのJSON形式のデータに対して、データベースのような感覚でアクセスするためのライブラリです。すべてのデータをメモリ上に展開するため、レコード数に限界はありますが、サーバ上のデータベースに問い合わせる必要がないため、非常に高速なデータベースとして使用できます。
- 名称: TaffyDB
- 分類: 小ネタ
- URL: http://www.taffydb.com/
- 関連ファイル: taffy.js
リスト069-01は、TaffyDBを使ったサンプルです。このサンプルではjQueryの機能を利用しているため、jQueryライブラリを読み込んでいますが(1)、TaffyDB自体の機能は、taffy.jsファイルのみで利用できます(2)。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<!--1jQueryライブラリをインポート -->
<script type="text/javascript"
src="http://code.jquery.com/jquery-1.9.0.js"></script>
<!--2taffyライブラリをインポート -->
<script type="text/javascript" src="js/taffy.js"></script>
<script type="text/javascript">
$(function(){
// 1レコードの値の表示
var echo_db = function(r) {
$('#result').append( 'gender: ' + r.gender + ', name1: '
+ r.name1 + ', name2: ' + r.name2
+ ', city: ' + r.city + '<br />' );
}
// 3TAFFYオブジェクトの生成
var db = TAFFY([{ "id":1,
"gender":"M",
"name1":"智夫",
"name2":"大野",
"city":"東京都"
},
{ "id":2,
"gender":"F",
"name1":"淳",
"name2":"柴田",
"city":"東京都"
},
{ "id":3,
"gender":"M",
"name1":"政志",
"name2":"相葉",
"city":"千葉市"
},
{ "id":4,
"gender":"F",
"name1":"彩",
"name2":"山崎",
"city":"茨木市"
}
]);
$('#result').append( '-全レコードの取得<br />');
// 4全レコードの取得
var all = db();
// 5レコードの列挙
all.each( function(r) { echo_db(r); });
$('#result').append( '<hr />- gender項目がF<br />');
// 6gender項目がFのレコード取得
db({gender:"F"}).each( function(r) { echo_db(r); });
$('#result').append( '<hr />- city項目で「市」で終わる<br />');
// 7city項目で「市」で終わるレコード取得
db({city:{right:"市"}}).each( function(r) {
echo_db(r);
});
$('#result').append( '<hr />- name1項目の取得<br />');
// 8特定列の取得
var ids = db().select("name1");
$.each(ids, function(i,val) {
$('#result').append( 'name1: ' + val + '<br />');
});
…中略…
});
</script>
</head>
<body>
<!--結果表示 -->
<div id="result"></div>
</body>
</html>
|
TaffyDBでは、JSON形式の配列(項目と値のペアをまとめたオブジェクトを1つのレコードとし、それを配列としたもの)を、データベースとして扱います。
サンプルでは、1レコードが、id、gender、name1、name2、cityという5つの項目からなる、住所録のようなデータを定義しています。
まずは、そのJSON形式のデータを引数に指定して、TAFFYオブジェクトを生成します(3)。合計4レコードのデータです。
TaffyDBの機能は、レコードの検索機能と、レコードに対する更新、追加、削除などの機能とに分かれています。レコードの追加などいくつかの操作以外は、まずは検索して、次に、その結果となるオブジェクトに対して操作する、という形になります。
TaffyDBのレコード検索機能は、無名関数として定義されています。引数には、検索条件の指定が可能です。引数を指定せずに実行した場合(4)、すべてのレコードを返します。検索条件は、デフォルトでは単純な値指定(6)となりますが、そのほか、表069-01のような構文指定が可能です(7)。
構文 | 検索内容 |
---|---|
{項目名:{is:値}} | 型と値が一致するもの |
{項目名:{'==':値}} | 「=」で一致するもの |
{項目名:{'===':値}} | 型と値が一致するもの |
{項目名:{isnocase:値}} | 大文字小文字を無視して一致するもの |
{項目名:{left:値}} | 前方一致するもの |
{項目名:{leftnocase:値}} | 大文字小文字を無視して前方一致するもの |
{項目名:{regex:値}} | 正規表現で一致するもの |
{項目名:{lt:値}} or {項目名:{'<':値}} th=""> | より小さいもの |
{項目名:{lte:値}} or {項目名:{'<=':値}} th=""> | より以下のもの |
{項目名:{gt:値}} or {項目名:{'>':値}} | より大きいもの |
{項目名:{gte:値}} or {項目名:{'>=':値}} | より以上のもの |
検索して得られたオブジェクトに対しては、表069-02のようなメソッドが利用できます。
メソッド名 | パラメータ | 内容(コメント番号) |
---|---|---|
each | 処理関数 | レコードの順次取り出し(5) |
select | 列名 | 指定した列のレコードを取得する(8) |
distinct | 列名 | 指定した列の、重複をのぞくレコードを取得する |
limit | レコード数 | 最大取得レコード数の指定 |
update | 更新レコード | レコードの更新 |
remove | なし | レコードの削除 |
order | 項目名 | 指定した項目名でソート。オプションで、asec(昇順)、desc(降順)の指定可。db().order("col1 asec, col2 desc")なら、col1で昇順してcol2で降順 |
なお、検索した結果ではなく、TaffyDBのオブジェクトに対しては、表069-03のメソッドが用意されています。
メソッド名 | パラメータ | 内容 |
---|---|---|
insert | 追加レコード | レコードの追加 |
store | 保存名 | データをブラウザのローカルストレージに保存する |
また、select、distinctメソッドの戻り値は、レコードの単なる配列となりますので、サンプルではjQueryのeachメソッドを利用して、値を取り出しています(8)。
※以下では、本稿の前後を合わせて5回分(第14回~第18回)のみ表示しています。
連載の全タイトルを参照するには、[この記事の連載 INDEX]を参照してください。
14. オブジェクト指向でコードを記述する[CoffeeScript]
書籍転載の14本目(書籍内の番号は「63」)。CoffeeScriptを使用すると、クラスベースのオブジェクト指向で記述できる。その内容を説明する。
15. 処理を短く記述する[CoffeeScript]
書籍転載の15本目(書籍内の番号は「64」)。CoffeeScriptの基本構文のうち、数値や文字列表現、配列、for~in、unless/untilの記述方法を説明する。
16. JavaScriptでクッキーを簡単に操作する[jquery.cookie]
書籍転載の16本目(書籍内の番号は「61」)。JavaScriptでのクッキー操作をごくシンプルなコードで実装できる「jquery.cookieプラグイン」の基本的な使い方を説明する。
17. HTML5+JavaScriptベースでゲームを作る[enchant.js]
書籍転載の17本目(書籍内の番号は「65」)。HTML5+JavaScriptで作られたゲーム・エンジン「enchant.js」の基礎と、基本的な使い方を解説する。