前端开发应该注意的问题

来源:互联网 发布:淘宝退货和退款的区别 编辑:程序博客网 时间:2024/06/07 16:18

这个文章主要不是用来讨论技术点,而是讨论下作为一个software engineer所碰到的一些事情

由于现在是下午时间,不想写代码,就唠唠程序员家常。这片博文我会陆续更新!因为一时可能想的不是非常周全


考虑到博客主要关于JS的,所以在这里主要讨论JS开发细节。注意细节的人肯定工作效率和输出都很高。


1.命名

在命名的时候一定要取一个漂亮的通俗易懂的英文名,不要取中国式的字母名称,也不要取名非常非常长的,名称太长也不好。

不管是url名称,变量名称,还是方法名称。切记!


2:变量命名规范

变量命名要规范: 私有变量需要在前面添加 "_"来表示是私有变量,对外不开放。

var person = function(){

this._name = "spring/";

       this._age      = 25;

       this._init();

      this.view_ = createView();  //下划线后缀我一般用于销毁对象时用的,因为我们项目用的是dojo,dojo组件是要在内存中注册的。一般js垃圾回收都是发生在函数执行完毕之后和浏览器刷新或关闭等等之后,对象和变量都被自动销毁,所以一般不关注内存。就和java一样,自动回收垃圾。但是如果做很重的web页面,销毁对象就很重要了,这时候就需要我们手动销毁和释放内容。js通常销毁对象就是直接等于null;或者delete删除掉。

};


3.统一命名事件方法格式


$("saveButton").click(saveHandler);

var saveHandler = function(){

alert("save");

}


$("cancelButton").click(cancelHandler);

事件方法命名统一使用xxHandler;让人们一眼看出这是个事件方法。


4.方法内容不能过长,要保证方法的职责单一原则

var saveHandler = function(){

var data = getData();//获得数据

       save(data);  //处理保存

}

其实要分开一下保证方法职责单一:

var getData = function(){

getData();//获得数据

}

var saveHandler = function(data){

       save(data); //处理保存

}

职责单一方法的代码可读性强,便于理解与消化。


5.URL命名与设计

URL的设计也是很重要的,让URL充满语义化。符合RESTful

比如一些基本常用的URL设计:

user/addVO      //增加

user/delete  //删除

user/findVO //获得一个实体对象

user/update //修改更新

user/list//获得一个List<user>集合

user/detail    //跳转到user详情页面

user/query   //跳转到查询页面


相对应的HTML页面命名也要配合起来

user.html

user-detail.html  //详情页面

user-query.html  //查询页面


6.CSS命名规范

css命名要能展现出层级关系,继承关系。

class="nav"       calss="nav-menu"         class="nav-menu-item"

这样的命名方式也有很强的可读性。


7.关于var变量。

由于js不使用var 关键字声明变量也是可以的,但是 直接 name="spring";这样命名name是一个全局对象,所以请必须加上var关键字。

那么为何全局对象就影响性能呢?

第一:因为js是单线程的,一个线程只有一个栈,如果全局变量迟迟不被销毁,那么就一直占用内存,没有释放。

第二:js变量查找是由下往上的遍历当前整个作用域,寻找最近的变量值,直到找到位置。如果到了全局对象还没找到,则会抛出 ReferenceError 或undefined异常。

用代码表示:

var name = "spring";

function test(){

      var name = "test";

      alert(name); //output: test 在这里找到最近的第一个name=test之后,就不再继续往上找。

}


同时声明多个变量的时候:var a;var b;var c;

使用var a,b,c;

因为一个一个声明是需要分配多次内存的。而使用var a,b,c;只需要分配一次。


8.注释

我们的code一定要有良好的代码注释,要做到代码即文档。

详细设计这样的东西,其实不适合项目开发。因为详细设计是事前写的,是计划,是猜想,不能保证完全正确,其实很多时候,详细设计是开发之后再补上的,鄙人认为效率低下。有的人说详细设计是用来规范书写的,那又何必多此一举呢,作为一个优秀负责人的程序员,我们需要不断的review和refactor。

JS中良好的注释至少应该包括:@描述,甚至包括example说明,@param 说明和类型,@return 说明

当然不是所有的代码都需要注释,不过你写了总比没写好吧?一旦我们养成良好的习惯之后,这些问题都不是问题。

但是要从现在开始,时刻警惕自己,写高质量代码。








0 0