JavaScript 命名约定

IT技术 javascript naming-conventions
2021-02-05 18:12:33

我知道关于哪种命名约定最适合 JavaScript 存在很多争议(也许不是争议,但至少是争论)。

你如何命名你的变量、函数、对象等?

我将对此留下我自己的想法,因为我很久没有使用 JS(只有几年),而且我刚刚收到一个请求,要创建一个包含命名约定的文档,以便在我们的工作项目中使用. 所以我一直在寻找(google-ing),并且有很多不同的意见。

我读过的关于 JS 的书本身也使用不同的命名约定,但它们都同意一点:“找到适合你的,并坚持下去。” 但是现在我已经阅读了这么多,我发现我比我现在习惯的更喜欢其他一些方法。

6个回答

我遵循Douglas Crockford 的JavaScript代码约定我还使用他的JSLint工具来验证是否遵循这些约定。

我认为他对链接做得很好。如果您如此担心,您应该编辑帖子。
2021-03-28 18:12:33
虽然这是一个很好的链接,但我无法相信“链接答案”有这么多票。您至少可以提取和格式化链接页面的相关部分。
2021-03-29 18:12:33
JSLint 对许多开发人员来说可能过于激进和限制,那么JSHint可能是更好的选择。
2021-04-03 18:12:33
我真的很尊敬 Crockford,但他的代码约定似乎非常过时。我建议在列表下方查看@PavelHodek 的答案
2021-04-04 18:12:33
Crockford 没有详细介绍,但是那些碰巧以大写字母开头的变量呢,因为它们指的是一个首字母缩略词——第一个字母还是整个首字母缩略词应该小写?例如:ECBhandleecbHandle(它不是不管什么ECB方式)。
2021-04-05 18:12:33

正如杰夫所说,克罗克福德所说的很好。

我遵循(并且已经广泛使用)的唯一例外是使用 $varname 来指示 jQuery(或任何库)对象。例如

var footer = document.getElementById('footer');

var $footer = $('#footer');

我强烈建议不要在变量名中使用特殊字符。许多框架特别使用 $ 。
2021-03-16 18:12:33
我也为此使用 $ 。我经常看到人们使用 $ 来表示对象的缓存副本。我一直认为这是文字游戏。缓存 > “现金” > $
2021-03-29 18:12:33
@nikxbb 如果您正确地确定变量的范围,那很好 - 体面的框架也是如此。
2021-04-05 18:12:33
如果您使用的是 AngularJS,这可能不是最好的主意 - 核心服务以“$”为前缀
2021-04-11 18:12:33

你可以按照这个谷歌 JavaScript 风格指南

通常,使用 functionNamesLikeThis、variableNamesLikeThis、ClassNamesLikeThis、EnumNamesLikeThis、methodNamesLikeThis 和 SYMBOLIC_CONSTANTS_LIKE_THIS。

编辑:请参阅JavaScript Style Guides And Beautifiers 的不错集合

感谢您链接到样式指南列表。我不知道一个是否值得专门关注,或者如何决定哪一个或我是否应该使用合并。但是知道在哪里可以在一个地方找到几个是一个真正的福音。
2021-03-18 18:12:33
@FreeAsInBeer 关于额外字符是正确的,但我认为它不会更快。_在引用私有变量时打字会导致智能感知立即限制结果;最后认为这是个人喜好。
2021-03-20 18:12:33
我总是发现 Google 的私有命名约定很奇怪,而不是_fooBar他们这样做fooBar_- 微软对了:asp.net/ajaxlibrary/act_contribute_codingStandards.ashx
2021-03-24 18:12:33
我不确定我是否完全同意这一点,考虑到他们开发了 Dart 和 GWT(chrome 扩展 javascript api 也很像 java)。对于 Google 的某些团队来说,开发 javascript 的最佳方式可能是用其他语言编写。
2021-03-29 18:12:33
@DanielSokolowski 使用智能感知时怎么样?如果您用下划线作为大量变量的前缀,那么这只是您每次访问这些变量时都必须键入的另一个字符。有了它,你的智能感知列表看起来更干净,而且找到你需要的东西也快了一点。
2021-03-29 18:12:33

我想尝试的一种约定是使用“the”前缀命名静态module。看一下这个。当我使用别人的module时,很难看出我应该如何使用它。例如:

define(['Lightbox'],function(Lightbox) {
  var myLightbox = new Lightbox() // not sure whether this is a constructor (non-static) or not
  myLightbox.show('hello')
})

我正在考虑尝试一种约定,其中静态module使用“the”来表示它们的预先存在。有没有人看到比这更好的方法?看起来像这样:

define(['theLightbox'],function(theLightbox) {
  theLightbox.show('hello') // since I recognize the 'the' convention, I know it's static
})

我认为除了一些语法限制;命名约定的推理在很大程度上与语言无关。我的意思是,支持 c_style_functions 和 JavaLikeCamelCase 的论点同样可以以相反的方式使用,只是语言用户倾向于跟随语言作者。

话虽如此,我认为大多数库都倾向于大致遵循 Java 的 CamelCase 的简化。我发现道格拉斯·克罗克福德 (Douglas Crockford) 的建议对我来说足够有品味。