我们经常调侃说:杀死一个程序员不用枪,改几次需求就行了。
没想到,国外真的发生了程序员枪击同事的事件。而原因,不是产品改需求,竟是同事写代码不规范:不写注释、不遵循驼峰命名、括号换行,最主要还天天 git push -f 提交代码。
枪击事件共导致 4 位同事不同程度受伤,其中两人伤情严重,一人情况危急。当事人在与警察的对峙中,被枪击中身亡。
第一阶段 给自己制定一个规则 让自己的代码看起来有规律
第二阶段 从设计上优化自己的代码(比如减少重复代码的出现?一些方法是作为类方法存在好还是对象方法存在好?把单个过长的方法拆解成几个小方法方便别人理解过程?)
第三阶段 从性能上优化自己的代码 并且开始通过注释来解释这些代码开发的时候给自己分裂成多个角色 写一个模块的时候以其他模块的角色思考你当前这样做是否合适 会写history 会写todo 现在也许只有你一个人看 但是为了别人的参与 这是值得的
$(document).ready(function() { var $box = $('.box'); var $arrowLeft = $('.arrow .left'); var $arrowRight = $('.arrow .right'); var $uLi = $('.box>ul>li'); var $ol = $('.box>ol');
var imgNum = $('.box>ul>li').length; // 图片的数量
var index = 0; // 计数器
// 小圆点
var num = 0; // 根据图片的数量动态生成小圆点
while(num < imgNum) {
$ol.append("<li></li>");
num++;
} var $oLi = $('.box>ol>li');
$oLi.first().addClass('now'); // 默认给第一个小圆点添加now类
// 鼠标经过小圆点时,显示出对应的图片
$oLi.mouseover(function() {
$(this).addClass('now').siblings().removeClass('now');
index = $(this).index();
$uLi.eq(index).fadeIn().siblings().fadeOut();
});
// 1、点击右箭头:让当前图片的下一张图片淡入,其他图片淡出。
$arrowRight.click(function() {
index++; if(index>imgNum-1) {
index = 0;
}
// 点击右箭头修改呈现的图片时,对应的小圆点也跟着修改now类
$uLi.eq(index).fadeIn().siblings().fadeOut();
$oLi.eq(index).addClass('now').siblings().removeClass('now');
});
// 2、单击左箭头:让当前图片的上一张图片淡入,其他图片淡出。
$arrowLeft.click(function() {
index--; if(index<0) {
index = imgNum-1;
}
// 点击右箭头修改呈现的图片时,对应的小圆点也跟着修改now类
$uLi.eq(index).fadeIn().siblings().fadeOut();
$oLi.eq(index).addClass('now').siblings().removeClass('now');
});
// 自动轮播
var timeId = setInterval(function() {
$arrowRight.click();
}, 2000); // 2秒自动切换
// 鼠标放在banner上,停止自动播放
$box.hover(function() {
clearInterval(timeId);
}, function(){
timeId = setInterval(function() {
$arrowRight.click();
}, 2000); // 2秒自动切换
});
});
再看另一段代码
* { margin: 0; padding: 0; list-style: none;
}.box { width: 700px; height: 314px; margin: 100px auto; position: relative;
}.box ul
li { position: absolute; width: 100%; height: 100%; top: 0; left: 0; display: none;
}.box ul li:first-child { display: block;
}.arrow>a { width: 30px; height: 60px; background-color: rgba(0,0,0,.4); position: absolute; top: 50%; transform: translateY(-50%); text-align: center; line-height: 60px; font-size: 20px; font-family: '宋体'; text-decoration: none; color: #fff;
}.arrow { opacity: .4;
}.arrow:hover { opacity: 1;
}.arrow>.left { left: 0;
}.arrow>.right { right: 0;
}ol { position: absolute; bottom: 10px; left: 12%; transform: translateX(-50%); border-radius: 20px; padding: 0 5px;
}ol li { width: 8px; height: 8px; border-radius: 50%; border: 2px solid rgba(0,0,0,.4); float: left; margin: 3px 5px; cursor: pointer;
}.now { border: 1px solid rgba(0,0,0,0); background: rgba(0,0,0,.7); box-shadow: 0 0 0 4px rgba(0,0,0,.3);
}
这一段代码就比较乱了,改的时候也比较麻烦,好的代码赏心悦目,不规范的头痛。
我谨在此呼吁大家:请注重编码规范问题,不要“开发一时爽,维护火葬场”,况且现在看来真的有可能出人命。