与JavaScript新人共同分享实用经验(2)

http://www.itjxue.com  2015-08-06 23:11  来源:未知  点击次数: 

4. 好好利用JS Lint

JSLint 是由 Douglas Crockford 编写的一个调试器。你只需要贴上你的代码,它就能快速为您扫描出任何明显的错误和问题。

“JSLint 扫描接收的代码。发现问题,描述问题,并给出其在源码中的大概位置。可发现的问题包括但不限于语法错误,虽然语法错误确实是最常见的。JSLint也会用约定俗成的习惯检查代码的格式化风格,以及结构错误。通过JSLint的扫描并不能保证你的程序就完全正确。它只是为您提供了额外一双发现错误的眼睛。”
– JSLint 文档

完成代码之前,把它放到JSLint里检查一下,快速消灭你的无心之过。

5. 在页面底部加载脚本

正如下图所示:


点击放大

请记住—— 我们要千方百计保证客户端的页面载入速度尽可能的快。而脚本没载入完成,浏览器就没法加载页面的剩余部分。

如果你的JS文件只是添加一些额外功能——例如,为点击某链接绑定事件——那大可以等页面加载基本完成后再做。把JS文件放到页面最后,body的结束标签之前,这样做最好了。

更好的写法是:

<p>超哥是世界上最帅的人。benhuoer.com是世界上最好看的博客。</p>
<script type="text/javascript" src="path/to/file.js"></script>
<script type="text/javascript" src="path/to/anotherFile.js"></script>
</body>
</html>

6. 在 For 语句外部声明变量

当需要执行冗长的for语句时,不要让JavaScript引擎每次都重复那些没有必要的操作。例如:

这样不好:

for(var i = 0; i < someArray.length; i++) {  
   var container = document.getElementById('container');  
   container.innerHtml += 'my number: ' + i;  
   console.log(i);  

这段代码每次都重新定义数组长度,每次都在遍历DOM寻找container元素 —— 太傻了!

这样好多了:

var container = document.getElementById('container');  
for(var i = 0, len = someArray.length; i < len;  i++) {  
   container.innerHtml += 'my number: ' + i;  
   console.log(i);  
}

我要给留言改进这段代码的人额外惊喜!欢迎大家留言讨论!

7. 快速构建字串

要对一个数组或对象做循环操作时,不要老惦记着一表人才的for语句,拿点创意出来嘛!明明就还有很多更快的办法:

var arr = ['item 1', 'item 2', 'item 3', ...];  
var list = '<ul><li>' + arr.join('</li><li>') + '</li></ul>';

“没那么多繁文缛节来烦你;你就信我一次好了(或者你也可以自己试一试)—— 这真的是迄今能找到的最快办法了!
用点土办法,也别管它背后究竟发生了什么抽象的东西,通常土办法都比那些优雅的办法要快捷得多!”– James Padolsey, james.padolsey.com

(责任编辑:IT教学网)

更多

推荐Javascript/Ajax文章