先端データ記憶方式のindexedDB

15255 ワード

javaScript

概要
先端が発展してから一定のブラウザにデータを格納する方式が形成されました.cookie、sessionStorage、localStorage、indexedDB、および廃棄されたweb sqlがあります.

キーの値は、各データを格納する主要キーがあり、主キーはユニークで、key-valueを実行して記憶する.

非同期動作は非同期動作を実行する.

は、トランザクションサポートトランザクション動作をサポートする.データ操作は成功と失敗の2つの状態だけであることを意味する.

ソースポリシーの各データベースは、ドメイン名を作成することに対応しており、自身のドメイン名の下のデータベースにのみアクセスできます.

格納空間は250 M以上のデータをサポートしています.上限がない

もあります.

は、バイナリ記憶をサポートし、バイナリデータを記憶することができます.

データベース操作
データベース接続とデータベース作成
windowオブジェクトindexedDB属性のオープンメソッドを使用して、最初のパラメータはデータベース名であり、存在すればデータベースが存在しないと作成されます.第二のパラメータは、データベースのバージョンが0より大きい正の整数です.データベースを開くと、4つのイベントをトリガします.error:開けませんでした.失敗したugradeneeded:このデータベースを初めて開けた時、またはデータベースバージョンが変化した時にトリガします.blocked:前回のデータベース接続はまだクローズされていません.初めてデータベースを開くと、upgradeneededイベントが先にトリガされ、successイベントがトリガされます.

let  request = indexedDB.open(name, 1);
request.onsuccess = function(e){
  db = e.target.result;
}

「対象倉庫」を作成します.createObjectStore()を使用して、対象倉庫の作成を行う.

最初のパラメータは倉庫名であり、同じデータベースでは重複してはいけません.

番目のパラメータは一つのオブジェクトで、keyPathとautoIncrementを含み、それぞれのレコードのキー名と自動的にインクリメントされた整数をキー名として使用するかどうか、デフォルトはfalse

です.

db.createObjectStore(name[,options]);
//        upgradeneeded   
        request.addEventListener('upgradeneeded', e => {
            db = e.target.result;
            if(!db.objectStoreNames.contains('person')){
                let store = db.createObjectStore(table, {keyPath: 'keyword', autoIncrement: false});
            }
        })

事務の操作
indexedDBは事務操作をサポートしており、はデータベースの操作は成功と失敗の二つの可能性しかないので、データベースの操作を行う前にまず事務を作成する必要があります.

nameは操作する倉庫の名前です.

readwriteは倉庫に対してどんな操作を行いますか?

const tx = db.transaction(name, 'readwrite');

新規操作
indexedDBデータベースは、データを追加する操作も可能であり、先に事務を追加し、addを使用して追加する必要があるが、同じであれば動作は失敗する.チェーンで呼び出し、indexedDB操作時に非同期で操作することもできますので、イベントの傍受成功と失敗が必要です.

const tx = db.transaction('name', 'readwrite');
const store = tx.objectStore('name');
const add = store.add({keyword:'table',s:0});
add.addEventListener('success', e => {
      console.log('    ');
})
add.addEventListener('error', e => {
        console.log('    ');
})

データを更新
同じデータを追加したいなら、put方法を使用することができる.

const tx = db.transaction('name', 'readwrite');
const store = tx.objectStore('name');
const add = store.put({keyword:'table',s:0});
add.addEventListener('success', e => {
      console.log('    ');
})
add.addEventListener('error', e => {
        console.log('    ');
})

データを取得get方法を用いて、この値はkey値によって得られる.

const get = db.transaction('name','readwrite')
.objectStore('name')
 .get('keyword');

データを削除delete方法を用いて、key値により削除する.

const get = db.transaction('name','readwrite')
.objectStore('name')
 .delete('keyword');

ラベルの使用
indexedDBは、第一条から最後まで巡回し、openCursorを使って作成し、continueを使って、リゾットは倉庫の中のすべてのデータです.

const cursor = db.transaction('users').objectStore('users').openCursor();
cursor.addEventListener('success',e=>{
      let result = e.target.result;
       if(result){
            console.log('cursor',result);
             cursor.continue();//              。
         }else{
               console.log('    ',result);
        }
})

関連コードの詳細についてhttps://github.com/youyou1995/learn/blob/master/javascript/indexedDB/indexedDB.js

世界最短のIE判定(古典転載)