目录
参数
首页 web前端 js教程 Dojo Javascript 编程规范 规范自己的JavaScript书写_基础知识

Dojo Javascript 编程规范 规范自己的JavaScript书写_基础知识

May 16, 2016 pm 04:32 PM
javascript 编程规范

前言

良好的JavaScript书写习惯的优点不言而喻,今天彬Go向大家推荐Dojo Javascript 编程规范,相当不错的 Javascript 编程风格规范,建议大家可以借鉴一下此规范编写 Javascript。感谢i.feelinglucky的翻译。

Any violation to this guide is allowed if it enhances readability.

所有的代码都要变成可供他人容易阅读的。

快读参考

核心 API 请使用下面的风格:

结构 规则 注释
模块 小写 不要使用多重语义(Never multiple words)
骆驼
公有方法 混合 其他的外部调用也可以使用 lower_case(),这样的风格
公有变量 混合
常量 骆驼 或 大写

下面的虽然不是必要的,但建议使用:

结构 规则
私有方法 混合,例子:_mixedCase
私有变量 混合,例子:_mixedCase
方法(method)参数 混合,例子:_mixedCase, mixedCase
本地(local)变量 混合,例子:_mixedCase, mixedCase


命名规范

1.变量名称 必须为 小写字母。
2.类的命名使用骆驼命名规则,例如:

Account, EventHandler

3.常量 必须 在对象(类)或者枚举变量的前部声明。枚举变量的命名必须要有实际的意义,并且其成员 必须 使用骆驼命名规则或使用大写:

复制代码 代码如下:

var NodeTypes = {
Element : 1,
DOCUMENT: 2
}

4.简写单词 不能使用 大写名称作为变量名:

getInnerHtml(), getXml(), XmlDocument
5.方法的命令 必须 为动词或者是动词短语:

obj.getSomeValue()
6.公有类的命名 必须 使用混合名称(mixedCase)命名。
7.CSS 变量的命名 必须 使用其对应的相同的公共类变量。
8.私有类的变量属性成员 必须 使用混合名称(mixedCase)命名,并前面下下划线(_)。例如:

复制代码 代码如下:

var MyClass = function(){
var _buffer;
this.doSomething = function(){
};
}

9.变量如果设置为私有,则前面 必须 添加下划线。

this._somePrivateVariable = statement;

10.通用的变量 必须 使用与其名字一致的类型名称:

setTopic(topic) // 变量 topic 为 Topic 类型的变量
11.所有的变量名 必须 使用英文名称。
12.变量如有较广的作用域(large scope),必须使用全局变量;此时可以设计成一个类的成员。相对的如作用域较小或为私有变量则使用简洁的单词命名。
13.如果变量有其隐含的返回值,则避免使用其相似的方法:

getHandler(); // 避免使用 getEventHandler()

14.公有变量必须清楚的表达其自身的属性,避免字义含糊不清,例如:

MouseEventHandler
,而非 MseEvtHdlr。
  请再次注意这条规定,这样做得的好处是非常明显的。它能明确的表达表达式所定义的含义。例如:   

dojo.events.mouse.Handler // 而非 dojo.events.mouse.MouseEventHandler

15.类/构造函数 可以使用 扩展其基类的名称命名,这样可以正确、迅速的找到其基类的名称:
 EventHandler
 UIEventHandler
 MouseEventHandler
  基类可以在明确描述其属性的前提下,缩减其命名:
   MouseEventHandler as opposed to MouseUIEventHandler.

特殊命名规范

术语 “get/set” 不要和一个字段相连,除非它被定义为私有变量。
前面加 “is” 的变量名 应该 为布尔值,同理可以为 “has”, “can” 或者 “should”。
术语 “compute” 作为变量名应为已经计算完成的变量。
术语 “find” 作为变量名应为已经查找完成的变量。
术语 “initialize” 或者 “init” 作为变量名应为已经实例化(初始化)完成的类或者其他类型的变量。
UI (用户界面)控制变量应在名称后加控制类型,例如: leftComboBox, TopScrollPane。
复数必须有其公共的名称约定(原文:Plural form MUST be used to name collections)。
带有 “num” 或者 “count” 开头的变量名约定为数字(对象)。
重复变量建议使用 “i”, “j”, “k” (依次类推)等名称的变量。
补充用语必须使用补充词,例如: get/set, add/remove, create/destroy, start/stop, insert/delete, begin/end, etc.
能缩写的名称尽量使用缩写。
避免产生歧义的布尔变量名称,例如:
  isNotError, isNotFound 为非法
错误类建议在变量名称后加上 “Exception” 或者 “Error”。
方法如果返回一个类,则应该在名称上说明返回什么;如果是一个过程,则应该说明做了什么。

文件

缩进请使用 4 个空白符的制表位。
如果您的编辑器支持 文件标签_(file tags),请加添如下的一行使我们的代码更容易阅读:

// vim:ts=4:noet:tw=0:
译注:老外用 VIM 编辑器比较多,此条可以选择遵循。

代码折叠必须看起来是完成并且是合乎逻辑的:

复制代码 代码如下:

var someExpression = Expression1
+ Expression2
+ Expression3;

var o = someObject.get(
Expression1,
Expression2,
Expression3
);

注:表达式的缩进与变量声明应为一致的。
注:函数的参数应采用明确的缩进,缩进规则与其他块保持一致。

变量

  1. 变量必须在声明初始化以后才能使用,即便是 NULL 类型。
  2. 变量不能产生歧义。
  3. 相关的变量集应该放在同一代码块中,非相关的变量集不应该放在同一代码块中。
  4. 变量应该尽量保持最小的生存周期。
  5. 循环/重复变量的规范:
    1. 只有循环控制块的话,则必须使用 FOR 循环。
    2. 循环变量应该在循环开始前就被初始化;如使用 FOR 循环,则使用 FOR 语句初始化循环变量。
    3. “do … while” 语句是被允许的。
    4. “break” 和 “continue” 语句仍然允许使用(但请注意)。
  6. 条件表达式
    1. 应该尽量避免复杂的条件表达式,如有必要可以使用临时布尔变量。
    2. The nominal case SHOULD be put in the “if” part and the exception in the “else” part of an “if” statement.
    3. 应避免在条件表达式中加入块。
  7. 杂项
    1. 尽量避免幻数(Magic numbers),他们应该使用常量来代替。
    2. 浮点变量必须指明小数点后一位(即使是 0)。
    3. 浮点变量必须指明实部,即使它们为零(使用 0. 开头)。

布局

普通代码段 应该 看起来如下:

复制代码 代码如下:

while (!isDone){
doSomething();
isDone = moreToDo();
}

IF 语句 应该 看起来像这样:

复制代码 代码如下:

if (someCondition){
statements;
} else if (someOtherCondition){
statements;
} else {
statements;
}

FOR 语句 应该 看起来像这样:

复制代码 代码如下:

for (initialization; condition; update){
statements;
}

WHILE 语句 应该 看起来像这样:

复制代码 代码如下:

while (!isDone) {
doSomething();
isDone = moreToDo();
}

DO … WHILE 语句 应该 看起来像这样:

复制代码 代码如下:

do {
statements;
} while (condition);

SWITCH 语句 应该 看起来像这样:

复制代码 代码如下:

switch (condition) {
case ABC:
statements;
// fallthrough
case DEF:
statements;
break;
default:
statements;
break;
}

TRY … CATCH 语句 应该 看起来像这样:

复制代码 代码如下:

try {
statements;
} catch(ex) {
statements;
} finally {
statements;
}

单行的 IF – ELSE,WHILE 或者 FOR 语句也 必须 加入括号,不过他们可以这样写:
if (condition){ statement; }
while (condition){ statement; }
for (intialization; condition; update){ statement; }

空白

  1. 操作符 建议 使用空格隔开(包括三元操作符)。
  2. 下面的关键字 避免使用 空白隔开:
    • break
    • catch
    • continue
    • do
    • else
    • finally
    • for
    • function (如果为匿名函数,例如:var foo = function(){}; )
    • if
    • return
    • switch
    • this
    • try
    • void
    • while
    • with
  3. 下面的关键字必须使用空白隔开:
    • case
    • default
    • delete
    • function (如果为申明,例如:function foo(){}; )
    • in
    • instanceof
    • new
    • throw
    • typeof
    • var
  4. 逗号(,) 建议 使用空白隔开。
  5. 冒号(:) 建议 使用空白隔开。
  6. 点(.) 在后部 建议 使用空白隔开。
  7. 点(.) 避免 在前部使用空白。
  8. 函数调用和方法 避免 使用空白,例如: doSomething(someParameter); // 而非 doSomething (someParameter)
  9. 逻辑块 之间使用空行。
  10. 声明 建议 对齐使其更容易阅读。

注释

  1. 生涩的代码就 没有必要 添加注释了,首先您需要 重写 它们。
  2. 所有的注释请使用英文。
  3. 从已解决的方案到未开发的功能,注释 必须 与代码相关。
  4. 大量的变量申明后 必须 跟随一段注释。
  5. 注释需要说明的是代码段的用处,尤其是接下来的代码段。
  6. 注释 没有必要 每行都添加。

文档

下面提供了一些基本的函数或者对象的描述方法:

总结(summary): 简短的表述此函数或者对象实现的目的
描述(description): 对于此函数或者类的简短的描述
返回(return): 描述此函数返回什么(并不包括返回类型)
基本函数信息

复制代码 代码如下:

function(){
// summary: Soon we will have enough treasure to rule all of New Jersey.
// description: Or we could just get a new roomate.
// Look, you go find him. He don't yell at you.
// All I ever try to do is make him smile and sing around
// him and dance around him and he just lays into me.
// He told me to get in the freezer 'cause there was a carnival in there.
// returns: Look, a Bananarama tape!
}

对象函数信息

没有返回值描述

复制代码 代码如下:

{
// summary: Dingle, engage the rainbow machine!
// description:
// Tell you what, I wish I was--oh my g--that beam,
// coming up like that, the speed, you might wanna adjust that.
// It really did a number on my back, there. I mean, and I don't
// wanna say whiplash, just yet, cause that's a little too far,
// but, you're insured, right?
}

函数的声明

在有的情况下,对于函数的调用和声明是隐义(invisible)的。在这种情况下,我们没有办法在函数中加入说明等(供程序调用)。如果您遭遇了这种情况,您可以使用一个类来封装函数。

注:此此方法只能在函数没有初始化的参数情况下。如过不是,则它们会被忽略。

复制代码 代码如下:

dojo.declare(
"foo",
null,
{
// summary: Phew, this sure is relaxing, Frylock.
// description:
// Thousands of years ago, before the dawn of
// man as we knew him, there was Sir Santa of Claus: an
// ape-like creature making crude and pointless toys out
// of dino-bones, hurling them at chimp-like creatures with
// crinkled hands regardless of how they behaved the
// previous year.
// returns: Unless Carl pays tribute to the Elfin Elders in space.
}
);

参数



  1. 简单类型
       简单的类型的参数可以直接在函数参数定义中注释说明。
    [cc lang="javascript"]function(/*String*/ foo, /*int*/ bar)...
    可变类型参数
      下面是几个修饰符供参考:
    ? 可选参数
    … 说面参数范围不确定
    数组
    function(/*String?*/ foo, /*int...*/ bar, /*String[]*/ baz)...
    全局参数描述
     如果你想增加一个描述,你可以将它们移至初始化块。
    基本信息格式为: *关键字* 描述字段 ( *key* Descriptive sentence)
    参数和变量的格式为: *关键字* ~*类型*~ 描述字段 ( *key* ~*type*~ Descriptive sentence)
    注: *关键字* 和 ~*类型*~ 可以使用任何字母和数字表述。

    复制代码 代码如下:

    function (foo, bar) {
    // foo: String
    // used for being the first parameter
    // bar: int
    // used for being the second parameter
    }

    变量

    由于实例变量、原型变量和外部变量的声明是一致的,所以有很多的方法声明、修改变量。具体的如何定义和定位应在变量最先出现的位置指明变量的名称、类型、作用域等信息。

    复制代码 代码如下:

    function foo() {
    // myString: String
    // times: int
    // How many times to print myString
    // separator: String
    // What to print out in between myString*
    this.myString = "placeholder text";
    this.times = 5;
    }
    foo.prototype.setString = function (myString) {
    this.myString = myString;
    }
    foo.prototype.toString = function() {
    for(int i = 0; i dojo.debug(this.myString);
    dojo.debug(foo.separator);
    }
    }
    foo.separator = "=====";

    对象中的变量注释

    应使用和对象值和方法一致的标注方式,比如在他们声明的时候:

    复制代码 代码如下:

    {
    // key: String
    // A simple value
    key: "value",
    // key2: String
    // Another simple value
    }

    返回值

    因为函数可以同时返回多个不同(类型)的值,所以应每个返回值之后加入返回类型的注释。注释在行内注释即可,如果所有的返回值为同一类型,则指明返回的类型;如为多个不同的返回值,则标注返回类型为”mixed”。

    复制代码 代码如下:

    function() {
    if (arguments.length) {
    return "You passed argument(s)"; // String
    } else {
    return false; // Boolean
    }
    }

    伪代码(有待讨论)

    有时候您需要在函数或者类中添加对于此函数和类的功能性流程描述。如果您打算这样做,您可以使用 /*======== (= 字符最好出现 5 次或者更多),这样做的好处就是可以不用将这些东西加入代码(译注:原作者的意思可能为代码管理系统)。

    这样看起来在 /*===== 和 =====*/ 会有非常长的一段注释,等待功能调整完毕以后就可以考虑是否删除。

    复制代码 代码如下:

    /*=====
    module.pseudo.kwArgs = {
    // url: String
    // The location of the file
    url: "",
    // mimeType: String
    // text/html, text/xml, etc
    mimeType: ""
    }
    =====*/

    function(/*module.pseudo.kwArgs*/ kwArgs){
    dojo.debug(kwArgs.url);
    dojo.debug(kwArgs.mimeType);
    }

    原文链接: http://dojotoolkit.org/developer/StyleGuide
    翻译(Translated by):i.feelinglucky{at}gmail.com from http://www.gracecode.com

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
1 个月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
1 个月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
1 个月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.聊天命令以及如何使用它们
1 个月前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

如何使用WebSocket和JavaScript实现在线语音识别系统 如何使用WebSocket和JavaScript实现在线语音识别系统 Dec 17, 2023 pm 02:54 PM

如何使用WebSocket和JavaScript实现在线语音识别系统引言:随着科技的不断发展,语音识别技术已经成为了人工智能领域的重要组成部分。而基于WebSocket和JavaScript实现的在线语音识别系统,具备了低延迟、实时性和跨平台的特点,成为了一种被广泛应用的解决方案。本文将介绍如何使用WebSocket和JavaScript来实现在线语音识别系

WebSocket与JavaScript:实现实时监控系统的关键技术 WebSocket与JavaScript:实现实时监控系统的关键技术 Dec 17, 2023 pm 05:30 PM

WebSocket与JavaScript:实现实时监控系统的关键技术引言:随着互联网技术的快速发展,实时监控系统在各个领域中得到了广泛的应用。而实现实时监控的关键技术之一就是WebSocket与JavaScript的结合使用。本文将介绍WebSocket与JavaScript在实时监控系统中的应用,并给出代码示例,详细解释其实现原理。一、WebSocket技

如何利用JavaScript和WebSocket实现实时在线点餐系统 如何利用JavaScript和WebSocket实现实时在线点餐系统 Dec 17, 2023 pm 12:09 PM

如何利用JavaScript和WebSocket实现实时在线点餐系统介绍:随着互联网的普及和技术的进步,越来越多的餐厅开始提供在线点餐服务。为了实现实时在线点餐系统,我们可以利用JavaScript和WebSocket技术。WebSocket是一种基于TCP协议的全双工通信协议,可以实现客户端与服务器的实时双向通信。在实时在线点餐系统中,当用户选择菜品并下单

如何使用WebSocket和JavaScript实现在线预约系统 如何使用WebSocket和JavaScript实现在线预约系统 Dec 17, 2023 am 09:39 AM

如何使用WebSocket和JavaScript实现在线预约系统在当今数字化的时代,越来越多的业务和服务都需要提供在线预约功能。而实现一个高效、实时的在线预约系统是至关重要的。本文将介绍如何使用WebSocket和JavaScript来实现一个在线预约系统,并提供具体的代码示例。一、什么是WebSocketWebSocket是一种在单个TCP连接上进行全双工

JavaScript和WebSocket:打造高效的实时天气预报系统 JavaScript和WebSocket:打造高效的实时天气预报系统 Dec 17, 2023 pm 05:13 PM

JavaScript和WebSocket:打造高效的实时天气预报系统引言:如今,天气预报的准确性对于日常生活以及决策制定具有重要意义。随着技术的发展,我们可以通过实时获取天气数据来提供更准确可靠的天气预报。在本文中,我们将学习如何使用JavaScript和WebSocket技术,来构建一个高效的实时天气预报系统。本文将通过具体的代码示例来展示实现的过程。We

简易JavaScript教程:获取HTTP状态码的方法 简易JavaScript教程:获取HTTP状态码的方法 Jan 05, 2024 pm 06:08 PM

JavaScript教程:如何获取HTTP状态码,需要具体代码示例前言:在Web开发中,经常会涉及到与服务器进行数据交互的场景。在与服务器进行通信时,我们经常需要获取返回的HTTP状态码来判断操作是否成功,根据不同的状态码来进行相应的处理。本篇文章将教你如何使用JavaScript获取HTTP状态码,并提供一些实用的代码示例。使用XMLHttpRequest

javascript中如何使用insertBefore javascript中如何使用insertBefore Nov 24, 2023 am 11:56 AM

用法:在JavaScript中,insertBefore()方法用于在DOM树中插入一个新的节点。这个方法需要两个参数:要插入的新节点和参考节点(即新节点将要被插入的位置的节点)。

JavaScript和WebSocket:打造高效的实时图像处理系统 JavaScript和WebSocket:打造高效的实时图像处理系统 Dec 17, 2023 am 08:41 AM

JavaScript是一种广泛应用于Web开发的编程语言,而WebSocket则是一种用于实时通信的网络协议。结合二者的强大功能,我们可以打造一个高效的实时图像处理系统。本文将介绍如何利用JavaScript和WebSocket来实现这个系统,并提供具体的代码示例。首先,我们需要明确实时图像处理系统的需求和目标。假设我们有一个摄像头设备,可以采集实时的图像数

See all articles