给JavaScript初学者的建议

  • • 发表于 8年前
  • • 作者 茂茂
  • • 3352 人浏览
  • • 27 条评论
  • • 最后编辑时间 8年前
  • • 来自 [技 术]

原创声明:本文为作者原创,未经允许不得转载,经授权转载需注明作者和出处

给JavaScript初学者的建议

1. 使用 === 代替 ==

JavaScript 使用2种不同的等值运算符:=== !== 和 == !=,在比较操作中使用前者是最佳实践。
“如果两边的操作数具有相同的类型和值,===返回true,!==返回false。”
然而,当使用==和!=时,你可能会遇到类型不同的情况,这种情况下,操作数的类型会被强制转换成一样的再做比较,这可能不是你想要的结果。

2. 将脚本放在页面的底部

记住——首要目标是让页面尽可能快的呈献给用户,脚本的夹在是阻塞的,脚本加载并执行完之前,浏览器不能继续渲染下面的内容。因此,用户将被迫等待更长时间。
如果你的js只是用来增强效果——例如,按钮的单击事件——马上将脚本放在body结束之前。这绝对是最佳实践。

<html>
<body>
<p>给JavaScript初学者的建议</p>  
<script type="text/javascript" src="javascript.js"></script>  
<script type="text/javascript" src="jquery.js"></script>  
</body>  
</html>

3. 避免在for语句里面声明变量

要尽量保持for语句块的简洁,例如:

糟糕
for(var i = 0; i < maomao.length; i++) {  
   var js = document.getElementById('js');  
   js.innerHtml += '茂茂: ' + i;  
   console.log(i);  
}

这样每次循环都要计算数组的长度,并且每次都要遍历dom查询“js”元素使得效率严重地下!

建议
var js = document.getElementById('js'),len = maomao.length; 
for(var i = 0; i < len;  i++) {  
  js.innerHtml += '茂茂: ' + i;  
   console.log(i);  
}

4. 减少全局变量

1、命名冲突

全局变量太多时,可能我们无意之中声明的一个全局变量,其实之前已经存在。这是可能就会造成后面的值覆盖掉前面的值。

2、代码脆弱

比如,在函数内部依赖一个全局变量,一旦这个全局变量被删除或被修改,都会影响到这个函数的执行是否正确。

3、难以测试

依赖全局变量之后,整个框架要依赖于全局变量才能运行。所以要想进行局部测试或单元测试就必须要创建好完整的全局环境。

5. 定义多个变量时,省略var关键字,用逗号代替(单 Var 模式)

糟糕
var maomao = 'maomao';  
var club = 'club';
建议
var maomao = 'maomao',  
    club = 'club';

6. 给代码添加注释

尽量给你的代码添加合理的注释,这样当一段时间后,重新看你的代码,你可能记不清当初你的思路。或者你的一位同事需要修改你的代码呢?
所以给代码添加注释是很重要的。

7. 不要省略分号

从技术上讲,大多数浏览器允许你省略分号。
不过这样的做法可能会导致更大的,难以发现的问题。

8. 原生代码永远比库快

JavaScript库,例如jQuery可以节省大量的编码时间,特别是AJAX操作。
但是库永远不可能比原生JavaScript代码更快。
jQuery的“each”方法是伟大的循环,但使用原生”for”语句总是更快。

9. 移除”language”属性

以前脚本标签中的“language”属性非常常见。

<script type="text/javascript" language="javascript">  
...  
</script>

不过这个属性已被html5弃用,所以请你移除。

最后附带广告一枚 授权码

分享到:
27条评论
Ctrl+Enter
作者

茂茂

茂茂

APP:2 帖子:16 回复:199 积分:13534

已加入社区[2924]天

啦啦啦

作者详情》
Top