`审核人：谢洋`
`被审核代码负责人：李伟&舒曼`
`代码地址：https://192.168.1.240:8443/svn/repos/kunming`
### 存在的问题
#### 1、代码可读性优化（未修改）
代码应该空格的地方未留空，可读性降低。这种情况在变量名或其他自定义名称过长的情况下尤为明显
```javascript
renderJQProportion:function(data) {
var jingqingProportionChart = require('jingqingProportionChart')
jingqingProportionChart.drawCharts('#jingqingProportionChart',data,{})
}
```
解决方案：
```javascript
renderJQProportion: function (data) {
var jingqingProportionChart = require('jingqingProportionChart')
jingqingProportionChart.drawCharts('#jingqingProportionChart', data, {})
}
```
> 注意：该项目中的代码普遍存在这个问题，在编写代码的时候注意
#### 2、代码规范问题（未修改）
```javascript
diandongchetop5: function(data) {
for (var i = 0, length = data.length; i < length; i++) {
data[i].name = data[i].name.substring(0, data[i].name.indexOf('分局'))
}
var bar = new DiandongcheBar()
bar.updateData(data)
}
```
存在的问题：
1、函数名未使用驼峰命名方式
2、在属性或方法的级联调用超过3层以上时，尽量采用换行的方式
3、此问题不止这一处
解决方案：
```javascript
dianDongCheTop5: function (data) {
for (var i = 0, length = data.length; i < length; i++) {
data[i].name = data[i]
.name
.substring(
0,
data[i]
.name
.indexOf('分局')
)
}
var bar = new DiandongcheBar()
bar.updateData(data)
}
```
#### 3、注释问题（未修改）
注释应该与代码的缩进保持同步
```javascript
/**
* 引用Mock数据
*/
require('data/infocenter/overview/index.js')
/**
* 引入业务模块
*/
var alarmcount = require('./server.js')
```
解决方案：
```javascript
/**
* 引用Mock数据
*/
require('data/infocenter/overview/index.js')
/**
* 引入业务模块
*/
var alarmcount = require('./server.js')
```
#### 4、数据未做异常处理（未修改）
在数据为none或undefined的时候容易引起报错
```javascript
request.sendAjax(apiURL.map, function(data) {
map.alarmcount(data.alarmcount)
mapChart.updateData(data.map)
})
```
解决方案：
使用try catch或者使用if检测数据的合法性
#### 5、函数名可读性优化（未修改）
‘jjqs’这种函数名不利于管理和维护
```javascript
jjqs:function(data) {
trendChart.drawCharts('#jiejingtrendChart',data,{})
}
```
解决方案：
建议使用可读性更强的名称
#### 6、变量优化（未修改）
未使用到的引用 或 只需引入库而不需要申明引用的变量不需要使用var保存
```javascript
var Map = require('../../../charts/map.js')
var rectBar = require('../../../charts/takepolice/rectBar.js')
```
解决方案：
```javascript
require('../../../charts/map.js')
var rectBar = require('../../../charts/takepolice/rectBar.js')
```
#### 7、css累赘（未修改）
重复声明了两次 vertical-align 属性
```css
.ove-ser-cartogram .value {
display: inline-block;
width: 160px;
vertical-align: text-bottom;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
vertical-align: middle;
}
```
解决方案：
去掉前面的一个属性，保留最后的一个同名属性
```css
.ove-ser-cartogram .value {
display: inline-block;
width: 160px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
vertical-align: middle;
}
```
#### 8、css缩进优化（未修改）
```css
.ove-ser-cartogram .name {
display: inline-block;
width: 320px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
vertical-align: middle;
}
```
解决方案：
请保持所有同级的样式使用相同的缩进
```css
.ove-ser-cartogram .name {
display: inline-block;
width: 320px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
vertical-align: middle;
}
```
#### 9、css书写顺序优化（未修改）
```css
.groupsales rect:first-of-type {
transform-origin: 50% 50%;
-webkit-transform-origin: 50% 50%;
/*transform: skewY(30deg) translateY(-20px);*/
transform: skewY(10deg) translateY(-20px);
-webkit-transform: skewY(10deg) translateY(-20px);
}
```
解决方案：
通常将不带前缀的css属性写在带前缀的属性之后，以保持浏览器的最佳兼容性
```css
.groupsales rect:first-of-type {
-webkit-transform: skewY(10deg) translateY(-20px);
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
transform: skewY(10deg) translateY(-20px);
}
```
#### 10、存在错误的css代码（未修改）
```css
.distributed-control-time li {
border-width: 1px solid;
border-style: solid;
border-color: rgb(24, 48, 80);
border-radius: 3px;
background: linear-gradient(-90deg, rgba(20, 54, 83, 0.43137) 0%, rgba(23, 43, 80, 0.54) 50%, rgba(5, 18, 38, 0.55) 52%, rgba(15, 45, 71, 0.65098) 100%);
width: 62px;
height: 62px;
display: inline-block;
line-height: 62px;
text-align: center;
font-size: 28px;
color: #2c6377;
cursor: pointer;
position: relative;
}
```
解决方案：
```css
.distributed-control-time li {
border-width: 1px solid;
}
```
这种写法浏览器无法解析，
建议border的三个基本属性都存在的情况下建议采用简写的方式：
```css
.distributed-control-time li {
border: 1px solid rgb(24, 48, 80);
}
```
另外注意background属性过长时为了保持可读性应该尽量换行
```css
.distributed-control-time li {
background: linear-gradient(
-90deg,
rgba(20, 54, 83, 0.43137) 0%,
rgba(23, 43, 80, 0.54) 50%,
rgba(5, 18, 38, 0.55) 52%,
rgba(15, 45, 71, 0.65098) 100%
);
}
```
#### 11、建议不要在项目中出现情绪化的表现词（未修改）
```css
/*20170928-fuck*/
.right-wrap .alarm{
left:2354px;
background: url(../../images/takepolice/alarm-bg-right.png) no-repeat;
background-size: 100% 100%;
}
```
解决方案：
虽然有时写代码会遇到情绪化（特别是在改需求的时候），但是建议不要在代码中出现类似语句。一是影响不好，二是以后忘了删，被其他人看见就不好了！！
- 1、执法项目
- 1.1 20170523-张红桥
- 1.2 20170523-李伟
- 2、运维项目
- 2.1 20170527-欧阳德才
- 2.2 20170613-尹帮会&欧阳德才
- 2.3 20170706-欧阳德才
- 2.4 20170706-尹帮会
- 3、指挥大屏项目
- 3.1 20170712-欧阳德才
- 4、PC端项目
- 4.1 20170516-张红桥
- 5、万达项目
- 5.1 20170619-李伟&舒曼
- 5.2 20170623-李伟&舒曼
- 5.3 20170803-李伟（未修改）
- 5.4 20170811-李伟（未修改）
- 6、可视化组件
- 6.1 20170718-张红桥
- 7、UI组件
- 7.1 20170522-舒曼
- 8、新员工练习项目
- 8.1 20170401-欧阳德才
- 8.2 20170401-舒曼
- 8.3 20170503-舒曼
- 8.4 20170609-刘黎
- 8.5 20170620-刘黎
- 8.6 20170703-谢洋
- 8.7 20170706-孙雨珩
- 8.8 20170706-谢洋
- 8.9 20170711-谢洋
- 8.10 20170724-谢洋
- 8.11 20170908-谭俊
- 8.12 20171026-廖爽
- 8.13 20171027-廖爽
- 8.14 20171027-廖爽
- 8.15 20171031-廖爽
- 8.16 20171103-覃英琪
- 8.17 20171103-01-廖爽
- 8.18 20171103-02-廖爽
- 8.19 20171110-赵家红
- 8.20 20171110-覃英琪
- 8.21 20171110-02-赵家红
- 8.22 20171115-01-廖爽
- 8.23 20171127-赵家红
- 8.24 20171122-李祁
- 8.25 20180528-吴泓江
- 9、资源监控大屏
- 9.1 20170705-舒曼
- 9.2 20170711-舒曼
- 9.3 20170724-舒曼
- 10、CQ指挥舱
- 10.1 20170906-张红桥&李伟&谢洋
- 11、昆明
- 11.1 20171009-李伟&舒曼
- 12、情报墙
- 12.1 20171025-谢洋
- 13、动态管控
- 14、迪爱斯区县
- 14.1 20171128-欧阳德才
- 15、贵州块数据指挥调度平台
- 16、北京东城区可视化项目
- 16.1 20180425-欧阳德才&谢洋
- 16.2 20180510-谢洋