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 相关文章推荐
js 实现无干扰阴影效果 简单好用(附文件下载)
Dec 27 Javascript
javascript中数组中求最大值示例代码
Dec 18 Javascript
jQuery原型属性和原型方法详解
Jul 07 Javascript
浅析JS获取url中的参数实例代码
Jun 14 Javascript
js 中文汉字转Unicode、Unicode转中文汉字、ASCII转换Unicode、Unicode转换ASCII、中文转换
Dec 06 Javascript
自动适应iframe右边的高度
Dec 22 Javascript
assert()函数用法总结(推荐)
Jan 25 Javascript
Javascript仿京东放大镜的效果
Mar 01 Javascript
r.js来合并压缩css文件的示例
Apr 26 Javascript
微信小程序使用wx.request请求服务器json数据并渲染到页面操作示例
Mar 30 Javascript
layui 对弹窗 form表单赋值的实现方法
Sep 04 Javascript
vue实现移动端H5数字键盘组件使用详解
Aug 25 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下一个阿拉伯数字转中文数字的函数
2007/07/16 PHP
PHP导出MySQL数据到Excel文件(fputcsv)
2011/07/03 PHP
PHP内核介绍及扩展开发指南―基础知识
2011/09/11 PHP
php通过数组实现多条件查询实现方法(字符串分割)
2014/05/06 PHP
PHP实现的redis主从数据库状态检测功能示例
2017/07/20 PHP
地址栏上的一段语句,改变页面的风格。(教程)
2008/04/02 Javascript
jQuery Div中加载其他页面的实现代码
2009/02/27 Javascript
prototype 中文参数乱码解决方案
2009/11/09 Javascript
jQuery对象和DOM对象的相互转化实现代码
2010/03/02 Javascript
javascript笔记 String类replace函数的一些事
2011/09/22 Javascript
纯css+js写的一个简单的tab标签页带样式
2014/01/28 Javascript
js判断文本框剩余可输入字数的方法
2015/02/04 Javascript
深入理解JavaScript编程中的同步与异步机制
2015/06/24 Javascript
javascript弹出拖动窗口
2015/08/11 Javascript
JavaScript多图片上传案例
2015/09/28 Javascript
高效的jquery数字滚动特效
2015/12/17 Javascript
js获取html的span标签的值方法(超简单)
2016/07/26 Javascript
模拟javascript中的sort排序(简单实例)
2016/08/17 Javascript
js动态生成form 并用ajax方式提交的实现方法
2016/09/09 Javascript
推荐三款日期选择插件(My97DatePicker、jquery.datepicker、Mobiscroll)
2017/04/21 jQuery
vue router demo详解
2017/10/13 Javascript
解析Vue 2.5的Diff算法
2017/11/28 Javascript
Vue实现active点击切换方法
2018/03/16 Javascript
Vue入门之数量加减运算操作示例
2018/12/11 Javascript
webpack项目使用eslint建立代码规范实现
2019/05/16 Javascript
Vue项目打包部署到iis服务器的配置方法
2019/10/14 Javascript
python实现通过代理服务器访问远程url的方法
2015/04/29 Python
python使用wmi模块获取windows下的系统信息 监控系统
2015/10/27 Python
python os.listdir按文件存取时间顺序列出目录的实例
2018/10/21 Python
python从list列表中选出一个数和其对应的坐标方法
2019/07/20 Python
学会python自动收发邮件 代替你问候女友
2020/05/20 Python
html5/css3响应式页面开发总结
2018/10/16 HTML / CSS
DOUGLAS波兰:在线销售香水和化妆品
2020/07/05 全球购物
华为python面试题
2016/05/03 面试题
个人的事迹材料怎么写
2019/04/24 职场文书
教你用python实现12306余票查询
2021/06/30 Python