`審查人：白占寧` `被審核代碼負責人：張紅橋&李偉&謝洋` `代碼地址：https://192.168.1.240:8443/svn/repos/command-cabin/source` #### 1、CSS代碼混雜到HTML中（已修改） 文件名：`pages/index.html`和`pages/sheqing.html`。 `pages/index.html`和`pages/sheqing.html`兩個頁面中有混雜部分CSS代碼，建議將CSS代碼從HTML中分離出來，單獨寫到css文件中。 #### 2、JS文件中多次重復定義相同的方法（已修改） 文件名：`scripts/index.js`和`scripts/sheqing.js`。 `scripts/index.js`和`scripts/sheqing.js`兩個文件中都定義了重復的方法。 ``` var PAGE_WIDTH = 10368 var PAGE_HEIGHT = 3888 function zoom(){ var x = window.innerWidth / PAGE_WIDTH var y = window.innerHeight / PAGE_HEIGHT $('body').css('webkitTransform', 'scale(' + x + ',' + y + ')') //for Chrome || Safari $('body').css('msTransform', 'scale(' + x + ',' + y + ')') /* for Firefox */ $('body').css('mozTransform', 'scale(' + x + ',' + y + ')') /* for IE */ $('body').css('oTransform', 'scale(' + x + ',' + y + ')') /* for Opera */ } ``` 解決方案：刪除掉重復的方法定義，使用`scripts/common`中的公用方法。 #### 3、mock數據引入問題（已修改） 文件名：`xinJiang/index.js`。 mock數據時候分模塊和接口mock，然后將該模塊下所有相關的mock都整合到一個js文件中，在業務代碼中引入時候只引入一個文件。 ``` //Mock數據 require('popCatStaData') require('regPerDistributionData') require('vehDistributionData') require('perTypeRatioData') ``` 解決方案：`mockData/sheqing/xinJiang/`目錄下新建`index.js`，將其他模塊`require`進`index.js`文件中，在業務代碼中只`require(index.js)`即可。 #### 4、不要多次聲明相同的變量（已修改） 文件名：`xinJiang/index.js`。 ``` var time = 'year' //時間參數 bindEvent: function () { var self = this var person = require('../personFlow/index.js') var time = 'year' ``` 重復聲明了`time`變量。 解決方案：同一個變量只聲明一次，避免出現歧義的情況。 #### 5、不要聲明沒有使用到的變量及require位置（已修改） 文件名：`xinJiang/index.js`和`scripts/sheqing/personFlow/left.js`。 ``` bindEvent: function () { var self = this var person = require('../personFlow/index.js') ``` 聲明的`person`變量沒有使用到，另不要在方法執行過程中`require`任何資源。 解決方案：刪除無用的變量； 建議所有`require`統一放到`define`模塊最前面。 ``` define(function(require) { // 引入公用模塊 require('d3') require('jQuery') //引入業務模塊 var person = require('../personFlow/index.js') ...... }) ``` #### 6、調用的方法中不要再定義方法（已修改） ``` render: function () { var tpl = require('../../../templates/sheqing/xinJiang/index.tpl') $('.xinJiang').html(tpl) var date function gDate() { date = new Date() $('.date').text(formateDate(date.getHours()) + ':' + formateDate(date.getMinutes()) + ':' + formateDate(date.getSeconds())) } gDate() function formateDate(t) { if (t < 10) { return '0' + t } return t } ``` 這段代碼問題很大： 1、`require('../../../templates/sheqing/xinJiang/index.tpl')`不要放到該方法中； 2、不要在方法中定義`gDate`和`formateDate`兩個函數； 3、函數命名不規范，如`gDate`。 #### 7、注釋不去或缺少部分函數的注釋（未修改） 所有js文件。 關鍵的地方和所有函數，都需要有相應的注釋。 #### 8、文件位置（已修改） 文件名：`popDistribute/map.js`。 ``` d3.json('../../sea-modules/chongqing.json', function(error, root) { if (error) { return console.error(error); } ``` `chongqing.json`不應該放到`sea-modules`目錄下。 解決方案：`chongqing.json`移到對應的data目錄下。 #### 9、所有D3組件統一放到charts目錄下（已修改） `popDistribute/mapTool`，移動到`charts`目錄下，所有D3組件統一放到`charts`目錄中，方便后期統一管理和維護。 #### 10、數據可靠性驗證（未修改） 涉及到所有模塊的js代碼。 優先級不高，后續需要特別注意。 ``` request.sendAjax(apiURL.popDistribute + time, function(data) { //默認渲染--全部人口 topList.render(data.all.areaCity.concat(data.all.mainCity)) map(data.all) ``` 對ajax返回的數據沒有進行可靠性驗證，上面的代碼，如果`data為null`或`data.all為undefined`，程序則會報錯。 解決方案：先做數據有效性校驗，再使用數據渲染頁面。