js處理層級資料結構的一些總結

來源:互聯網
上載者:User

標籤:res   his   返回   標識   log   多重   com   目標   god   

開發人員對複雜的資料結構的處理能力也是體現開發人員水平的一個度量吧。。。最近發現自己對一些嵌套資料結構、層級資料結構的處理能力不大足。。。經常被這些把自己繞暈。。。嚴重影響開發效率。。。就稍微低總結了一下下。。。

一、mongodb設計層級關係資料(這裡主要說的是mongoose)

①假設有這樣的一個情境。某個文章下面有評論,每個評論可以被回複,每個回複又可以被回複...

首先,我們知道,普通的一對多的關係,可以通過引用,populate操作找出相應的引用對象,如:

var essaySchema = new mongoose.Schema({   //文章schema    user:{        type: mongoose.Schema.Types.ObjectId, //發行者的引用        ref: ‘user‘, //引用自User Model        require: true //非空    },  ...});

文章與評論的關係,就是一對多。自然也是按照這種處理方式即可。

但是,評論與回複的關係,就有點意思了。首先,評論和回複,回複與該回複的回複雖然是不同的東西(看著就拗口),但是這些的shema的資訊都是由相同的欄位構成。也就是說,可以說是自己嵌套了多個自己。

這個時候,就要這樣處理了:

//評論Schema定義var commentSchema = new mongoose.Schema({    content: {        type: String,         require: true     },    created: {        type: Date,         "default": Date.now     },    user: {        type: mongoose.Schema.Types.ObjectId, //使用者的引用        ref: ‘user‘, //引用自User Model        require: true //非空    },    subComment: [this], //自評論的類型為評論類型,也就是本身類型});

最關鍵就是最後一句,實質上就是遞迴地引用了自身。尋找的時候,也確實是需要根據上一層的subComment找到自己。套了深層的時候,尋找的時候會容易繞暈,而且尋找速度也會降低。建議做層級限制。

實踐小項目:一個簡單版node+express+mongodb的圖片分享

 

二、實際開發情境中的層級關係資料

①假設有這樣的一個情境,有一個商品數組,每個商品有兩個維度,顏色和規格。顏色和規格的組合會產生的sku(可以理解為每種組合情況的一個標識)數量為顏色數量*規格數量。當我們渲染完畢之後,顧客每切換一個規格,都要找到相應的sku。

設想一下,假如顧客每切換一個規格,我們就根據第幾個商品,切換的規格,沒有被切換的規格去尋找。那麼每次都是一個三重迴圈。。。

這種情況下,比較好的做法就是,初始化獲得資料的時候,建立三維資料,即Array[商品index][顏色][規格]。這樣每次切換,只要讀取相應的項就可以找到sku了。

但是,假若商品的維度不是二維,而是多維呢,而且不一定每種組合都存在這樣的商品的呢?

構造資料的方法,就顯得不大明智了,一是組合數過多,並不是每種組合商品都存在,而是迴圈太多重。

這個時候,又要利用對象去構造資料了。

第一步,根據展示需要構造。展示的時候,只需要知道,某個商品的某個維度是某個值即可。即:

var obj = {[{‘商品‘:‘1‘,sku:‘‘,‘維度1’:‘...‘,‘維度2‘:‘...‘,...}]}

當點擊切換維度時候,首先根據原來的維度資訊,更新使用者新選的維度。遍曆該新的維度對象,與維度資訊資料比較,如果一一相符則找到新的sku。然後再更新即可。  

在這裡就要明確自己的"籌碼"與"目標",根據哪些東西,通過哪些途徑可以到達目標。將每一步拆分成一個小方法去做。。。

 

②假設有這樣的一個情境,首先要根據一些規則合并一些請求去請求不同的資料(即返回的資料,是多個參數結合在一起的,必須還要解析出資料原先的對應關係),然後獲得部分資料。再用獲得的部分資料中某條資料的參數去請求第二個介面。然後獲得不同的一些資料。

首先想到的可能是用promise處理,待兩個介面都請求完畢後再進行處理。但是假如,第一個介面獲得的是大部分主要的資料,第二個是小部分的資料。這個時候,等待第二個介面似乎就有點"不划算"了,特別是在使用者體驗上,當一個使用者開啟某個頁面的時候,白屏就不好啦。  

這個時候,我們就要善於利用對象去構造符合我們的資料對象了。

我們可以這樣初始化一個對象:

var obj = {   ‘唯一的參數1‘+‘_’+‘唯一的參數1的id‘ : {      第一次請求的資料 : [],      第二次請求的資料 : [],     }, ‘唯一的參數2‘+‘_’+‘唯一的參數2的id‘ : {      第一次請求的資料 : [],      第二次請求的資料 : [],     },   ...}

  總之,就是要找到唯一的東西,來構造對象。然後再根據這個唯一的值把相應的資料填上。好吧,我都說暈了。看個例子:

for(var i = 0;i < data.length; i++){   for(var j = 0;j < data[i].params.length; j++){        obj[data[i].groupId + ‘_‘ + data[i].params[j].pcId] = {};   }}//請求資料回來後for(var i = 0;i < data.length; i++){   for(var j = 0;j < data[i].params.length; j++){     obj[data[i].groupId + ‘_‘ + data[i].params[j].pcId][firstItem] = data[i].params[j].list;    }}//第二次資料回來後for(var i = 0;i < data.length; i++){   for(var j = 0;j < data[i].params.length; j++){     obj[data[i].groupId + ‘_‘ + data[i].params[j].pcId][moreItem] = data[i].params[j].list;    }}

  注意,如果是用vue,因為第二次請求的資料參數來自第一次,所以請二次資料回來之後,需要用全域api,set方法處理才會生效。

  

好吧。。。說了那麼多,或許我自己明白自己在說啥。。。手動苦笑。。。 

 

js處理層級資料結構的一些總結

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.