web前端工作五年了，我来告诉你如何系统的学习现在的JavaScript

一、入门

1：熟悉DIV+CSS布局

使用DIV+CSS布局标准网页，可以使前端XHTML代码更少、结构更清晰，这有利于轻松用JavaScript操作DOM

比如，要展示一个3行3列的列表，如果用传统的表格布局，现在要你用JavaScript动态生成这个列表，那么就需要一个循环嵌套

如果采用li结构加CSS浮动布局，一次循环就好了。当然，WEB标准化不是一定不能使用表格，我的意思是结构清晰的XHTML更易于把JavaScript效果或功能整合到项目中。

2：掌握几种开发测试工具

作为一个开发人员，熟悉测试工具是必须的，这有助于提高你发现问题和解决问题的效率，对于特别大的项目更是如此。JavaScript学我推荐用Hbuilder

3.熟悉JavaScript每一个方法的作用

这一要求听起来似乎有点不太实际，我想这个要求对于像C#、JAVA这些大型语言来说确实是，因为这些语言类库实在太庞大了，相信没有人可以全面记住它，而且也是没有必要全部记住，比如用JAVA做网页与手机开发所关注的类库是不一样的。

而JavaScript则不是，它的内置方法函数真的不多，先全面熟悉一下，开发起来也将得心应手，而大部分方法都是JavaSCript框架中用其基本的函数实现的。

比如trim()这个很多语言都有的去行头行尾空格的方法，就是在jQuery中实现的。

再比如，如果你是从其它比较强大的语言转过来玩JavaScript，你又可能认为JavaScript应该有MD5加密的方法，当然这也是没有的，但有人用JavaScript实现了这样的方法，即JavaScript MD5。说到底JavaScript内置方法少的可怜，但很多牛人写了一些新方法增加JavaScript功能，比如prototype框架主要是对JavaScript基础函数进行原型扩展的。

4.了解DOM编程

了解DOM编程算是学习JavaScript过程必须掌握，且比较重要的课程，因为JavaScript除了编写一些纯数据处理的逻辑外，更多的是在动态更改XHTML的结构和内容，以达到界面动态更新的目的，而这些工作都要依赖DOM编程。jQuery框架在这方面封装的相当好，提供了丰富的DOM操作方法，可以让你轻松找到页面任何地方的一个DOM节点（XHTML标签），然后进行相关操作（增、删、改、查）。对于有过用其它语言操作XML文档经验的朋友，相信这一块很快上手。

5.接触并使用AJAX

Ajax的优点就是异步交互

AJAX对于用户以及服务器来说都是有好处的，对于用户，提供更好的用户体验，最典型的一个应用场景：注册页面的用户名可用性预检测，传统的可能会遇到这样的问题：用户填写了一堆资料后提交表单，结果被服务器告知这个用户被注册了，要用户重新填写资料注册，这对于大型多用户网站那是很致命的，因为用户输10个用户名可能有一半已被使用了。对于服务器来说，减少网页流量，因为AJAX后，一般是按需加载数据的，不会因为局部更新而重新加载整个页面。比如一个网页占三屏高，我们可以默认只加载第一屏的内容，当用户拉动滚动条往下的时候，再加载二三屏的内容。另外像WEB在线地图应用也是AJAX使用的典范。

二、提高

1. 深入理解JavaScript this关键字

JavaScript this的作用与指向跟很多真正面向对象的开发语言是有很大差别的，它不始终指向当前对象，是会变化的。如果不注意这个问题，就有可能遇到看似没错的代码报错或不执行等问题。

2.学习JavaScript OOP编程

OOP是个好东西，它使程序员思考问题更有组织性，代码的组织也更清晰。JavaScript 也可以OOP，但与一些传统的OOP语言同样存在较大差别，所以要真正用熟JavaScript OOP也是需要下点功夫的。

3.了解闭包

JavaScript闭包也是被谈得比较多的一个话题，闭包使JavaScript变量作用域变得复杂起来，但这一特性又使这门语言变的更灵活了。

4.学习规范开发

团队精神相信大家是听过不少了，就职一个公司做开发，当然离不开团队，团队要想合作愉快，每个成员的编码必需符合一定规范，这也是每个公司对程序员的基本要求。关于规范通常指变量命名、文件组织、注释规范等，这方面知识与其它语言的规范是有相通性的。

5.找本算法的书读一读

我认为学会并使用一门语言并不是什么难事，难的应该是用语言这基本的语法与语句去解决一些复杂的问题。要解决一些复杂的问题，可能会用上一些算法，有些算法实现可能是一个团队在做的，比如中科院中文分词的具体实现，另外像游戏常用自动寻径A*算法等。也许你认为你不可能在JavaScript开发上遇到这么复杂的问题，其实这还要看你在做什么项目，如果你是在开发大型网页游戏，通常面临更多具有挑战性的难题，如果你有读过一些算法书籍，了解一些常见问题的解决方法，在开发过程中自然会如虎添翼。另外，熟悉算法显然对于你日后接触其它开发语言也是有帮助的。

三、习惯

1. 兼容、BUG问题做好笔记

CSS与JavaScript浏览器兼容问题最好做好笔记，因为这些问题，或者说BUG是比较诡异的，这些问题浏览器不会提示你错在哪里，IDE也不会提示你，特别是CSS兼容问题，这就会导致你在开发过程碰到这样的问题会卡老半天得不到解决。即使之前解决过同类问题，以后可能又会碰上，结果之前没有做好笔记加强记忆，注定你要再受罪一次，因为这些兼容问题不是一两个，临时记忆效果是不明显的。以我经验，很多问题是在IE6下发生的，现在IE6连微软自己都希望加速它灭亡，这对于前端开发的我们来说当然是一个好消息。

2.阅读优秀的代码，比如jQuery

阅读优秀代码绝对也是自我提高的好方法，这不仅可以了解优秀代码的组织规范，更可以了解一些功能的实现思路。比如jQuery就是一个非常值的学习的JavaScript框架。当然了，要阅读这样专业的JavaScript框架，JavaScript基础要扎实，不然看的过程中会遇到太多疑问，甚至对自己的信心也是一种打击。

注意

1. 在JavaScript入门之前避免直接使用JavaScript框架做开发

如果你没有任何JavaScript基础，请不要直接使用JavaScript框架做开发，我认为这可能会误导你对一门语言的认识，比如你直接使用了jQuery用点连起来的语句写法，你是否会认为这是JavaScript语法的一种呢？再比如你使了prototype你不要把框架扩展后的基类方法认为是JavaScript内置的。我认为JavaScript框架是用来提高效率的，它绝对不是JavaScript入门应该学习的。

2.网上找的很多例子可能不是跨浏览器兼容的

有很多JavaScript效果源码是N年前某网友写的，N年前是IE的天下，于是一些前端懒得解决脚本跨浏览器兼容问题，使写出来的脚本只适用于IE。当你得到这样的一段代码，请不要说垃圾，也不要为此发牢骚，因为这些代码并不是没有一点价值的，如果你了解JavaScript跨浏览器兼容问题，相信你可以很轻松通过少需修改使代码有更好的兼容性。

web前端/H5/javascript学习群：250777811

欢迎大家关注我的微信号公众号，公众号名称：web前端EDU。扫下面的二维码或者收藏下面的二维码关注吧（长按下面的二维码图片、并选择识别图中的二维码）