在瀏覽器上儲存資料(轉)

在瀏覽器上儲存資料(轉)[@more@]

JavaScript 能做的事，並不侷限於訪問HTML 表單的資料；它還能讓你建立自己的物件――也就是讓你建立儲存於客戶端的資料。你甚至還能建立包含其它物件的物件。

為什麼需要這些功能？一個好的理由就是建立陣列（array）。簡單來說，陣列是一個含有幾組相關資訊的表格或資料庫。在下面的例子當中，我們定義了一個叫做taxTable的物件，該物件包含一個陣列，而該陣列由五個 name 物件例項所組成。這個陣列儲存五個州的州名，以及它們相關的稅率。然後，當使用者在訂購表單中輸入州名時，我們就在陣列中檢查它，並自動應用正確的稅率。

建立一個5x2的陣列，與使用一個快速的 if-then 序列來測試州名相比，使用陣列似乎還要做額外的工作。不過，隨著條目個數的增加，陣列的功能也就變得愈來愈強大。不妨想象有一個擁有五十個州、或五百個銷售區、亦或是五千個城市的表格。有了一個陣列，你就能夠一次建立條目列表，然後每當使用者輸入新資料時，就可迅速加以引用這個條目列表。

下面這個特殊的JavaScript 程式碼，開始就像我們的計算（calculation）示例一樣。不過這一次，我們並不止於簡單的數學計算：

function state(stateName, stateTax){

  //fill the instance with the values passed in

  this.name=stateName;

  this.tax=stateTax;

  //then return the instance of state

  return this;

}

上面定義的state() 函式建立了包括州名與稅率的一個州（state）的例項。然而，我們的州此時似乎什麼值都沒有。下面我們給它們一些值吧。

function taxTable(){

  //the instance of taxTable is filled with

  //an array of state objects

  this[0]=new state("AZ", 0.04);

  this[1]=new state("HI", 0.10);

  this[2]=new state("TX", 0.06);

  this[3]=new state("NJ", 0.08);

  this[4]=new state("", 0.00);

  //return the newly created taxTable to

  //the calling function

  return this;

}

現在，無論taxTable函式何時被呼叫，我們都建立了五個不同的州例項，分別編號為0到4。這樣一來，我們就建立了一個陣列，來儲存我們所有的稅率資訊。現在我們需要加以處理一番：

functioncalculateTax(stateValue){

  var index=0;

  var result=0;

  var temp=0;

  首先，我們定義一個稱為calculateTax的函式。calculateTax會以初始化一些變數開始。然後，它需要從使用者那裡取得一個值：

  //while there"s an instance of state

  //in the taxGuide array

  while (taxGuide[index])

  {

    //if the state passed in is in the

    //taxGuide array

    if (stateValue.toUpperCase() == taxGuide[index].name) {

      // put the correct tax rate in "result"

      result = taxGuide[index].tax;

    }

    index++;

  }

  while 迴圈會持續將使用者的輸入，與稅率表中的所有可能的條目進行比較，直到比完完全部資料。一旦它發現一個匹配（或是沒有匹配），它就將適當的稅率寫入 result 變數中。然後我們可以使用該稅率來計算總量，然後將其加至我們的總額之中。

  {

 calcTotal();

    var temp1 = document.orderForm.totalPrice.value;

    // calculate total with tax

    var temp2 = (parseFloat(temp1) * (1 + parseFloat(result)));

    // chop off extra decimal places

    vartotalWithTax = (Math.round(temp2 * 100)) / 100;

    // change value in form

    document.orderForm.totalPrice.value =

    totalWithTax;

  }

  上面的程式碼計算包括稅金在內的全部費用。首先，我們設定變數temp1 的值等於totalPrice表單元素的值。然後，我們再計算稅後總額，並將其值賦給“temp2”。下一行程式碼則使用Math.round方法捨去額外的小數位，然後將新的總額賦值給totalWithTax變數。接下來，我們將此總額送回到訂購表單之中。