Javascript MEMO

カーソルで取得したデータをレコードとして順次取り出し
updateを使用して更新します。
[一般的な目安]

getAll()	数百件〜数千件程度 ※getAll()は全件を一括でメモリに読み込むため、データ量が多いとブラウザのメモリを圧迫する可能性があります。
カーソル	数万件以上特に画像やバイナリデータを含む場合は、カーソル推奨。

async function sampleTest(dbName, storeName) { const db = await databaseOpen(dbName); //update await runTx(db, storeName, "readwrite", (store) => { const cursorReq = store.openCursor(); cursorReq.onsuccess = (event) => { const cursor = event.target.result; if (cursor) { const record = cursor.value; record.f3 = "change" + (record.f1 + 1); cursor.update(record); cursor.continue(); } }; }); //select all const rows = await runTx(db, storeName, "readonly", (store) => { return new Promise((resolve, reject) => { const req = store.getAll(); req.onsuccess = () => resolve(req.result); req.onerror = () => reject(req.error); }); }); rows.forEach(r => console.log(`f1:${r.f1}, f2:${r.f2}, f3:${r.f3}`)); db.close(); } function waitForTx(tx) { return new Promise((resolve, reject) => { tx.oncomplete = () => resolve(); tx.onabort = () => reject(tx.error ?? new Error("Transaction aborted")); tx.onerror = () => reject(tx.error); }); } async function runTx(db, storeName, mode, work) { const tx = db.transaction([storeName], mode); const store = tx.objectStore(storeName); const result = await work(store); await waitForTx(tx); return result; } function databaseOpen(dbName) { return new Promise((resolve, reject) => { const req = indexedDB.open(dbName); req.onsuccess = (event) => { resolve(event.target.result); }; req.onerror = () => reject(req.error); }); } sampleTest("aaa", "t1");

このサンプルではデータベースの更新処理(テーブル削除など)がなかったと仮定したものです。
insertでデータが入っているものと仮定します。

const db = await openDatabase(dbName, version, (db) =>

データベースをopenします。

if (!db.objectStoreNames.contains(storeName))

引数にあるオブジェクトスキーマが存在しない場合は作成します。

const req = store.getAll();

オブジェクトスキーマからすべてのレコードを取得します。

const cursorReq = store.openCursor();

オブジェクトスキーマからレコードを順番に取り出す準備をしたカーソルを生成します。

const cursor = event.target.result;

onsuccessイベントでカーソルを変数に保存します。

const record = cursor.value;

カーソルの行データを取り出します。

record.f3 = "change" + (record.f1 + 1);

行データを更新した結果をカーソルのf3フィールド変数に保存します。

cursor.update(record);

カーソルを更新します。

cursor.continue();

次のカーソルを呼び出します。

await waitForTx(tx);

トランザクションの完了の結果を受け取るまで待ち状態となります。