javascript 编码_JavaScript编码样式

javascript 编码

Every language has a set of rules when it comes to syntax.

每种语言在语法方面都有一套规则。

When starting out, some people might add code into a file following without breaking the language rules, but without giving care and attention to the programming style.

刚开始时，有些人可能会在不违反语言规则的情况下将代码添加到文件中，但是却没有注意和关注编程风格 。

Not because they don’t care about style,they are not experienced enough to recognize its importance.

不是因为他们不在乎样式，他们没有足够的经验来认识样式的重要性。

I really believe programming is a craft. Like painting, or wood crafting, or anything that involves creativity, our programs can do many things but they should do it in style.

我真的相信编程是一种技巧。 就像绘画，木工或涉及创造力的任何事物一样，我们的程序可以做很多事情，但是他们应该以风格来做。

We have some rules that are valid across all programming languages.

我们有一些适用于所有编程语言的规则。

A coding style is an agreement with yourself and your team, to keep consistency on a project.

编码风格是您和您的团队之间的协议 ，可以保持项目的一致性。

If you don’t have a team, it’s an agreement with you, to always keep your code up to your standards.

如果您没有团队，则与您达成协议 ，始终保持您的代码符合标准。

Having fixed rules on your code writing format helps a lot in order to have a more readable and managed code.

为使代码更具可读性和管理性 ，在代码编写格式上设置固定规则会有所帮助。

流行风格指南 (Popular Style Guides)

There are a quite a few of them around, here are the 2 most common ones in the JavaScript world:

它们周围有很多，这是JavaScript世界中最常见的2种：

• The Google JavaScript Style Guide

  Google JavaScript样式指南

• The AirBnb JavaScript Style Guide

  AirBnb JavaScript样式指南

It’s up to you to follow one of those, or create your own style guide.

您可以遵循其中之一，也可以创建自己的样式指南。

与您从事的项目保持一致 (Be consistent with the project you work on)

Even if you prefer a set of styles, when working on a project you should use that project style.

即使您喜欢一组样式，在处理项目时也应使用该项目样式。

An Open Source project on GitHub might follow a set of rules, another project you work on with a team might follow an entirely different one.

GitHub上的一个开源项目可能遵循一组规则，您与团队一起工作的另一个项目可能遵循一个完全不同的规则。

Prettier is an awesome tool that enforces code formatting, use it.

漂亮是一个很棒的工具，可以强制使用代码格式。

我自己的喜好 (My own preferences)

My own take on JavaScript style is:

我对JavaScript风格的看法是：

Always use the latest ES version. Use Babel if old browser support is necessary.

始终使用最新的ES版本。 如果需要旧的浏览器支持，请使用Babel。

Indentation: use spaces instead of tabs, indent using 2 spaces.

缩进 ：使用空格代替制表符，使用2个空格进行缩进。

Semicolons: don’t use semicolons.

分号 ：请勿使用分号。

Line length: try to cut lines at 80 chars, if possible.

线长 ：尝试切割线在80个字符，如果可能的话。

Inline Comments: use inline comments in your code. Use block comments only to document.

内联注释 ：在代码中使用内联注释。 仅使用块注释来记录文档。

No dead code: Don’t leave old code commented, “just in case” it will be useful later. Keep only the code you need now, version control/your notes app is meant for this.

没有无效代码 ：不要对旧代码进行注释，以防万一，以后会有用。 现在只保留您需要的代码，版本控制/便笺应用程序就是为此目的而设计的。

Only comment when useful: Don’t add comments that don’t help understand what the code is doing. If the code is self-explaining through the use of good variable and function naming, and JSDoc function comments, don’t add a comment.

仅在有用时添加注释：不要添加不利于理解代码功能的注释。 如果代码通过使用良好的变量和函数命名以及JSDoc函数注释来进行自我解释，请不要添加注释。

Variable declarations: always declare variables to avoid polluting the global object. Never use var. Default to const, only use let if you reassign the variable.

变量声明 ：始终声明变量，以避免污染全局对象。 切勿使用var 。 默认为const ，仅在重新分配变量时使用let 。

Functions: use arrow functions unless you have a specific reason to use regular functions, like in object methods or constructors, due to how this works. Declare them as const, and use implicit returns if possible.

功能 ：使用箭头的功能，除非你有特殊原因对象方法或构造，由于如何使用正功能，像this的作品。 将它们声明为const，并在可能的情况下使用隐式返回。

const test = (a, b) => a + b

const another = a => a + 2

Feel free to use nested functions to hide helper functions to the rest of the code.

随意使用嵌套函数将辅助函数隐藏到其余代码中。

Names: function names, variable names and method names always start with a lowercase letter (unless you identify them as private, read below), and are camelCased. Only constructor functions and class names should start capitalized. If you use a framework that requires specific conventions, change your habits accordingly. File names should all be lowercase, with words separated by -.

名称 ：函数名称，变量名称和方法名称始终以小写字母开头(除非您将它们标识为私有，请在下面阅读)，并带有驼峰式。 仅构造函数和类名应以大写开头。 如果使用要求特定约定的框架，请相应地更改习惯。 文件名应全部小写，单词之间用-分隔。

Statement-specific formats and rules:

特定于语句的格式和规则 ：

if

如果

if (condition) {
  statements
}

if (condition) {
  statements
} else {
  statements
}

if (condition) {
  statements
} else if (condition) {
  statements
} else {
  statements
}

for

对于

Always initialize the length in the initialization to cache it, don’t insert it in the condition.

总是在初始化时初始化长度以缓存它，不要在条件中插入它。

Avoid using for in except with used in conjunction with .hasOwnProperty(). Prefer for of (see JavaScript Loops)

避免与.hasOwnProperty()一起使用for in除非使用for in 。 身高for of (见JavaScript的循环 )

for (initialization; condition; update) {
  statements
}

while

而

while (condition) {
  statements
}

do

做

do {
  statements
} while (condition);

switch

开关

switch (expression) {
  case expression:
    statements
  default:
    statements
}

try

尝试

try {
  statements
} catch (variable) {
  statements
}

try {
  statements
} catch (variable) {
  statements
} finally {
  statements
}

Whitespace: use whitespace wisely to improve readability: put a whitespace after a keyword followed by a (; before & after a binary operation (+, -, /, *, &&..); inside the for statement, after each ; to separate each part of the statement; after each ,.

空白 ：使用空白明智地提高可读性：把一个空白的关键词，然后一个后( ;之前和二进制运算(后+ ， - / ， * ， && ..);里面的语句，在每个;分离语句的每个部分；在, 。

New lines: use new lines to separate blocks of code that perform logically related operations.

换行 ：使用换行分隔执行逻辑相关操作的代码块。

Quotes favor single quotes ' instead of double quotes ". Double quotes are a standard in HTML attributes, so using single quotes helps remove problems when dealing with HTML strings. Use template literals when appropriate instead of variable interpolation.

引号倾向于单引号'而不是双引号" 。双引号是HTML属性中的标准，因此使用单引号有助于消除处理HTML字符串时的问题。在适当的情况下使用模板文字而不是变量插值。

翻译自: https://flaviocopes.com/javascript-coding-style/

javascript 编码