设为首页收藏本站

LUPA开源社区

 找回密码
 注册
文章 帖子 博客

给JavaScript初学者的24条最佳实践

2013-12-12 13:49| 发布者: 红黑魂| 查看: 4174| 评论: 0|来自: 伯乐在线

摘要: 这篇文章将回顾JavaScript的知识 !如果你看完了下面的内容,请务必让我们知道你掌握的小技巧!

14.使用[]代替 new Array()

这同样适用于创建一个新的数组。

例如:

1
2
3
var a = new Array(); 
a[0] = "Joe"
a[1] = 'Plumber';

更好的做法:

1
var a = ['Joe','Plumber'];

“javascript程序中常见的错误是在需要对象的时候使用数组,而需要数组的时候却使用对象。规则很简单:当属性名是连续的整数时,你应该使用数组。否则,请使用对象”——Douglas Crockford

 

15.定义多个变量时,省略var关键字,用逗号代替

1
2
3
var someItem = 'some string'
var anotherItem = 'another string'
var oneMoreItem = 'one more string';

更好的做法

1
2
3
var someItem = 'some string'
    anotherItem = 'another string'
    oneMoreItem = 'one more string';

…应而不言自明。我怀疑这里真的有所提速,但它能是你的代码更清晰。

 

(不好意思,第16 条被作者吃掉了)

 

17.谨记,不要省略分号

从技术上讲,大多数浏览器允许你省略分号。

1
2
3
4
var someItem = 'some string' 
function doSomething() { 
  return 'something' 
}

已经说过,这是一个非常糟糕的做法可能会导致更大的,难以发现的问题。

更好的做法

1
2
3
4
var someItem = 'some string'
function doSomething() { 
  return 'something'
}

18.”For in”语句

当遍历对象的属性时,你可能会发现还会检索方法函数。为了解决这个问题,总在你的代码里包裹在一个if语句来过滤信息。

1
2
3
4
5
for(key in object) { 
   if(object.hasOwnProperty(key) { 
      ...then do something... 
   
}

参考 JavaScript:语言精粹,道格拉斯(Douglas Crockford)。

 

19.使用Firebug的”timer”功能优化你的代码

在寻找一个快速、简单的方法来确定操作需要多长时间吗?使用Firebug的“timer”功能来记录结果。
1
2
3
4
5
function TimeTracker(){ 
 console.time("MyTimer"); 
 for(x=5000; x > 0; x--){} 
 console.timeEnd("MyTimer"); 
}

20.阅读,阅读,反复阅读

虽然我是一个巨大的web开发博客的粉丝(像这样!),午餐之余或上床睡觉之前,实在没有什么比一本书更合适了,坚持放一本web开发方面书在你的床头柜。下面是一些我最喜爱的JavaScript书籍。

读了他们……多次。我仍将继续!

 

21.自执行函数

和调用一个函数类似,它很简单的使一个函数在页面加载或父函数被调用时自动运行。简单的将你的函数用圆括号包裹起来,然后添加一个额外的设置,这本质上就是调用函数。

1
2
3
4
5
6
(function doSomething() { 
   return
      name: 'jeff'
      lastName: 'way' 
   }; 
})();

22.原生代码永远比库快

JavaScript库,例如jQuery和Mootools等可以节省大量的编码时间,特别是AJAX操作。已经说过,总是记住,库永远不可能比原生JavaScript代码更快(假设你的代码正确)。

jQuery的“each”方法是伟大的循环,但使用原生”for”语句总是更快。

 

23.道格拉斯的 JSON.Parse

尽管JavaScript 2(ES5)已经内置了JSON 解析器。但在撰写本文时,我们仍然需要自己实现(兼容性)。道格拉斯(Douglas Crockford),JSON之父,已经创建了一个你可以直接使用的解析器。这里可以下载(链接已坏,可以在这里查看相关信息http://www.json.org/)。

只需简单导入脚本,您将获得一个新的全局JSON对象,然后可以用来解析您的json文件。

1
2
3
4
5
6
var response = JSON.parse(xhr.responseText); 
 
var container = document.getElementById('container'); 
for(var i = 0, len = response.length; i < len; i++) { 
  container.innerHTML += '<li>' + response[i].name + ' : ' + response[i].email + '</li>'
}

24.移除”language”属性

曾经脚本标签中的“language”属性非常常见。

1
2
3
<script type="text/javascript" language="javascript"
... 
</script>

然而,这个属性早已被弃用,所以请移除(译者注:html5 中已废弃,但如果你喜欢,你仍然可以添加)。

 

就这样吧,伙计

现在你已经学到了,24条JavaScript初学者的必备技巧。让我知道你高效技巧吧!感谢你的阅读。本系列的第三部分主题会是什么呢(思索中)?

 

译者补充

第三部分在这里:《编写更好的jQuery代码的建议

关于#20 的补充,下面是译者认为的一些好书,有兴趣的读者可以留言讨论

  • javascript模式(和上面JavaScript面向对象编程指南同一作者,这本书更好)
  • javascript设计模式
  • 编写可维护的javascript(尼古拉斯新书)
  • 高性能javascript(尼古拉斯 已绝版)
  • javascript语言精髓与编程实践
  • javascript高级程序设计(尼古拉斯)

原文链接: net.tutsplus   翻译: 伯乐在线 yanhaijing
译文链接: http://blog.jobbole.com/53199/

酷毙

雷人

鲜花

鸡蛋

漂亮
  • 快毕业了,没工作经验,
    找份工作好难啊?
    赶紧去人才芯片公司磨练吧!!

最新评论

关于LUPA|人才芯片工程|人才招聘|LUPA认证|LUPA教育|LUPA开源社区 ( 浙B2-20090187 浙公网安备 33010602006705号   

返回顶部