js 對有“命名空間”的表單做深度解析

問題描述：一個大表單中，可能包含幾十個字段，這些字段在數據庫中的映射很可能不在一張表中，爲了減少後臺操作的工作量，我們應該在前臺提交的時候對數據做初步處理。

舉例說明：

如圖所示：這樣的一個表單把兩張表糅合到一起去了，提交的時候一起提交，但內容並不在同一張表中，實體也不是同一個實體，那麼如何才能把前臺傳過來的json數據分別帥選出來呢？

在後臺或許也是可以做到的，但這樣的事情應該在前臺完成，比如，以上表單傳到後臺就應該是這樣的格式：

{stuInfo:{name:'saler',gender:'F',addr:'BeiJing',age:30},stuCourse:{English:80,Math:70,Computer:90,Software:100}}

這樣在後臺可以進行模塊化處理，不需要一個個來搞（如果一個個搞，字段超過10個，那簡直就是災難）。那麼前臺獲得表單的數據以後應該怎麼處理？這是本文講述的重點，直接上代碼。

function getData(deep){
	var obj = {};
	var items = [{name:'stuInfo.name',value:'saler'},{name:'stuCourse.English',value:80},{name:'stuInfo.gender',value:'F'},{name:'stuCourse.Math',value:70},{name:'stuInfo.addr',value:'BeiJing'},{name:'stuCourse.Computer',value:90},{name:'stuInfo.age',value:30},{name:'stuCourse.Software',value:100}]
	if(deep){
		for(var i = 0;i < items.length;i++){
			var item = items[i];
			namespace(obj, item.name, item.value);
		}
	}else{
		for(var i = 0;i < items.length;i++){
			var item = items[i];
			obj[item.name] = item.value;
		}
	}	
	
	return obj;
}

//命名空間
function namespace(oNamespace,sPackage,value) {
    var obj = oNamespace;
   var  pkg = "";
    if(sPackage.indexOf(".")==-1){
        pkg = sPackage;
    }else{
        pkg = sPackage.substr(0,sPackage.indexOf("."));
    }
    if(pkg&&!(obj[pkg]&&obj[pkg] instanceof Object)){
        obj[pkg] = {};
    }
	
    if(sPackage.indexOf(".")!=-1){
        namespace(obj[pkg],sPackage.substr(sPackage.indexOf(".")+1),value);
    }else{
    	obj[pkg] = value;
	}
     
    return obj;
}

函數getData中，items表示form各個元素，deep爲true是表示要進行深度解析，這樣所有的數據都會由前綴決定統一封裝成對象。執行結果如下：

需要注意的是namespace方法，這個方法的作用就是根據前綴名把對象的路徑解析出來，並把value交給最後的那個變量，比如sPackage=a.b.c value=20那麼結果就是{a:{b:{c:20}}}如果原始對象（oNamespace）存在，會在該對象的基礎上做處理。

說明：本例是根據jquery miniui組件中form組件中的getData方法的功能做的重寫，並沒有看過其源碼，或許他們的實現方式更好，請讀者自己選擇嘗試。