2015使用JavaScript的12条建议

转载 2015年11月20日 15:13:11

不管是前端开发技术还是后端开发技术,在学习中,我们或多或少都会接触到JavaScript。因此,JavaScript正在成长为开发人员必学的编程语言之一。但互联网技术更新迭代如此快的今天,我们如何才能更好的学习、掌握JavaScript技术呢?下面小编就为大家分享下2015年学习JavaScript的12条建议,希望对大家的学习有帮助。

1. JS应该放到.js文件中

所有的js都需要放到.js文件中,及时只有几行代码也不例外。因为这样可以增强代码的可读性、节省带宽、增加搜索引擎友好度等等。因为,代码内的JavaScript在每次页面加载时都会重新下载,而独立的.js文件则会被缓存起来。同时单独存储JS代码,也方便后期的修改。

2. JS应该是静态的

很多程序猿喜欢像使用服务器端语言如C#, Ruby, Java那样来动态的使用JavaScript,不过这么做的话,会失去了代码着色、语法高亮显示和智能感知的支持。

如果要动态化JavaScript的话,可以使用JSON引入动态行为,这就是JavaScript配置对象模式。具体方法如下:把JSON注入到你应用程序的头部,并根据业务逻辑的需要利用这些数据。这看起来貌似违背了js需要放到单独的.js文件中,但JSON可以看作是数据,而不是代码,为了支持静态的、单独的JavaScript文件,总会有一些牺牲的。

3.压缩JS代码

压缩js代买可以减小文件体积,提升页面加载速度,让网站拥有更好的客户体验度。以前压缩JS很麻烦,但现在完全是简单自动化的,有很多方法都可以做到,比如:Gulp和gulp-uglify就是一种低摩擦和自动化的办法。

4. JS应该位于页面底部

JS调用代码需要放到页面body标签的底部,因为如果你把script标签放在head中,它会阻碍页面渲染。因为,位于head中的脚本必须在页面显示前加载,因此把script放在底部的body前面可以先显示页面,而不用等JS文件下载完毕,有助于提升感知性能。如果你的JavaSctipe必须位于head中,可以考虑使用jQuery的$(document).ready这样你的脚本可以等到DOM加载完毕后再执行。

5. JS应该实时的Linted

Linting遵循代码风格、发现错别字、有助于避免错误。有很多这样的工具,我建议使用ESLint。你可以使用Gulp的gulp-eslint来运行它。Gulp可以查看你所有的JS文件,并在你每次保存的时候运行linter。另外,值得注意的是,你需要把你JS代码放在单独的.js文件中才能运行linter。

6. JS应该有自动化测试

在过去的几年中,我们知道了测试的重要性。但它在很大程度上忽略了在JavaScript,直到最近才被重视。现在典型的JavaScript应用需要测试的部分远比你实际手动测试的要多得多。使用JavaScript处理这么多的逻辑,关键的是具有自动化测试。

怎么实现自动化测试呢?可以使用相关工具,比如:Selenium自动化集成测试。然而,集成测试往往是脆弱的,所以我建议专注于自动化单元测试。自动化单元测试有多种选择。如果你是新手,我建议你使用Jasmine,而如果你想要终极配置,可以使用Mocha with Chai。

7. JS需要封装

全局变量是有风险的,因此,我们需要对js进行一些封装,具体实现如下:

ImmediatelyInvoked Function Expressions (aka IIFE)

RevealingModules

AMD (typicallyvia RequireJS )

CommonJS (usedby Node.js , use in browser via Browserify or Webpack )

ES6 modules

需要提醒大家的是,ES6模块现在在浏览器中还不能很好的支持,但你可以用Babel来使用它。

如果不想transpile,CommonJS可能是最佳的选择。由于Node使用的CommonJS模式,所以你可以使用npm来下载数千个包。CommonJS不能在浏览器中运行,所以你可能需要Browserify,Webpack , or JSPM .

8. JS依赖应当明确

Js封装后,怎么引用其他模块呢?这时候就需要在文件顶部指定依赖,就像Java或C#那样一句声明:

//CommonJS

var react =require('react');

//ES6 Modules

import React

from 'React'

9. Transpile toJS

6月发布的最新版JavaScript,EcmaScript 2015 (ES6)现目前浏览器还不能很好的支持它的很多特性,但没关系,我们可以用Babel来体验它的新特性。Babel把ES6 transpile到ES5,如果你能忍受这么做,你现在就可以享受ES6的新特性。JavaScript预计一年发布一次的新版本了,所以你可能一直需要transpiling。

10. JS应该自动构建

前面几条建议中,我们提到了linting、压缩、transpilation和测试。但如何才能让这一切自动发生?很简单:使用自动构建。Gulp就是这样一个结合了所有功能的工具。不过你也可以选择Grunt和Webpack。或者如果你是一个高手,你也可以使用npm来构建。问题的关键是,不要指望人记得手动运行这些东西的,自动化是一个非常棒的选择。

11.使用框架或者库

做软件开发我们就要懂得合理利用现有资源,拿一些现成的东西来用。想保持轻量级?试试Backbone或Knockout。或者jQuery就够了。想要更多更全功能的?试试Angular,Ember ,,或者React with Flux。不要试图从头开始。站在巨人的肩膀上。不管你选择哪个框架,都应该分开你的关注,这就是下一条要分享给大家的建议。

12. JS ShouldSeparate Concerns

把JS代码放到一个文件中的习惯很容易养成,或者盲目跟从你框架的意见。当你移动到客户端的时候,不要忘记你在服务器端学到的经验教训。

这里并不仅仅意味着就像你在Angular和Knockout等MVC框架中那样分离模型、视图、控制器。编写JavaScript的时候应该像服务器端开发者那样思考问题。把你的业务逻辑和数据访问分离出来。

AJAX调用都应该在一个地方。创建一个集中的客户端“数据访问层”。业务逻辑模块应包含纯JavaScript的。这使得逻辑易于重用,易于测试,升级也不受影响。

以上就是JavaScript使用中需要注意的12条建议,按照建议处理你的js代码,相信你能写出让人更惊叹的代码,功能的实现也更事半功倍。


相关文章推荐

JavaScript学习的12条建议

不管是前端开发技术还是后端开发技术,在学习中,我们或多或少都会接触到JavaScript。因此,JavaScript正在成长为开发人员必学的编程语言之一。但互联网技术更新迭代如此快的今天,我们如何才能...

给喜欢计算机的学弟学妹们的12条建议

给喜欢计算机的学弟学妹们的12条建议  本人目前大三,电子信息工程。大三下学期了,身边的同学们或准备考研,或认真上课准备再拿奖学金,或破罐子破摔依旧沉溺网游。而我在这个时候多少有一点犹豫,在我面前的是...
  • wy_ei
  • wy_ei
  • 2015-03-14 08:48
  • 477

一些关于javascript、jQuery使用时的建议

最新地址请访问:http://leeyee.github.io/blog/2011/04/09/javascript-jquery-user-suggests 1、在遍历数组时缓存长度      ...
  • oxcow
  • oxcow
  • 2011-04-09 11:53
  • 1723

容器使用的12条军规——《Effective+STL中文版》试读

容器使用的12条军规——《Effective+STL中文版》试读     还记的自己早年在学校学习c++的时候,老师根本就没有讲STL,导致了自己后来跟人说 起会C++的时候总是被鄙视,后来就下定决...

2015总结(本次个人总结凌乱,只为个人口述打草稿,不建议大家阅读)

成果: 1、投资系统         (1)理解java的ssh框架的真正原理 (2)从开源系统ppm中分理处文件管理系统,并集成到投资系统中,实现界面良好的表达,在文件管理系统中设计权限管理    ...

Javascript 最佳实践 10 条建议

初级开发人员维护自己开发的产品可能也会是一个噩梦,比如我。过年前写的一个产品因为数据不全的问题一直没有上线,昨天数据库的搞定了,要准备上线了,需要我这边改一下功能,我喵了一眼JS,发现其中一个 dra...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)