DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 將json當數據庫一樣操作的javascript lib
將json當數據庫一樣操作的javascript lib
編輯:關於JavaScript     

前段時間工作中用到Json數據,希望將一些簡單的增刪改查放到客戶端來做,這樣也能減少服務器端的壓力。分別查找了幾個可以對Json進行操作的javascript 類庫,最終選定了TAFFY DB。原因如下:
1、使用的是BSD開源協議,不用擔心商業使用限制。
2、一直在有人進行更新,並且不和其他框架(如Jquery,YUI,Dojo等)沖突
3、功能齊全——增刪改查、排序等等都有了。
4、小巧,壓縮後只有17k大小。
所以,工作完後,將這篇文章寫出來,並推薦這個類庫給大家,希望能夠幫助到那些正在尋找Json 查詢修改的Coder們一些幫主,並和大家一起交流學習。

TAFFY DB 基本信息
項目主頁:http://taffydb.com/
托管地址:https://github.com/typicaljoe/taffydb

使用方法:
復制代碼 代碼如下:
<script type="text/javascript" charset="utf-8" src="taffy-min.js"></script>

復制代碼 代碼如下:
// 創建空白數據庫
var db = TAFFY();
//創建包含一條數據的數據庫
var db = TAFFY({record:1,text:"example"})
 //通過數組創建數據庫,數組的元素為json格式的object(可多條)
var db = TAFFY([{record:1,text:"example"}])     
// 通過json格式字符串創建數據(可多條)   
var db = TAFFY('[{"record":1,"text":"example"}]')

查詢數據:
首先構建一個數據庫,以後的示例,都以這個數據庫為准。
復制代碼 代碼如下:
var db = TAFFY([//構建一個城市的數據庫,字段分別代表 省份、城市名、郵政編碼、排序
    { province:"北京", cityName:"北京", zipCode:"10001", orderNum:1},
    { province:"河北", cityName:"石家莊", zipCode:"10002", orderNum:2},
    { province:"河北", cityName:"保定", zipCode:"10003", orderNum:3},
    { province:"河北", cityName:"承德", zipCode:"10004", orderNum:4},
]);

1、根據字段值進行查詢
復制代碼 代碼如下:
var cities = db({province:"河北"});  //查詢所有province 值為"河北"的數據,並返回TAFFY格式的object
//console.log這個函數,只要在有控制台的浏覽器中,都可以用,比如火狐的firebug,還有谷歌浏覽器的開發人員工具(按F12可呼出)
for(var i = 0; i< cities().count(); i++){
    //get()這個TAFFY的函數,可以將TAFFY的object數據轉化為json格式
    console.log("城市名", cities().get()[i].cityName);
}
console.log("第一條數據為:", cities().first()); // first()這個函數可以返回json格式的第一條數據

2、根據條件查詢 (具體條件請查閱 http://www.taffydb.com/writingqueries 的“Comparison Operators”小節
復制代碼 代碼如下:
//單條件查詢
//查詢 排序大於 2 的所有數據
db({ orderNum:{'>':2}});
//范圍查詢
//查詢排序大於2 並且 小於 4 的所有數據
db({ orderNum:{'>':2, '<':4}});
//多條件"與" 查詢
//查詢大於2,並且 小於4 ,並且 省份為 河北省 的數據
db({ orderNum:{'>':2, '<':4}, province:"河北"});
//多條件"或"查詢
// 查詢 排序  大於2 或者 小於 4 的數據
db({ orderNum:{'>':2}}, { orderNum : {'<':4}});
//指定數據內查詢(where in)
// 查詢 城市為  保定、石家莊 的數據
db({ cityName:['保定','石家莊']});

3、排序
復制代碼 代碼如下:
//單條件排序
db().order("orderNum desc");    // 根據orderNum 倒序
db().order("orderNum"); //正序
//多字段排序
db().order("orderNum desc, zipCode asc"); //先按照orderNum倒序,然後按照 zipCode正序

4、計算
復制代碼 代碼如下:
//求最大值
db().max("orderNum"); //得到orderNum的最大值,並返回
//求最小值
db().min("orderNum"); //得到最小的 orderNum
//求和
db().sum("orderNum"); //得到所有orderNum的和
//得到第一條數據
db().first();  //取第一條數據,並返回json格式
//得到最後一條數據
db().last(); //取最後一條,並返回json格式
//這個可以用來分頁 哈哈
db().start(15).limit(20); //從第15條數據開始,往後取20條

5、內置函數查詢,有些數據,需要在查詢的時候,就做一些計算,稍顯復雜,可以通過內置函數來查詢
復制代碼 代碼如下:
db().filter(function(){
    return this.cityName.length > 2;
});

添加數據
復制代碼 代碼如下:
//添加一條數據
db.insert({province:"湖南", cityName:"長沙", zipCode:"10005", orderNum:5});

刪除數據
復制代碼 代碼如下:
//刪除全部數據
db().remove();
//刪除所有orderNum 大於5的數據
db({orderNum:{'>':5}}).remove();

修改數據
復制代碼 代碼如下:
//將所有數據 的 orderNum修改為1
db().update({orderNum:1});

//將城市名為北京的 郵政編碼修改為 100000
db({cityName:"北京"}).update({zipCode:"100000"})

//將所有的orderNum 都加1
db().update(function(){
    this.orderNum = this.orderNum + 1;
    return this;
});
/*
特別說明:在有的時候,增刪查都沒有問題,唯獨修改的時候,會碰到報錯:找不到字段
這應該是TAFFY的一個小bug,遇到這個情況,重新初始化一下就好,需要用到一個函數
stringify(),這個是將TAFFY DB 的所有數據,變成字符串,所以遇到這種情況,就可以這樣做了:
*/
db = TAFFY(db().stringify()); //將內容重新初始化
db().update({column:value});

寫到這裡,我想這個簡單的教程也就算是可以了,已經方便小菜們快速上手這個類庫了。
當然,其中還有很多是我沒有去提及,需要自己去查詢的,比如模糊查詢等等,更加復雜的操作。大家可以去項目的官方主頁去看。(英文)

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved