js 编写规范


Posted in Javascript onMarch 03, 2010

在一个项目中大量使用js,工程项目与网站开发有一些不一样,在我接触的工程项目中普遍使用js 不够多,大部分客户端可做事,交给了服务端,而且在使用js时不够规范,很容易造成代码难以阅读、内存泄漏问题,不注意js 输写方式。而在网站开发中(尤其一些大网站,js输出的非常漂亮、完美无论使用jquery,还是prototype 框架,还是不用框架,都有自己良好一套东东可用)
js输写最好还是可以面向对象方式 用类方向进行包装 js输写两种方式 闭包 原型
闭包:(借用的一个例子)

function Person(firstName, lastName, age) 
{ 
//私有变量: 
var _firstName = firstName; 
var _lastName = lastName; 
//公共变量: 
this.age = age; 
//方法: 
this.getName = function() 
{ 
return(firstName + " " + lastName); 
}; 
this.SayHello = function() 
{ 
alert("Hello, I'm " + firstName + " " + lastName); 
}; 
}; 
var BillGates = new Person("Bill", "Gates", 53);

原型:(借用的一个例子)
//定义构造函数 
function Person(name) 
{ 
this.name = name; //在构造函数中定义成员 
}; 
//方法定义到构造函数的prototype上 
Person.prototype.SayHello = function() 
{ 
alert("Hello, I'm " + this.name); 
}; 
//子类构造函数 
function Employee(name, salary) 
{ 
Person.call(this, name); //调用上层构造函数 
this.salary = salary; //扩展的成员 
}; 
//子类构造函数首先需要用上层构造函数来建立prototype对象,实现继承的概念 
Employee.prototype = new Person() //只需要其prototype的方法,此对象的成员没有任何意义! 
//子类方法也定义到构造函数之上 
Employee.prototype.ShowMeTheMoney = function() 
{ 
alert(this.name + " $" + this.salary); 
}; 
var BillGates = new Person("Bill Gates"); 
BillGates.SayHello(); 
var SteveJobs = new Employee("Steve Jobs", 1234); 
SteveJobs.SayHello();

这两种方法各有优缺点,第一种看起来更像一个类 每个对象设置一份方法有很大浪费,而且资源回收不利,第二种方法,看起来不是很漂亮,可性能很好(不过如果你使用prototype框架,就可以完美解决结构与性能问题了。)

实际在使用jquery 还是prototype问题上,我的一点点体会是 jquery使用闭包方式,而prototype当然原型,jquery更加适合对单个对象操作,而prototype更适合做一些客户端控件。实际我更喜欢在项目中使用jquery 而网站上更关注prototype

Javascript 相关文章推荐
用tip解决Ext列宽度不够的问题
Dec 13 Javascript
DIV外区域Click后关闭DIV的实现代码
Dec 21 Javascript
jquery实现弹出层完美居中效果
Mar 03 Javascript
文本域光标操作的jQuery扩展分享
Mar 10 Javascript
实现非常简单的js双向数据绑定
Nov 06 Javascript
微信小程序 教程之数据绑定
Oct 18 Javascript
详解vue2.0 不同屏幕适配及px与rem转换问题
Feb 23 Javascript
用Axios Element实现全局的请求loading的方法
Mar 15 Javascript
vue-image-crop基于Vue的移动端图片裁剪组件示例
Aug 28 Javascript
vue.js的vue-cli脚手架中使用百度地图API的实例
Jan 21 Javascript
详解jquery和vue对比
Apr 16 jQuery
React路由鉴权的实现方法
Sep 05 Javascript
jquery validation插件表单验证的一个例子
Mar 03 #Javascript
Jquery 实现Tab效果 思路是js思路
Mar 02 #Javascript
JavaScript页面刷新与弹出窗口问题的解决方法
Mar 02 #Javascript
在一个浏览器里呈现所有浏览器测试结果的前端测试工具的思路
Mar 02 #Javascript
jQuery对象和DOM对象的相互转化实现代码
Mar 02 #Javascript
Javascript 自定义类型方法小结
Mar 02 #Javascript
Javascript Cookie读写删除操作的函数
Mar 02 #Javascript
You might like
PHP中用mysqli面向对象打开连接关闭mysql数据库的方法
2016/11/05 PHP
php中preg_replace正则替换用法分析【一次替换多个值】
2017/01/17 PHP
php实现往pdf中加数字签名操作示例【附源码下载】
2018/08/07 PHP
javascript当onmousedown、onmouseup、onclick同时应用于同一个标签节点Element
2010/01/05 Javascript
Jquery Autocomplete 结合asp.net使用要点
2010/10/29 Javascript
js自动下载文件到本地的实现代码
2013/04/28 Javascript
javascript操作css属性
2013/12/30 Javascript
JavaScript保留两位小数的2个自定义函数
2014/05/05 Javascript
JavaScript数组合并的多种方法
2016/05/22 Javascript
封装获取dom元素的简单实例
2016/07/08 Javascript
Mac下使用charles遇到的问题以及解决办法
2017/01/10 Javascript
JavaScript门面模式详解
2017/10/19 Javascript
JavaScript去掉数组重复项的方法分析【测试可用】
2018/07/19 Javascript
Vue项目查看当前使用的elementUI版本的方法
2018/09/27 Javascript
webpack结合express实现自动刷新的方法
2019/05/07 Javascript
vue中使用element ui的弹窗与echarts之间的问题详解
2019/10/25 Javascript
node.js中stream流中可读流和可写流的实现与使用方法实例分析
2020/02/13 Javascript
JS如何实现在弹出窗口中加载页面
2020/12/03 Javascript
[03:20]2015国际邀请赛全明星表演赛
2015/08/08 DOTA
Python中正则表达式的详细教程
2015/04/30 Python
Python生成任意范围任意精度的随机数方法
2018/04/09 Python
详解有关PyCharm安装库失败的问题的解决方法
2020/02/02 Python
tensorflow指定CPU与GPU运算的方法实现
2020/04/21 Python
韩国江南富人区高端时尚百货商场:Galleria(格乐丽雅)
2018/03/27 全球购物
Linux面试经常问的文件系统操作命令
2015/11/05 面试题
成品仓管员岗位职责
2013/12/11 职场文书
大学毕业生通用自我评价
2014/01/05 职场文书
联谊活动策划书
2014/01/26 职场文书
销售冠军获奖感言
2014/02/03 职场文书
《临死前的严监生》教学反思
2014/02/13 职场文书
租房协议书怎么写
2014/04/10 职场文书
车队安全员岗位职责
2015/02/15 职场文书
主持人大赛开场白
2015/05/29 职场文书
《我的伯父鲁迅先生》教学反思
2016/02/16 职场文书
php访问对象中的成员的实例方法
2021/11/17 PHP
分析SQL窗口函数之排名窗口函数
2022/04/21 Oracle