javascript代码规范 [转]

原文:http://www.css88.com/archives/5366

全局命名空间污染与 IIFE

总是将代码包裹成一个 IIFE(Immediately-Invoked Function Expression),用以创建独立隔绝的定义域。这一举措可防止全局命名空间被污染。

IIFE 还可确保你的代码不会轻易被其它全局命名空间里的代码所修改(i.e. 第三方库,window 引用,被覆盖的未定义的关键字等等)。

不推荐

1 var x = 10,
2     y = 100;
3
4 // Declaring variables in the global scope is resulting in global scope pollution. All variables declared like this
5 // will be stored in the window object. This is very unclean and needs to be avoided.
6 console.log(window.x + ‘ ‘ + window.y);

推荐

 1 // We declare a IIFE and pass parameters into the function that we will use from the global space
 2 (function(log, w, undefined){
 3   ‘use strict‘;
 4
 5   var x = 10,
 6       y = 100;
 7
 8   // Will output ‘true true‘
 9   log((w.x === undefined) + ‘ ‘ + (w.y === undefined));
10
11 }(window.console.log, window));

IIFE(立即执行的函数表达式)

无论何时,想要创建一个新的封闭的定义域,那就用 IIFE。它不仅避免了干扰,也使得内存在执行完后立即释放。

所有脚本文件建议都从 IIFE 开始。

立即执行的函数表达式的执行括号应该写在外包括号内。虽然写在内还是写在外都是有效的,但写在内使得整个表达式看起来更像一个整体,因此推荐这么做。

不推荐

 1 (function(){})(); 

推荐

1 (function(){}());

so,用下列写法来格式化你的 IIFE 代码:

(function(){
  ‘use strict‘;

  // Code goes here

}());

如果你想引用全局变量或者是外层 IIFE 的变量,可以通过下列方式传参:

1 (function($, w, d){
2   ‘use strict‘;
3
4   $(function() {
5     w.alert(d.querySelectorAll(‘div‘).length);
6   });
7 }(jQuery, window, document));

严格模式

ECMAScript 5 严格模式可在整个脚本或独个方法内被激活。它对应不同的 javascript 语境会做更加严格的错误检查。严格模式也确保了 javascript 代码更加的健壮,运行的也更加快速。

严格模式会阻止使用在未来很可能被引入的预留关键字。

你应该在你的脚本中启用严格模式,最好是在独立的 IIFE 中应用它。避免在你的脚本第一行使用它而导致你的所有脚本都启动了严格模式,这有可能会引发一些第三方类库的问题。

不推荐

1 // Script starts here
2 ‘use strict‘;
3
4 (function(){
5
6   // Your code starts here
7
8 }());

推荐

1 (function(){
2   ‘use strict‘;
3
4   // Your code starts here
5
6 }());

变量声明

总是使用 var 来声明变量。如不指定 var,变量将被隐式地声明为全局变量,这将对变量难以控制。如果没有声明,变量处于什么定义域就变得不清(可以是在 Document 或 Window 中,也可以很容易地进入本地定义域)。所以,请总是使用 var 来声明变量。

采用严格模式带来的好处是,当你手误输入错误的变量名时,它可以通过报错信息来帮助你定位错误出处。

不推荐

1 x = 10;
2 y = 100;

不推荐

理解 JavaScript 的定义域和定义域提升

在 JavaScript 中变量和方法定义会自动提升到执行之前。JavaScript 只有 function 级的定义域,而无其他很多编程语言中的块定义域,所以使得你在某一 function 内的某语句和循环体中定义了一个变量,此变量可作用于整个 function 内,而不仅仅是在此语句或循环体中,因为它们的声明被 JavaScript 自动提升了。

我们通过例子来看清楚这到底是怎么一回事:

原 function

 1 (function(log){
 2   ‘use strict‘;
 3
 4   var a = 10;
 5
 6   for(var i = 0; i < a; i++) {
 7     var b = i * i;
 8     log(b);
 9   }
10
11   if(a === 10) {
12     var f = function() {
13       log(a);
14     };
15     f();
16   }
17
18   function x() {
19     log(‘Mr. X!‘);
20   }
21   x();
22
23 }(window.console.log));

被 JS 提升过后

 1 (function(log){
 2   ‘use strict‘;
 3   // All variables used in the closure will be hoisted to the top of the function
 4   var a,
 5       i,
 6       b,
 7       f;
 8   // All functions in the closure will be hoisted to the top
 9   function x() {
10     log(‘Mr. X!‘);
11   }
12
13   a = 10;
14
15   for(i = 0; i < a; i++) {
16     b = i * i;
17     log(b);
18   }
19
20   if(a === 10) {
21     // Function assignments will only result in hoisted variables but the function body will not be hoisted
22     // Only by using a real function declaration the whole function will be hoisted with its body
23     f = function() {
24       log(a);
25     };
26     f();
27   }
28
29   x();
30
31 }(window.console.log));

根据以上提升过程,你是否可理解以下代码?

有效代码

 1 (function(log){
 2   ‘use strict‘;
 3
 4   var a = 10;
 5
 6   i = 5;
 7
 8   x();
 9
10   for(var i; i < a; i++) {
11     log(b);
12     var b = i * i;
13   }
14
15   if(a === 10) {
16     f = function() {
17       log(a);
18     };
19     f();
20
21     var f;
22   }
23
24   function x() {
25     log(‘Mr. X!‘);
26   }
27
28 }(window.console.log));

正如你所看到的这段令人充满困惑与误解的代码导致了出人意料的结果。只有良好的声明习惯,也就是下一章节我们要提到的声明规则,才能尽可能的避免这类错误风险。



提升声明

为避免上一章节所述的变量和方法定义被自动提升造成误解,把风险降到最低,我们应该手动地显示地去声明变量与方法。也就是说,所有的变量以及方法,应当定义在 function 内的首行。

只用一个 var 关键字声明,多个变量用逗号隔开。

不推荐

 1 (function(log){
 2   ‘use strict‘;
 3
 4   var a = 10;
 5   var b = 10;
 6
 7   for(var i = 0; i < 10; i++) {
 8     var c = a * b * i;
 9   }
10
11   function f() {
12
13   }
14
15   var d = 100;
16   var x = function() {
17     return d * d;
18   };
19   log(x());
20
21 }(window.console.log));

推荐

 1 (function(log){
 2   ‘use strict‘;
 3
 4   var a = 10,
 5       b = 10,
 6       i,
 7       c,
 8       d,
 9       x;
10
11   function f() {
12
13   }
14
15   for(i = 0; i < 10; i++) {
16     c = a * b * i;
17   }
18
19
20
21   d = 100;
22   x = function() {
23     return d * d;
24   };
25   log(x());
26
27 }(window.console.log));

把赋值尽量写在变量申明中。

不推荐

1 var a,
2     b,
3     c;
4
5 a = 10;
6 b = 10;
7 c = 100;

推荐

1 var a = 10,
2     b = 10,
3     c = 100;

总是使用带类型判断的比较判断

总是使用 === 精确的比较操作符,避免在判断的过程中,由 JavaScript 的强制类型转换所造成的困扰。

如果你使用 === 操作符,那比较的双方必须是同一类型为前提的条件下才会有效。

如果你想了解更多关于强制类型转换的信息,你可以读一读 Dmitry Soshnikov 的这篇文章

在只使用 == 的情况下,JavaScript 所带来的强制类型转换使得判断结果跟踪变得复杂,下面的例子可以看出这样的结果有多怪了:

 1 (function(log){
 2   ‘use strict‘;
 3
 4   log(‘0‘ == 0); // true
 5   log(‘‘ == false); // true
 6   log(‘1‘ == true); // true
 7   log(null == undefined); // true
 8
 9   var x = {
10     valueOf: function() {
11       return ‘X‘;
12     }
13   };
14
15   log(x == ‘X‘);
16
17 }(window.console.log));

明智地使用真假判断

当我们在一个 if 条件语句中使用变量或表达式时,会做真假判断。if(a == true) 是不同于 if(a) 的。后者的判断比较特殊,我们称其为真假判断。这种判断会通过特殊的操作将其转换为 true 或 false,下列表达式统统返回 false:false0undefinednullNaN‘‘(空字符串).

这种真假判断在我们只求结果而不关心过程的情况下,非常的有帮助。

以下示例展示了真假判断是如何工作的:

 1 (function(log){
 2   ‘use strict‘;
 3
 4   function logTruthyFalsy(expr) {
 5     if(expr) {
 6       log(‘truthy‘);
 7     } else {
 8       log(‘falsy‘);
 9     }
10   }
11
12   logTruthyFalsy(true); // truthy
13   logTruthyFalsy(1); // truthy
14   logTruthyFalsy({}); // truthy
15   logTruthyFalsy([]); // truthy
16   logTruthyFalsy(‘0‘); // truthy
17
18   logTruthyFalsy(false); // falsy
19   logTruthyFalsy(0); // falsy
20   logTruthyFalsy(undefined); // falsy
21   logTruthyFalsy(null); // falsy
22   logTruthyFalsy(NaN); // falsy
23   logTruthyFalsy(‘‘); // falsy
24
25 }(window.console.log));

变量赋值时的逻辑操作

逻辑操作符 || 和 && 也可被用来返回布尔值。如果操作对象为非布尔对象,那每个表达式将会被自左向右地做真假判断。基于此操作,最终总有一个表达式被返回回来。这在变量赋值时,是可以用来简化你的代码的。

不推荐

1 if(!x) {
2   if(!y) {
3     x = 1;
4   } else {
5     x = y;
6   }
7 }

推荐

  1. x = x || y || 1;

这一小技巧经常用来给方法设定默认的参数。

  1. (function(log){
  2. ‘use strict‘;
  3. function multiply(a, b) {
  4. a = a || 1;
  5. b = b || 1;
  6. log(‘Result ‘ + a * b);
  7. }
  8. multiply(); // Result 1
  9. multiply(10); // Result 10
  10. multiply(3, NaN); // Result 3
  11. multiply(9, 5); // Result 45
  12. }(window.console.log));

分号

总是使用分号,因为隐式的代码嵌套会引发难以察觉的问题。当然我们更要从根本上来杜绝这些问题[1]。以下几个示例展示了缺少分号的危害:

  1. // 1.
  2. MyClass.prototype.myMethod = function() {
  3. return 42;
  4. }  // No semicolon here.
  5. (function() {
  6. // Some initialization code wrapped in a function to create a scope for locals.
  7. })();
  8. var x = {
  9. ‘i‘: 1,
  10. ‘j‘: 2
  11. }  // No semicolon here.
  12. // 2.  Trying to do one thing on Internet Explorer and another on Firefox.
  13. // I know you‘d never write code like this, but throw me a bone.
  14. [ffVersion, ieVersion][isIE]();
  15. var THINGS_TO_EAT = [apples, oysters, sprayOnCheese]  // No semicolon here.
  16. // 3. conditional execution a la bash
  17. -1 == resultOfOperation() || die();

So what happens?

  1. JavaScript 错误 —— 首先返回 42 的那个 function 被第二个 function 当中参数传入调用,接着数字 42 也被“调用”而导致出错。
  2. 八成你会得到 ‘no such property in undefined’ 的错误提示,因为在真实环境中的调用是这个样子:x[ffVersion, ieVersion][isIE]().
  3. die 总是被调用。因为数组减 1 的结果是 NaN,它不等于任何东西(无论 resultOfOperation 是否返回 NaN)。所以最终的结果是 die() 执行完所获得值将赋给 THINGS_TO_EAT.

Why?

JavaScript 中语句要以分号结束,否则它将会继续执行下去,不管换不换行。以上的每一个示例中,函数声明或对象或数组,都变成了在一句语句体内。要知道闭合圆括号并不代表语句结束,JavaScript 不会终结语句,除非它的下一个 token 是一个中缀符[2] 或者是圆括号操作符。

这真是让人大吃一惊,所以乖乖地给语句末加上分号吧。

澄清:分号与函数

分号需要用在表达式的结尾,而并非函数声明的结尾。区分它们最好的例子是:

  1. var foo = function() {
  2. return true;
  3. };  // semicolon here.
  4. function foo() {
  5. return true;
  6. }  // no semicolon here.

嵌套函数

嵌套函数是非常有用的,比如用在持续创建和隐藏辅助函数的任务中。你可以非常自由随意地使用它们。

语句块内的函数声明

切勿在语句块内声明函数,在 ECMAScript 5 的严格模式下,这是不合法的。函数声明应该在定义域的顶层。但在语句块内可将函数申明转化为函数表达式赋值给变量。

不推荐

  1. if (x) {
  2. function foo() {}
  3. }

推荐

  1. if (x) {
  2. var foo = function() {};
  3. }

异常

基本上你无法避免出现异常,特别是在做大型开发时(使用应用开发框架等等)。

在没有自定义异常的情况下,从有返回值的函数中返回错误信息一定非常的棘手,更别提多不优雅了。不好的解决方案包括了传第一个引用类型来接纳错误信息,或总是返回一个对象列表,其中包含着可能的错误对象。以上方式基本上是比较简陋的异常处理方式。适时可做自定义异常处理。

在复杂的环境中,你可以考虑抛出对象而不仅仅是字符串(默认的抛出值)。

  1. if(name === undefined) {
  2. throw {
  3. name: ‘System Error‘,
  4. message: ‘A name should always be specified!‘
  5. }
  6. }

标准特性

总是优先考虑使用标准特性。为了最大限度地保证扩展性与兼容性,总是首选标准的特性,而不是非标准的特性(例如:首选 string.charAt(3) 而不是 string[3];首选 DOM 的操作方法来获得元素引用,而不是某一应用特定的快捷方法)。


简易的原型继承

如果你想在 JavaScript 中继承你的对象,请遵循一个简易的模式来创建此继承。如果你预计你会遇上复杂对象的继承,那可以考虑采用一个继承库,比如 Proto.js by Axel Rauschmayer.

简易继承请用以下方式:

  1. (function(log){
  2. ‘use strict‘;
  3. // Constructor function
  4. function Apple(name) {
  5. this.name = name;
  6. }
  7. // Defining a method of apple
  8. Apple.prototype.eat = function() {
  9. log(‘Eating ‘ + this.name);
  10. };
  11. // Constructor function
  12. function GrannySmithApple() {
  13. // Invoking parent constructor
  14. Apple.prototype.constructor.call(this, ‘Granny Smith‘);
  15. }
  16. // Set parent prototype while creating a copy with Object.create
  17. GrannySmithApple.prototype = Object.create(Apple.prototype);
  18. // Set constructor to the sub type, otherwise points to Apple
  19. GrannySmithApple.prototype.constructor = GrannySmithApple;
  20. // Calling a super method
  21. GrannySmithApple.prototype.eat = function() {
  22. // Be sure to apply it onto our current object with call(this)
  23. Apple.prototype.eat.call(this);
  24. log(‘Poor Grany Smith‘);
  25. };
  26. // Instantiation
  27. var apple = new Apple(‘Test Apple‘);
  28. var grannyApple = new GrannySmithApple();
  29. log(apple.name); // Test Apple
  30. log(grannyApple.name); // Granny Smith
  31. // Instance checks
  32. log(apple instanceof Apple); // true
  33. log(apple instanceof GrannySmithApple); // false
  34. log(grannyApple instanceof Apple); // true
  35. log(grannyApple instanceof GrannySmithApple); // true
  36. // Calling method that calls super method
  37. grannyApple.eat(); // Eating Granny Smith\nPoor Grany Smith
  38. }(window.console.log));

使用闭包

闭包的创建也许是 JS 最有用也是最易被忽略的能力了。关于闭包如何工作的合理解释


切勿在循环中创建函数

在简单的循环语句中加入函数是非常容易形成闭包而带来隐患的。下面的例子就是一个典型的陷阱:

不推荐

  1. (function(log, w){
  2. ‘use strict‘;
  3. // numbers and i is defined in the current function closure
  4. var numbers = [1, 2, 3],
  5. i;
  6. for(i = 0; i < numbers.length; i++) {
  7. w.setTimeout(function() {
  8. // At the moment when this gets executed the i variable, coming from the outer function scope
  9. // is set to 3 and the current program is alerting the message 3 times
  10. // ‘Index 3 with number undefined
  11. // If you understand closures in javascript you know how to deal with those cases
  12. // It‘s best to just avoid functions / new closures in loops as this prevents those issues
  13. w.alert(‘Index ‘ + i + ‘ with number ‘ + numbers[i]);
  14. }, 0);
  15. }
  16. }(window.console.log, window));

接下来的改进已解决问题,而且也遵循了规范。可是,你会发现看上去似乎过于复杂繁冗了,应该会有更好的解决方案吧。

不完全推荐

  1. (function(log, w){
  2. ‘use strict‘;
  3. // numbers and i is defined in the current function closure
  4. var numbers = [1, 2, 3],
  5. i;
  6. // Create a function outside of the loop that will accept arguments to create a
  7. // function closure scope. This function will return a function that executes in this
  8. // closure parent scope.
  9. function alertIndexWithNumber(index, number) {
  10. return function() {
  11. w.alert(‘Index ‘ + index + ‘ with number ‘ + number);
  12. };
  13. }
  14. // First parameter is a function call that returns a function.
  15. // ---
  16. // This solves our problem and we don‘t create a function inside our loop
  17. for(i = 0; i < numbers.length; i++) {
  18. w.setTimeout(alertIndexWithNumber(i, numbers[i]), 0);
  19. }
  20. }(window.console.log, window));

将循环语句转换为函数执行的方式问题能得到立马解决,每一次循环都会对应地创建一次闭包。函数式的风格更加值得推荐,而且看上去也更加地自然和可预料。

推荐

  1. (function(log, w){
  2. ‘use strict‘;
  3. // numbers and i is defined in the current function closure
  4. var numbers = [1, 2, 3],
  5. i;
  6. numbers.forEach(function(number, index) {
  7. w.setTimeout(function() {
  8. w.alert(‘Index ‘ + index + ‘ with number ‘ + number);
  9. }, 0);
  10. });
  11. }(window.console.log, window));

this 关键字

只在对象构造器、方法和在设定的闭包中使用 this 关键字。this 的语义在此有些误导。它时而指向全局对象(大多数时),时而指向调用者的定义域(在 eval 中),时而指向 DOM 树中的某一节点(当用事件处理绑定到 HTML 属性上时),时而指向一个新创建的对象(在构造器中),还时而指向其它的一些对象(如果函数被 call() 和 apply() 执行和调用时)。

正因为它是如此容易地被搞错,请限制它的使用场景:

  • 在构造函数中
  • 在对象的方法中(包括由此创建出的闭包内)

首选函数式风格

函数式编程让你可以简化代码并缩减维护成本,因为它容易复用,又适当地解耦和更少的依赖。

接下来的例子中,在一组数字求和的同一问题上,比较了两种解决方案。第一个例子是经典的程序处理,而第二个例子则是采用了函数式编程和 ECMA Script 5.1 的数组方法。

例外:往往在重代码性能轻代码维护的情况之下,要选择最优性能的解决方案而非维护性高的方案(比如用简单的循环语句代替 forEach)。

不推荐

  1. (function(log){
  2. ‘use strict‘;
  3. var arr = [10, 3, 7, 9, 100, 20],
  4. sum = 0,
  5. i;
  6. for(i = 0; i < arr.length; i++) {
  7. sum += arr[i];
  8. }
  9. log(‘The sum of array ‘ + arr + ‘ is: ‘ + sum)
  10. }(window.console.log));

推荐

  1. (function(log){
  2. ‘use strict‘;
  3. var arr = [10, 3, 7, 9, 100, 20];
  4. var sum = arr.reduce(function(prevValue, currentValue) {
  5. return prevValue + currentValue;
  6. }, 0);
  7. log(‘The sum of array ‘ + arr + ‘ is: ‘ + sum);
  8. }(window.console.log));

另一个例子通过某一规则对一个数组进行过滤匹配来创建一个新的数组。

不推荐

  1. (function(log){
  2. ‘use strict‘;
  3. var numbers = [11, 3, 7, 9, 100, 20, 14, 10],
  4. numbersGreaterTen = [],
  5. i;
  6. for(i = 0; i < numbers.length; i++) {
  7. if(numbers[i] > 10) {
  8. numbersGreaterTen.push(numbers[i]);
  9. }
  10. }
  11. log(‘From the list of numbers ‘ + numbers + ‘ only ‘ + numbersGreaterTen + ‘ are greater than ten‘);
  12. }(window.console.log));

推荐

  1. (function(log){
  2. ‘use strict‘;
  3. var numbers = [11, 3, 7, 9, 100, 20, 14, 10];
  4. var numbersGreaterTen = numbers.filter(function(element) {
  5. return element > 10;
  6. });
  7. log(‘From the list of numbers ‘ + numbers + ‘ only ‘ + numbersGreaterTen + ‘ are greater than ten‘);
  8. }(window.console.log));

使用 ECMA Script 5

建议使用 ECMA Script 5 中新增的语法糖和函数。这将简化你的程序,并让你的代码更加灵活和可复用。


数组和对象的属性迭代

用 ECMA5 的迭代方法来迭代数组。使用 Array.forEach 或者如果你要在特殊场合下中断迭代,那就用 Array.every

  1. (function(log){
  2. ‘use strict‘;
  3. // Iterate over an array and break at a certain condition
  4. [1, 2, 3, 4, 5].every(function(element, index, arr) {
  5. log(element + ‘ at index ‘ + index + ‘ in array ‘ + arr);
  6. if(index !== 5) {
  7. return true;
  8. }
  9. });
  10. // Defining a simple javascript object
  11. var obj = {
  12. a: ‘A‘,
  13. b: ‘B‘,
  14. ‘c-d-e‘: ‘CDE‘
  15. };
  16. // Iterating over the object keys
  17. Object.keys(obj).forEach(function(element, index, arr) {
  18. log(‘Key ‘ + element + ‘ has value ‘ + obj[element]);
  19. });
  20. }(window.console.log));

不要使用 switch

switch 在所有的编程语言中都是个非常错误的难以控制的语句,建议用 if else 来替换它。


数组和对象字面量

用数组和对象字面量来代替数组和对象构造器。数组构造器很容易让人在它的参数上犯错。

不推荐

  1. // Length is 3.
  2. var a1 = new Array(x1, x2, x3);
  3. // Length is 2.
  4. var a2 = new Array(x1, x2);
  5. // If x1 is a number and it is a natural number the length will be x1.
  6. // If x1 is a number but not a natural number this will throw an exception.
  7. // Otherwise the array will have one element with x1 as its value.
  8. var a3 = new Array(x1);
  9. // Length is 0.
  10. var a4 = new Array();

正因如此,如果将代码传参从两个变为一个,那数组很有可能发生意料不到的长度变化。为避免此类怪异状况,请总是采用更多可读的数组字面量。

推荐

  1. var a = [x1, x2, x3];
  2. var a2 = [x1, x2];
  3. var a3 = [x1];
  4. var a4 = [];

对象构造器不会有类似的问题,但是为了可读性和统一性,我们应该使用对象字面量。

不推荐

  1. var o = new Object();
  2. var o2 = new Object();
  3. o2.a = 0;
  4. o2.b = 1;
  5. o2.c = 2;
  6. o2[‘strange key‘] = 3;

应该写成这样:

推荐

  1. var o = {};
  2. var o2 = {
  3. a: 0,
  4. b: 1,
  5. c: 2,
  6. ‘strange key‘: 3
  7. };

修改内建对象的原型链

修改内建的诸如 Object.prototype 和 Array.prototype 是被严厉禁止的。修改其它的内建对象比如 Function.prototype,虽危害没那么大,但始终还是会导致在开发过程中难以 debug 的问题,应当也要避免。


自定义 toString() 方法

你可以通过自定义 toString() 来控制对象字符串化。这很好,但你必须保证你的方法总是成功并不会有其它副作用。如果你的方法达不到这样的标准,那将会引发严重的问题。如果 toString() 调用了一个方法,这个方法做了一个断言[3] ,当断言失败,它可能会输出它所在对象的名称,当然对象也需要调用 toString()


圆括号

一般在语法和语义上真正需要时才谨慎地使用圆括号。不要用在一元操作符上,例如 deletetypeof 和void,或在关键字之后,例如 returnthrowcasenew 等。


字符串

统一使用单引号(‘),不使用双引号(“)。这在创建 HTML 字符串非常有好处:

  1. var msg = ‘This is some HTML <div class="makes-sense"></div>‘;

三元条件判断(if 的快捷方法)

用三元操作符分配或返回语句。在比较简单的情况下使用,避免在复杂的情况下使用。没人愿意用 10 行三元操作符把自己的脑子绕晕。

不推荐

  1. if(x === 10) {
  2. return ‘valid‘;
  3. } else {
  4. return ‘invalid‘;
  5. }

推荐

  1. return x === 10 ? ‘valid‘ : ‘invalid‘;

[1]:作者指的是采用严格规范的语句写法,从根本上杜绝由分号缺失而引起的代码歧义。

[2]:中缀符,指的是像 x + y 中的 +

[3]:断言一般指程序员在测试测序时的假设,一般是一些布尔表达式,当返回是 true 时,断言为真,代码运行会继续进行;如果条件判断为 false,代码运行停止,你的应用被终止。

时间: 2024-10-09 21:10:58

javascript代码规范 [转]的相关文章

JavaScript代码规范和性能整理

性能 Js在性能方面有多要注意的地方: 避免全局查找 Js性能优化最重要的就是注意全局查找,因为作用域的查找是先找局部作用域在没有找到之后在去上一级作用域查找直到全局作用域,所以全局作用域查找的性能消耗肯定要比本函数局部作用域的消耗大.举个例子: function setInnerHtml(){ var divDom=doucument.getElementsByTagName("div"); for(var i=0,len=divDom.lemgth;i<len;i++){ d

Javascript代码规范

1. 前言 JavaScript一直有着广泛的应用,特别是在浏览器端的行为管理.本文档的目标是使JavaScript代码风格保持一致,容易被理解和被维护. 虽然本文档是针对JavaScript设计的,但是在使用各种JavaScript的预编译语言时(如TypeScript等)时,适用的部分也应尽量遵循本文档的约定. 任何问题或建议,欢迎跟我们讨论 2. 代码风格 2.1. 文件 ·[建议] JavaScript 文件使用无 BOM 的 UTF-8 编码. 解释 UTF-8 编码具有更广泛的适应性

JavaScript 代码规范

代码规范通常包括以下几个方面: 变量和函数的命名规则 空格,缩进,注释的使用规则. 其他常用规范…… 1.变量的正确命名 变量名推荐使用驼峰法来命名(camelCase): 2.运算符前后合理使用空格 通常运算符 ( = + - * / ) 前后需要添加空格: 3.代码缩进,增加代码可读性 通常使用 4 个空格符号来缩进代码块: 为什么不适用Tab键的原因:不同编辑器 TAB 键的解析不一样. 4.语句规则 简单语句的通用规则: 一条语句通常以分号作为结束符. var values = ["Vo

JavaScript代码规范及其他注意事项

代码执行一般自上而下,变量需要在使用的函数段之前进行声明并赋予初值. 代码规范书写: 1.选中代码段后使用Tab键,可令代码段整体向右移动一段位置(一般是4位),善用Tab键可使得代码段对齐变得更容易.代码段对齐,可读性更好. 2.等号"=".加号"+"等数学运算符两边应空出1位.如  x = x + 1; 3.添加注释一般使用"//".注释应简明易懂. 4.代码段合理使用空行可提升可读性. 5.变量通常使用字母.下划线.数字的组合方式且首位应使

Airbnb Javascript 代码规范重要点总结es6

中文原地址 1.对所有的引用使用 const 而非 var.这能确保你无法对引用重复赋值. 当需要变动引用时,使用let. const和let都是块级作用域. 2.创建对象的方式: const item = {}: 使用对象属性的简写,且为简写的属性分组. 3.创建数组的方式: const arr = [ ]; 使用arr.push()去替代直接赋值. 使用拓展运算符去赋值数组: arrCopy = [...arr]; 使用Array.from()把一个类数组对象转换成数组: const foo

javascript,jquery代码规范

jquery代码规范 Coding Standards & Best Practices 中文翻译版:jquery编程的标准写法和最佳实践 javascript代码规范 引爆你的Javascript代码进化 https://github.com/fex-team/styleguide/blob/master/javascript.md https://github.com/hiwanz/javascript-style-reference http://www.cnblogs.com/husts

前端代码编码和设计规范系列——JavaScript编程规范

1文档信息 条目 内容 项目编号 通用 项目名称 通用 标题 JavaScript编程规范 类别 规范文档 当前 试用草稿 摘要 当前版本 V1.0 日期 2015/11/9 作者 徐维坚(xuweijian) 文档拥有者 内部公开 文件 前端规范系列-JavaScript篇.docx 2修改历史 编号 修订人 修订内容简述 修订 日期 修订前 版本号 修订后 版本号 V0001 徐维坚 编程规范文件编写,草稿试用版公布 2015/11/10 V1.0 规范前言 良好的编程规范对于软件的开发与维

js/javascript代码注释规范与示例

注释在代码编写过程中的重要性,写代码超过半年的就能深深的体会到.没有注释的代码都不是好代码.为了别人学习,同时为了自己以后对代码进行‘升级’,看看js/javascript代码注释规范与示例.来自:http://www.56.com/style/-doc-/v1/tpl/js_dev_spec/spec-comment.html 文件注释 文件注释位于文件的最前面,应包括文件的以下信息:概要说明及版本(必须)项目地址(开源组件必须)版权声明(必须)开源协议(开源组件必须)版本号(必须)修改时间(

Javascript编码规范,好的代码从书写规范开始,增强代码的可读性,可维护性,这是相当重要的!

1. 前言 JavaScript在百度一直有着广泛的应用,特别是在浏览器端的行为管理.本文档的目标是使JavaScript代码风格保持一致,容易被理解和被维护. 虽然本文档是针对JavaScript设计的,但是在使用各种JavaScript的预编译语言时(如TypeScript等)时,适用的部分也应尽量遵循本文档的约定. 任何问题或建议,欢迎跟我们讨论:[email protected]. 2. 代码风格 2.1. 文件 ·[建议] JavaScript 文件使用无 BOM 的 UTF-8 编码