IndexedDBで部分一致、前方一致、後方一致検索をする

photo by Tim Reckmann

IndexedDBでSQLでいうところのLike演算子はどうすれば実現できるのかを調べたので、その方法をまとめる。

IndexedDBの基本的なところは、TypeScriptでIndexedDBの登録・更新・削除・検索をするを参考にしてほしい。
また、この記事のWebフォームをそのまま使う。
※TypeScriptと書いてあるけど、JavaScriptのソースコードもあるので、参考にどーぞ！

部分一致検索

検索には「名前」と「詳細」を使用する。

$('#all-search').click(() => {
    // 検索キーワード
    var keyName: string = $('#name').val();
    var keyDescription: string = $('#description').val();

    var trans = db.transaction('books', 'readonly');
    var store = trans.objectStore('books');
    // 全データ取得
    var request = store.openCursor();

    request.onsuccess = (event) => {
        var cursor = <IDBCursorWithValue>(<IDBRequest>event.target).result;
        if (cursor) {
            var value = <BookInfo>cursor.value;

            // 部分一致検索
            if (value.name.indexOf(keyName) != -1
                && value.description.indexOf(keyDescription) != -1) {
                render(value);
            }

            cursor.continue();
        }
    };
});

openCursorで全件取得し、その後の17～18行目でフィルタをかけている。

String.indexOf(Keyword) != -1がTrueになれば部分一致になる。

前方一致検索

全体的に「部分一致検索」と同じなので、17～20行目の部分だけを修正する。

// 前方一致検索
var name = " " + value.name;
if (name.indexOf(" " + keyName) != -1) {
    render(value);
}

キーワードの先頭に「" "（空白）」を結合してから、「String.indexOf(“ “ + keyword) != -1」とすることで、前方一致検索が可能になる。

後方一致検索

これまた「前方一致検索」とほぼ同じ。

// 後方一致検索
var name = value.name + " ";
if (name.indexOf(keyName + " ") != -1) {
    render(value);
}

キーワードの末尾に「" "（空白）」を結合してから、「String.indexOf(keyword + “ “) != -1」とすることで、後方一致検索が可能になる。

さいごに

今回はTypeScriptで書いているが、ECMAScript6からC#やJavaのように「部分一致: include()」、「前方一致: startsWith()」、「後方一致: endsWith()」が使えるようになる。

• String.prototype.startsWith() - JavaScript | MDN
• String.prototype.endsWith() - JavaScript | MDN
• String.prototype.includes() - JavaScript | MDN

参考サイト

• javascript - How to search indexeddb for a string - Stack Overflow

以上

written by @bc_rikko