これら 8 つの JavaScript ライブラリを使用して、ローカル ストレージをより適切に処理してください。 ！

この記事では、ローカル ストレージをより適切に処理できる 8 つの JavaScript ライブラリを推奨します。一定の参考値があるので、困っている友達が参考になれば幸いです。

現在のプロジェクト用にいくつかのローカル リポジトリをテストしました。どのような素晴らしい機能があるのか​​知りたいですか?読み続けて。

ローカル ストレージ ブリッジ

https://github.com/krasimir/lsbridge

同じブラウザ タブ内のあるタブから別のタブにメッセージを送信する必要がある場合は、難しい方法でやる必要はありません。ローカル ストレージ ブリッジは、タスクを簡単にするためにここにあります。

基本的な使用法:

// 发送
lsbridge.send(‘app.message.error’, { error: ‘Out of memory’ });

// 监听
lsbridge.subscribe(‘app.message.error’, function(data) {
  console.log(data); // { error: ‘Out of memory’ }
});

Basil.js

##Basil.js は、セッション、localStorage、Cookie を統合して、簡単な方法を提供します。データを処理するため。

基本的な使用法:

let basil = new Basil(options);

basil.set(‘name’, ‘Amy’);
basil.get(‘name’);
basil.remove(‘name’);
basil.reset();

store.js

https://github.com/marcuswestin/store.js

Store.js 他のものと同様データストレージについても同様です。しかし、それだけではありません。高度な機能の 1 つを使用すると、ブラウザーのサポートにさらに深くアクセスできるようになります。

基本的な使用法:

store.set(‘book’, { title: ‘JavaScript’ }); // Store a book
store.get(‘book’); // Get stored book
store.remove(‘book’); // Remove stored book
store.clearAll(); // Clear all keys

lscache

https://github.com/pamelafox/lscache

localStorage API に似ています。実際、これは localStorage のラッパーであり、HTML5 を使用して memcaches 関数をエミュレートします。上記のドキュメントでその他の機能を確認してください。

基本的な使用法:

lscache.set(‘name’, ‘Amy’, 5); // 数据将在5分钟后过期
lscache.get(‘name’);

Lockr

Lockr は localStorage API に基づいて構築されています。これは、ローカル データをより簡単に操作するためのいくつかの便利な方法を提供します。

localStorage API の代わりにこのライブラリを使用する理由は何ですか?

そうですね、localStorage API では文字列のみを保存できます。数値を保存したい場合は、まず数値を文字列に変換する必要があります。 Lockr ではより多くのデータ型やオブジェクトさえも保存できるため、Lockr ではこのようなことは起こりません。

基本的な使用法:

Lockr.set(‘name’, ‘Amy’);
Lockr.set(‘age’, 28);
Lockr.set(‘books’, [{title: ‘JavaScript’, price: 11.0}, {title: ‘Python’, price: 9.0}]);

Barn

https://github.com/arokor/barn

Barn は、Redis のようなソリューションを提供します。ローカルストレージ API。永続性が重要な場合は、エラーが発生した場合にデータの状態を維持するためにこのライブラリが必要になります。

基本的な使用法:

let barn = new Barn(localStorage);

// 原始类型
barn.set(‘name’, ‘Amy’);
let name = barn.get(‘name’); // Amy

// List
barn.lpush(‘names’, ‘Amy’);
barn.lpush(‘names’, ‘James’);
let name1 = barn.rpop(‘names’); // Amy
let name2 = barn.rpop(‘names’); // James

localForage

https://github.com/localForage/localForage

このシンプルで高速なライブラリは、IndexedDB または WebSQL を渡します。は、非同期ストレージを使用して、Web のオフライン エクスペリエンスを向上させます。これは localStorage に似ていますが、コールバック機能を備えています。

基本的な使用法:

localforage.setItem(‘name’, ‘Amy’, function(error, value) {
  // Do something
});

localforage.getItem(‘name’, function(error, value) {
  if (error) {
    console.log(‘an error occurs’);
  } else {
    // Do something with the value
  }
});

驚くべきことに、中国語のドキュメント (https://localforage.docschina.org/)

crypt.io

# が提供されていることです。 # #https://github.com/jas-/crypt.io

crypt.io は、標準の JavaScript 暗号化ライブラリを使用して、安全なブラウザ ストレージを実装します。 crypto.io を使用する場合、sessionStorage、localStorage、Cookie の 3 つのストレージ オプションがあります。

基本的な使用法:

let storage = crypto;
let book = { title: ‘JavaScript’, price: 13 };

storage.set(‘book’, book, function(error, results) {
  if (error) {
    throw error;
  }
  
  // Do something
});

storage.get(‘book’, function(error, results) {
  if (error) {
    throw error;
  }
  // Do something
});

他のローカル リポジトリをご存知ですか?なぜそれを使うのでしょうか？以下のコメント欄でお知らせください。

英語の元のアドレス: https://medium.com/javascript-in-plain-english/8-javascript-libraries-for-better-handling-local-storage-d8cd4a05dbfa

プログラミング関連の知識について詳しくは、

プログラミング ビデオ コース

をご覧ください。 ！

以上がこれら 8 つの JavaScript ライブラリを使用して、ローカル ストレージをより適切に処理してください。 ！の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。