jquery插件开发规范

在明河真正讲解jquery插件开发进阶教程前,明河觉得很有必要先来说明下jquery插件开发规范,这些规范是明河学习jquery时不断积累下来的,不一定完全正确,甚至于你在开始编写第一个jquery插件时,觉得这些规范毫无意义。如果你有一天编写jquery时突然发现这些规范很有用处,恭喜你,你的水平上升了一个层次!

一、请给你的代码加上注释

明河以前很不喜欢加注释,嫌太麻烦了,这是个非常糟糕的习惯,幸运的是现在明河已经改正了这个不良习惯。

这个世界不存在百分百的完美的jquery插件,注释不止是给别人看、更重要的是给自己看。

你应该把注释当做你代码的一部分,养成随手加注释的习惯,尤其是编写javascript的时候。

1、在全部代码前加上文件说明注释

以下是明河给自己写的yitip插件加的注释:

  1. /**
  2. * $.yitip
  3. * @extends jquery.1.4.2
  4. * @fileOverview 创建文字提示框
  5. * @author 明河共影
  6. * @email mohaiguyan12@126.com
  7. * @site wwww.36ria.com
  8. * @version 0.1
  9. * @date 2010-07-17
  10. * Copyright (c) 2010-2010 明河共影
  11. * @example
  12. *    $("a").yitip();
  13. */
  14. (function($){
  15. .......
  16. })(jQuery);

这是jsdoc的写法,什么是jsdoc?请点此。jsdoc简单点来说是一种javascript文档工具,使用方法可以点此。现在对jsdoc不理解没关系,你只要创建明河上述类似的说明文档即可。jsdoc的命令请点此查看。

2、函数务必加注释

比如以下代码是yijs.Yitip一个方法setContent:

  1. yijs.Yitip.prototype = {
  2.         /**
  3.          *向提示框添加内容
  4.          * @param {Object | String} content 内容
  5.          */
  6.         setContent : function(content){
  7.                         ...........               
  8.         }    
  9. }

依旧遵循jsdoc规范,而不是匆匆加上“//”了事,关于jsdoc,有机会明河会详细讲解。

3、参数务必加注释

比如:

  1. //默认参数
  2.     $.fn.yitip.defaults = {
  3.         /**目标容器*/
  4.         applyTo : null,
  5.         /**内容*/
  6.         content : "",
  7.         /**提示框位置*/
  8.         position : "topMiddle",
  9.         /**提示框位置偏移*/
  10.         offest : {"left":0,"top":0},
  11.         /**提示框颜色*/
  12.         color : "yellow"
  13.          }
4、函数体内关键代码前加注释

二、javascript变量规范

在javascript世界中,没有真正意义的共有变量、私有变量、常量等概念,当你的javascript代码达到一定数量级时,过段时间你回头看自己的代码,都会把自己搞晕。

1、请在私有变量前加“_”

比如:

  1. var _pos = this.pos;
2、常量请大写

比如:

  1. this.DATA_COLOR = "color";
3、jquery对象变量前加“$”

比如:

  1. this.$applyTo  = $(".yitip");
4、object、array变量前加“o”、“a”

很多人喜欢给数组变量加个”s”,这也是可以的,按个人习惯,如果你觉得有必要还可以给函数前加个“fn”。

三、jquery插件开发的一些建议

1、请多使用data()方法

jquery中data()方法非常有用,尤其在jquery插件开发中,因为data()所创建的缓存,可以完整的保存各种数据类型的数据,这是其他缓存机制无法比拟的。

2、请使用bind来绑定事件

很多朋友喜欢以下的代码:

  1. $(".yitip").click(function(){
  2.         ........
  3.     })

但在jquery插件开发中明河更提倡使用bind:

  1. $(".yitip").bind('click',function(){
  2.               .........
  3.      })

以后的教程中明河会予以解释。

3、善用typeof

typeof用于判断数据类型,这个方法在参数判断中非常有用处

4、插件名加个独有前缀

jquery插件成千上万,插件撞车时很容易的事,比如提示框插件:

  1. $.fn.tip = function(options){
  2. }

但tip的冲突率无疑很高,所以明河加个“yi”前缀,如果你有在网上看到以yi做前缀的插件,那估计就是明河写的,呵呵。

四、其他规范

1、设置版本号

有很多插件作者将版本号作为插件的一个属性,也是一个比较好的做法,比如:

  1. $.fn.yitip.version = 0.1

你可以不设置为属性,但在你的文件头务必加上版本注释,比如:

  1. /**
  2. * $.yitip
  3. * @version 0.1
  4. */

明河喜欢以0.1起始,然后把正式版的插件设置为1.0

2、将插件代码托管到网上

可以去sourceforge注册个账号,新建个开源项目,将代码托管上去,如果你不喜欢sourceforge,可以使用google的代码托管,可以看明河曾发表过的使用Google Code托管代码教程。有机会发篇教程讲述如何在sourceforge上托管代码

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值