es6實現的本地儲存程式碼例項
分享一段程式碼例項,它利用es6實現了本地儲存的程式碼封裝功能。
感興趣的朋友可以參考一下,程式碼如下:
[JavaScript] 純文字檢視 複製程式碼class BaseLocalStorege { constructor(preId, timeSign) { this.preId = preId this.timeSign = timeSign this.status = { Success: 0, //成功 FaiLure: 1, //失敗 OverFlow: 2, //溢位 TimeOut: 3 //過期 } this.storage = localStorage || window.localStorage } getKey(key) { return this.preId + key } //新增(修改)資料 /* * 引數key:資料欄位標識 * 引數value:資料值 * 引數callback:回撥函式 * 引數time:新增時間 */ set(key, value, callback, time) { let status = this.status.Success key = this.getKey(key) try { time = new Date(time).getTime() || time.getTime(); } catch (e) { //TODO handle the exception //為傳入時間引數或者時間引數有誤獲取預設時間:一個月 time = new Date().getTime() + 1000 * 60 * 60 * 24 * 31; } try { //向資料庫中新增資料 this.storage.setItem(key, time, +this.timeSign + value); } catch (e) { //溢位失敗,返回溢位狀態 //TODO handle the exceptionOverFlow status = this.status.OverFlow; } callback && callback.call(this, status, key, value); } get(key, callback) { //預設操作狀態時成功 let status = this.status.Success key = this.getKey(key), //預設值為空 value = null, //時間戳與儲存資料之間的拼接符長度 timeSignLen = this.timeSign.length, //快取當前物件 that = this, //時間戳與儲存資料之間的拼接符起始位置 index, //時間戳 time, //最終獲取的資料 result; try { //獲取欄位對應的資料字串 value = that.storage.getItem(key); } catch (e) { //TODO handle the exception //獲取失敗,則返回失敗狀態,資料結果為null result = { status: that.status.FaiLure, value: null }; callback && callback.call(this, result.status, result.value); return result; } //如果成功獲取資料字串 if (value) { //獲取時間戳與儲存資料之間的拼接符起始位置 index = value.indexOf(that.timeSign); //獲取時間戳 time = +value.slice(0, index); //如果時間過期 if (new Date(time).getTime() > new Date().getTime() || time == 0) { //獲取資料結果(拼接符後面的字串) value = value.slice(index + timeSignLen); } else { //過期則結果為null value = null; //設定狀態過期為過期狀態 status = that.status.TimeOut; //刪除該欄位 that.remove(key); } } else { //未獲取資料字串狀態為失敗狀態 status = that.status.FaiLure; } //設定結果 result = { status: status, value: value }; //執行回撥函式 callback && callback.call(this, result.status, result.value) } remove(key, callback) { //設定預設初始狀態為失敗 let status = this.status.FaiLure, key = this.getKey(key), //設定預設資料結果為空 value = null; try { //獲取欄位對應的資料 value = this.storage.getItems(key); } catch (e) { //TODO handle the exception //如果資料存在 if (value) { try { //刪除資料 this.storage.removeItem(key); //設定操作成功 status = this.status.Success; } catch (e) { //TODO handle the exception } } //執行回撥 注意傳入回撥函式中的資料值:如果操作狀態成功則返回真實的資料結果,否則返回空 callback && callback.call(this, status, status > 0 ? null : value.slice(value.indexOf(this.timeSign) + this.timeSign.length)) return callback; } } }
相關文章
- 使用js實現儲存讀取js字串程式碼例項JS字串
- jQuery實現的利用cookie儲存使用者登入資訊程式碼例項jQueryCookie
- js基於Cookie的儲存類例項程式碼JSCookie
- canvas實現的刮刮樂程式碼例項Canvas
- css實現梯形程式碼例項CSS
- javascript實現的驗證碼程式碼例項JavaScript
- 將網頁儲存為圖片形式程式碼例項網頁
- jQuery實現的tab選項卡程式碼例項jQuery
- jquery實現的選項卡效果例項程式碼jQuery
- javascript實現的補零程式碼例項JavaScript
- js實現jquery的extend()程式碼例項JSjQuery
- js實現的警告框例項程式碼JS
- canvas實現的美猴王程式碼例項Canvas
- canvas實現的驗證碼效果程式碼例項Canvas
- js使用cookie儲存網站背景顏色程式碼例項JSCookie網站
- css實現對聯程式碼例項CSS
- 純css實現的tab選項卡程式碼例項CSS
- js實現的垂直選項卡效果程式碼例項JS
- js實現的可以通用的選項卡程式碼例項JS
- jQuery實現的選項卡的巢狀程式碼例項jQuery巢狀
- cookie儲存使用者登入名和密碼程式碼例項Cookie密碼
- jquery實現的分頁效果例項程式碼jQuery
- css實現的字串擷取程式碼例項CSS字串
- js實現的冪運算程式碼例項JS
- javascript實現的加入收藏程式碼例項JavaScript
- js實現的元素運動程式碼例項JS
- canvas實現的變幻線程式碼例項Canvas線程
- canvas實現的多邊形程式碼例項Canvas
- canvas實現的千輪眼程式碼例項Canvas
- canvas實現的鋸齒效果程式碼例項Canvas
- canvas實現的鐘表效果程式碼例項Canvas
- jQuery實現的隔行變色程式碼例項jQuery
- jquery實現的滑動門程式碼例項jQuery
- es6陣列合並程式碼例項陣列
- ES6陣列去重程式碼例項陣列
- 利用canvas實現的驗證碼效果程式碼例項Canvas
- jquery.idTabs實現的選項卡程式碼例項jQuery
- Java圖片剪裁併儲存的程式碼實現Java