具有保存的整數和變量的HTML5本地存儲

Question

我正在嘗試實現一種功能，使用戶能夠保存使用已經創建的靜態變量的數學公式，並將其保存在Local Storage中。 然后，腳本從本地存儲中獲取該公式，進行數學運算並將結果顯示在表上。

除了獲取部分，我一切都准備好了。 因為localStorage.getItem（）返回一個字符串，並且用parseFloat（）/ parseInt（）對其進行轉換僅返回第一個整數或NaN。 兩者都弄亂了預期的結果。

有什么辦法可以從localStoage獲取包含整數和變量的對象？

這是一個應運行的公式示例，該示例由5個localStorage.getItem（）請求獲取。

avgFrags*250
avgDmg*(10/(avgTier+2))*(0.23+2*avgTier/100)
avgSpots*150
log(avgCap+1,1.732)*150
avgDef*150

有什么想法或選擇嗎？

編輯：

每行代表一個getItem（）請求的輸出；

form_frag = localStorage.getItem('formula_frag');
form_dmg = localStorage.getItem('formula_dmg');
form_spot = localStorage.getItem('formula_spot');
form_cap = localStorage.getItem('formula_cap');
form_def = localStorage.getItem('formula_def');

Answer 1

localStorage存儲在鍵值存儲中，每個值都被推到字符串中。 如果您確定要處理“整數”，則可以將字符串推入數字：

var avgFrags = +localStorage.getItem('avgFrags'); // The + infront pushes the string to number.

我不確定我是否理解您的問題。

(+"123") === 123

Answer 2

如果您事先知道使用Function()的變量名稱，則可以輕松地將字符串轉換為函數。 第一個參數是您的函數參數，最后一個是您的函數體。

var func1 = Function('avgFrags', 'return avgFrags * 250;');

這等效於：

function func1(avgFrags) {
    return avgFrags * 250;
}

已知功能簽名

如果您知道什么變量名稱將用於本地存儲中的每個項目，那么使用函數應該很容易完成您想要的事情：

// from your edited question
form_frag = localStorage.getItem('formula_frag');
form_dmg = localStorage.getItem('formula_dmg');

// ... create functions

var fragsFunc = Function('avgFrags', form_frg );
var dmgFunc = Function('avgDmg', 'avgTier', form_dmg );

// ... get frags

var frags = fragsFunc (10); // frags = 2500; // if sample in storage

未知功能簽名

現在，如果變量名數量有限，並且您不知道每個函數將使用哪個變量名，則可以執行以下操作：

var avgFrags, avgDamage, avgTier, avgSpots, avgCap, avgDef;

// ... get from storage

form_frag = localStorage.getItem('formula_frag');
form_dmg = localStorage.getItem('formula_dmg');

// ... create functions

var fragsFunc = Function('avgFrags', 'avgDamage', 'avgTier', 'avgSpots', 'avgCap', 'avgDef', form_frag);
var dmgFunc = Function('avgFrags', 'avgDamage', 'avgTier', 'avgSpots', 'avgCap', 'avgDef', form_frag);

// ... get frags, only the first argument is used, but we don't know that.

var frags = fragsFunc (avgFrags, avgDamage, avgTier, avgSpots, avgCap, avgDef); // frags = 2500; // if sample in storage

您可以通過僅將一個變量傳遞到函數中來簡化此過程，該變量是一個對象，其中包含可以傳遞給函數的所有參數。 只需確保函數編寫器使用該對象即可。

var settings = { 
    avgFrags: 10, 
    avgDamage: 50,
    // ...
};

var fragsFunc = Function('s', 's.avgFrags * 250');

var frags = fragsFunc (settings); 

使用正則表達式獲取零件

我假設以上內容可以完成工作，您實際上並不想要具有變量名，數字和運算符的對象。

如果只需要變量名和數字（以及運算符），則可以使用正則表達式。

([a-z_$][\w\d]*)|([0-9]*\.?[0-9]+)|([^\w\d\s])

您可以使用它來創建每個部分的數組。 此外，每個部分都進行了分組，因此您知道哪個是變量名，哪個數字，另一個（括號或運算符）

var re = /(\w[\w\d]*)|([0-9]*\.?[0-9]+)|([^\w\d\s])/g,
    match,
    results;

while ((match = re.exec(localStorage.getItem('formula_frag'))) {
    results.push({
        text: match[0],
        type: (match[1]) ? 'var' | (match[2]) ? 'number' : 'other'
    })
}

您可以使用REY查看帶有示例數據的正則表達式的輸出。

Answer 3

是的，您可以在本地存儲中設置對象

這是為此的小提琴-http: //jsfiddle.net/sahilbatla/2z0dq6o3/

Storage.prototype.setObject = function(key, value) {
    this.setItem(key, JSON.stringify(value));
}

Storage.prototype.getObject = function(key) {
    var value = this.getItem(key);
    return value && JSON.parse(value);
}

$(function() {
    localStorage.setObject('x', {1: 2, 2: "s"})
    console.log(localStorage.getObject('x'));
});