为什么学Javascript？

简介

JavaScript（简称“JS”）是一种具有函数优先的轻量级、解释型或即时编译型的编程语言，也是当前Web前端工程师学习的主要内容。JavaScript可以实现页面的效果切换、动画效果、页面游戏等效果。javascript因为兼容于ECMA标准，因此也称为ECMAScript
然而JavaScript承担了更多的责任。尤其是当Ajax技术兴起之后，网站的用户体验又得到了更大的提升。

例如，当人们在百度的搜索框中输入几个字以后，网页会智能感知用户接下来要搜索的内容，出现一个下拉菜单，这个效果的实现离不开JavaScript。另外，JavaScript的用途已经不仅局限于浏览器了，Node.js的出现使得开发人员能够在服务器端编写JavaScript代码，使得JavaScript的应用更加广泛

开发需求

从开发需求来讲，前端开发是创建Web页面、APP、小程序等前端页面呈现给用户的过程,通过HTML、CSS及JavaScript以及衍生出来的各种技术、框架、解决方案，来实现互联网产品的用户界面交互。

优势

从优势来讲，JavaScript 可以运行在所有主流平台的所有浏览器上，也可运行在每一个主流操作系统的服务器端上。现如今我们在为网站写任何一个主要功能的时候都需要有懂能够用 JavaScript 写前端的开发人员。

日常用途

从日常用途方面，JavaScript的用途可归纳为一下几个方面：

  • 1、嵌入动态文本与HTML页面；
  • 2、对浏览器时间做出相应；
  • 3、读写HTML元素；
  • 4、在数据被提交到服务器之前验证数据；
  • 5、检测访客的浏览器信息；
  • 6、控制cookies，包括创建和修改等；
  • 7、基于node.js技术进行服务器端编程。

为什么选前端？

专业课程

在大学期间，学的是教育技术专业，但是学校开设的课程非常多，但是课程都比较老旧，尤其是编程这块内容。数据库就学了1种，还是几乎都不去怎么用的 Visual Fox。每一门课程也就一个学期，都是浅尝辄止，当时非常不理解这样开课的目的，后来渐渐就理解了，毕竟是学校，教书育人的地方，每个学生的兴趣可能不一样，例如你喜欢前端，他喜欢后端，你喜欢编程，他喜欢教学；众口难调，所以开这么多门课程，主要是为了让学生都能从中找到自己感兴趣的事情，然后自己花时间去学习。

我当时就比较糊涂，学的比较均衡，主要也是想在提高一下自己，所以什么都会，又什么都不会，还好当时对于前端比较感兴趣，也是花了点时间在这上面，所以这方面学的还是可以的。

实际需要

言归正传，谈回JS，对于想要做前端的同学来说，我们都知道，JS是我们必不可少的一门技能，JS学不好，工作不好找，我很多同学就是没学好JS，当初找前端工作没人要，最后只能做做运维的工作或者转行做其他的工作。

我做的都是 Web开发 和小程序开发，前端后端都要自己做，在学习期间，才发现不会JS有多难，因为很多时候都是基于别人的平台做二次开发，而且基本都是以JS为主的，所以也是花大量时间去学习JS，其实讲真的，如果把一门语言学深了，再学其他的相对来说就会简单些。

随着JavaScript的日渐成熟，以及Node.js方案变得越来越可行，如今市场对JS程序员的需求正在持续增长。JavaScript在需求比例上已经超过了C#，仅屈居于Java之下。如果你看看GitHub上可行的项目，你会发现JavaScript出现得越来越多，甚至领先于Java和C#，已经成为编程语言排行版第一。最后，再看看StackOverflow，你会发现JavaScript也处于顶层活跃中。

HTML5其实就是JavaScript

我不知道已经说过多少次了，HTML5 实际上并没有多少与HTML有关，它其实就是JavaScript。HTML本身有什么变化？不过一些新标签而已，况且也都很好理解。

HTML5的威力在于让你能用 JavaScript 来创建这些标签。假如没有后台代码通过Canvas来创建动画、游戏，或者通过它来实现一些数据的可视化，这个标签也没有大用处。从浏览器开始支持 Canvas 开始，我已经看到了Asteroids（行星游戏）的上百个实现，那都是开发人员为熟悉这个新特性所做的练习。有的比较粗糙一些，而有的则极其精美。这些完全都要归功于JavaScript。

由此可见，HTML5并不是在以尖括号为特征的标签语言的一次大的改进，其实质是赋予了JavaScript更强大的能力。

WebGL库（当前还羽翼未丰）支持在HTML5的画布中绘制实时的3D图形。HTML5的地理位置支持在浏览器中实现LBS（Location Based Service）应用——手机的基本配置。而持久存储以及离线功能则为开发能与桌面应用媲美，但却在浏览器中运行的全功能应用奠定了基础。目前，就连增加多点触摸事件的实验性的库也已经出现了。凡此种种，无一不是实实在在的JavaScript特性。HTML5只是为这些高级功能的发挥提供了舞台。

退一步讲，不依赖于HTML5的浏览器库开发库也取得了长足的进步。长久以来，JavaScript一直都是在HTML中实现动态效果的不二之选。可两个问题迟迟得不到解决：

  • 一是浏览器兼容性问题，

  • 二是直接操作DOM太麻烦。

jQuery让这两个问题霎那间消失得无影无踪，这个库已经成为现代基于浏览器的客户端开发的基本配置。不过，并非只有jQuery。Protovis、D3，都可以让你直接在浏览器中创建复杂的交互性数据可视化效果，有史以来第一次让浏览器成为了展示数据的一个重要工具。

JavaScript与数据库，编译器与语言

就连数据库里都开始广泛使用JavaScript了！当前如火如荼的NoSQL运行的三只领头羊：CouchDB、MongoDB和Riak，都是“文档数据库”。它们保存的不是表，而是文档。这几个数据库所谓的“文档”，其实就是JSON文档，而不是Word或Excel。（Riak除了JSON文档，还支持XML和纯文本。）

JSON已经成为一种被广泛采用的数据交换格式（所有现代的编程语言几乎全都有解析JSON的库），不过请注意，JSON实际上不就是一种序列化JavaScript对象的格式嘛！因此，虽然你可以在任何语言中使用JSON，但在JavaScript开发中使用它则是再自然不过的事了。况且，JSON这个格式成为一种跨语言的标准，而不是Python、Ruby或Java等语言的序列化格式，这个事实本身足以说明JavaScript将在更加广阔的舞台上大显身手。还不仅仅如此，上述三个数据库都内置了支持JavaScript查询的能力。未来几年，更多的人都将会惊讶地发现，JavaScript和JSON已经内置到了其他应用程序里啦！

深入学习JavaScript

为什么要深入学JavaScript，这个问题可以替换成任何一门语言。学的越深其实你工作起来越简单，假设中国13亿人5亿程序员，那么这5亿程序员都会有一个共同的梦想“迎娶白富美，出任CTO，走上人生巅峰”。以前或许你只需要写几个简单的特效，几个动画，简单的业务逻辑就觉得不错了，只要会用就行，为什么还要学习那么深入呢，因为实际编程当中不会有那么多条条框框的理论，任何技术都需要去革新。

最简单的开发环境

我相信人们进入编程最大的障碍实际上是编写代码相关的所有其它方面的东东。你能够更快地编写代码（至少在你开始学习的时候），在我看来就是一个胜利。每个人都可以访问Web浏览器，这意味着每个人现在也能访问一个简单的开发环境了。如果你在使用Mac下的Chrome，按快捷键cmd-opt-j。就来到了控制台，现在你就可以开始编写JavaScript并管理你看到的网页了。真不错。还有大量的在线编辑器和工具，比如CodePen，JSFiddle，让你在浏览器搭建更为完整的开发/测试/原型环境。

简单

当你开始的时候，JavaScript让编写代码变得真正容易，这是非常有效的。定义一个函数，调用它。写个循环。忽略DOM（事实上，也差不多完全忽略了web），只关心简单的逻辑和代码。开始建立对象和数组。JS里的OO模型稍微有些奇怪（特别是对于类和继承），不过还好，你需要灵活些，不管怎样，如果你想成为开发人员的话。一旦你掌握了基础，你就可以更为深入，并发现JavaScript的所有力量。

灵活

之前讨论的另外一个方面有，JavaScript也是超级灵活的（论证也是如此）。一旦你能够从直接嵌在网页里的Sctipt标签里的一些函数，并控制一个图片或菜单，那么很快你就能够继续带有很多文件、较庞大的对象/类形式的结构，复杂的单页应用程序以及整个更加复杂的、完整架构的web应用程序。既然它与DOM和浏览器结合如此紧密，那么JavaScript实际上更好地扩展来迎接更大的挑战，可以完美地匹配web应用程序。

网络原生

足够多的有天赋的移动app开发者让你相信，app是未来，我仍然认为开放的web技术才是未来的关键。给它一些时间，我们差不多用HTML/JS写出所有的移动app，并把打包好的app部署到手机上。我认为这基本上是不可避免的。学习web方面的开发是至关重要的。不管你在工作上主要用什么语言，你都需要基本地了解它，因为不管我们如何努力，你最终还是在操作CSS、调整一些HTML标签等。那不会立即就销声匿迹，我不这样认为。

不可避免

几乎是到了最后，不过主要由于思想进化而部署其它方面。实际上我把这是做你为什么要学习JavaScript的真正的重要原因。下面是权衡——如果你开发web方面的东西，那么你到最后是在编写JavaScript。这无可避免。你可以用服务器端语言（PHP，Python，Ruby）来做。有时候，负载会传递到浏览器，如果你想在远端做些有意思的东西，你将不得不使用JavaScript。因此，如果你不得不学习，为什么不能优化这个过程呢（或许在更多地方使用JS，而不是更少）。

轻便（浏览器、服务器、原生）

由于我们具有了Node.js之类的东东，JavaScript已经超越了浏览器。你不仅可以写服务器端JS（因此你可以用JS开发前后端web应用程序），而且还可以使用node-webkit之类的东西打包成可分发的桌面应用程序，或者使用PhoneGap为任意平台打包成移动app。现在还没有其它语言能够有如此轻便。

工具链

如果上面那些原因还不够的话，就开发者工具链而言，激增的JavaScript社区在接下来的数年里，还有一条真正的长路要走。我们或许没有像Mac开发者使用的Xcode那样集成的、一站式方式，但是我们有Grunt和Gulp之类的工具，可以建立自己的资源流水线。人们熟知的每个代码编辑器都支持JavaScript语法高亮和提示，我们不需要像其他语言的build过程，因此我们可以更加从容.还有一堆测试工具；从单元测试到功能测试，完全模拟了使用浏览器的用户。

JavaScript 常用技术栈

前端的框架分两类，UI 样式库和 JS 库。有些 UI 样式为了实现动态效果，会使用 JS 库如 jQuery 。

前端开发的编程工作JS为主，还有近几年出的TypeScript（JS的超集）。奇怪的是，最近各官网下载的开发包里都不带jQuery库。

UI样式库

前端框架中有很大一部分是UI样式库。这些样式库的关注点是视图。对于纠结（患有强迫症）的开发者，不建议使用UI样式框架，真的是哪哪都看着不爽，到最后还不如自己css造轮子来的爽快。自己css造，不一定好看，但可以满足强迫症。

Bootstrap

我认为Bootstrap是一个非常好的入门选择，教程示例非常丰富，颜值也还过得去。

栅格布局自带响应式，常用的颜色都有类可以直接调用。

Bootstrap中文网：http://www.bootcss.com/

Layui

和Bootstrap差不多的东西，个人感觉色系看起来稍显寡淡。

Layui官网：https://www.layui.com

Font Awesome

图标字体库和CSS框架，毕竟只有图标字体和CSS，所以一般配合其他的样式框架使用。

Font Awesome官网：http://fontawesome.dashgame.com/

前端框架库：

Node.Js

地址：http://www.runoob.com/nodejs/nodejs-tutorial.html (中文网)

描述：Node.js是一个Javascript运行环境(runtime)。实际上它是对Google V8引擎进行了封装。V8引 擎执行Javascript的速度非常快，性能非常好。Node.js对一些特殊用例进行了优化，提供了替代的API，使得V8在非浏览器环境下运行得更好。

Node.js是一个基于Chrome JavaScript运行时建立的平台，用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动，非阻塞 I/O 模型而得以轻量和高效，非常适合在分布式设备上运行数据密集型的实时应用。

简单的说 node.js 就是运行在服务端的 JavaScript。

Node.js 是一个基于Chrome javascript 运行时建立的一个平台。

Node.js是一个事件驱动I/O服务端JavaScript环境，基于Google的V8引擎，V8引擎执行Javascript的速度非常快，性能非常好。

用途：

  1. RESTful API（目前比较流行的接口开发风格）

这是NodeJS最理想的应用场景，可以处理数万条连接，本身没有太多的逻辑，只需要请求API，组织数据进行返回即可。它本质上只是从某个数据库中查找一些值并将它们组成一个响应。由于响应是少量文本，入站请求也是少量的文本，因此流量不高，一台机器甚至也可以处理最繁忙的公司的API需求。

  1. 统一Web应用的UI层

　　目前MVC的架构，在某种意义上来说，Web开发有两个UI层，一个是在浏览器里面我们最终看到的，另一个在server端，负责生成和拼接页面。

不讨论这种架构是好是坏，但是有另外一种实践，面向服务的架构，更好的做前后端的依赖分离。如果所有的关键业务逻辑都封装成REST调用，就意味着在上层只需要考虑如何用这些REST接口构建具体的应用。那些后端程序员们根本不操心具体数据是如何从一个页面传递到另一个页面的，他们也不用管用户数据更新是通过Ajax异步获取的还是通过刷新页面。

  1. 大量Ajax请求的应用

例如个性化应用，每个用户看到的页面都不一样，缓存失效，需要在页面加载的时候发起Ajax请求，NodeJS能响应大量的并发请求。总而言之，NodeJS适合运用在高并发、I/O密集、少量业务逻辑的场景。

angular.Js（比较厉害，github排名也比较高）

地址：http://www.runoob.com/angularjs/angularjs-tutorial.html (中文网)

描述：AngularJS诞生于2009年，由Misko Hevery 等人创建，后为Google所收购。是一款优秀的前端JS框架，已经被用于Google的多款产品当中。AngularJS有着诸多特性，最为核心的是：MVVM、模块化、自动化双向数据绑定、语义化标签、依赖注入等等。

用途：通过描述我们应该就能很好的明白AngularJS的真实用途了，MVVM，模块化，自动化双向数据绑定等等。除了简单的dom操作外，更能体现Js编程的强大。当然应用应该视场合而定。

它的出现比较早，也是曾经比较流行的前端js框架，但是今年来随着reactJS与VueJS的出现，它的热度在慢慢降低。

JQuery Mobile

地址：http://www.w3school.com.cn/jquerymobile/ (中文网)

描述：Query Mobile是jQuery 在手机上和平板设备上的版本。jQuery Mobile 不仅会给主流移动平台带来jQuery核心库，而且会发布一个完整统一的jQuery移动UI框架。支持全球主流的移动平台。jQuery Mobile开发团队说：能开发这个项目，我们非常兴奋。移动Web太需要一个跨浏览器的框架，让开发人员开发出真正的移动Web网站。

用途：

  • jQuery Mobile 是创建移动 web 应用程序的框架。

  • jQuery Mobile 适用于所有流行的智能手机和平板电脑。

  • jquery Mobile 使用 HTML5 和 CSS3 通过尽可能少的脚本对页面进行布局。

requirejs

地址：http://www.requirejs.cn/

描述：RequireJS的目标是鼓励代码的模块化，它使用了不同于传统 <script> 标签的脚本加载步骤。可以用它来加速、优化代码，但其主要目的还是为了代码的模块化。它鼓励在使用脚本时以module ID替代URL地址。

RequireJS以一个相对于baseUrl的地址来加载所有的代码。 页面顶层<script>标签含有一个特殊的属性data-main，require.js使用它来启动脚本加载过程，而baseUrl一般设置到与该属性相一致的目录。

用途：模块化动态加载。

Vue.js(目前市场上的主流)

地址：http://cn.vuejs.org/

描述：Vue.js 是用于构建交互式的 Web 界面的库。它提供了 MVVM 数据绑定和一个可组合的组件系统，具有简单、灵活的 API。

从技术上讲， Vue.js 集中在MVVM 模式上的视图模型层，并通过双向数据绑定连接视图和模型。实际的 DOM 操作和输出格式被抽象出来成指令和过滤器。相比其它的 MVVM 框架，Vue.js 更容易上手。

目前市场上比较流行的前后端分离的开发模式，大多前端都是vueJS做的，具体的优点请大家看官方文档。

backbone.js

地址：http://www.css88.com/doc/backbone/

描述：Backbone 为复杂Javascript应用程序提供模型(models)、集合(collections)、视图(views)的结构。其中模型用于绑定键值数据和自定义事件；集合附有可枚举函数的丰富API；视图可以声明事件处理函数，并通过RESTful JSON接口连接到应用程序。

React.js（gihub排名仅次于vue.js）

地址：http://reactjs.cn/react/docs/why-react.html

描述：React 是一个 Facebook 和 Instagram 用来创建用户界面的 JavaScript 库。很多人认为 React 是 MVC 中的 V（视图）。我们创造 React 是为了解决一个问题：构建随着时间数据不断变化的大规模应用程序。为了达到这个目标，React 采用下面两个主要的思想。

Amaze UI

Amaze UI是轻量级的前端应用框架，是国内比较流行的框架，比较适用于移动端响应式开发框架，可以按照项目要求生成专属的UI框架库进行使用，组件非常丰富，可以构建出漂亮的web页面。

官网地址：http://amazeui.org/

可视化组件

Echarts

地址：http://echarts.baidu.com/

描述：ECharts，一个纯 Javascript 的图表库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等），底层依赖轻量级的 Canvas 类库ZRender，提供直观，生动，可交互，可高度个性化定制的数据可视化图表。

tableau(收费)

地址：http://www.yuandingit.com/special/tableau/index.html

描述：Tableau 是桌面系统中最简单的商业智能工具软件，Tableau 没有强迫用户编写自定义代码，新的控制台也可完全自定义配置。在控制台上，不仅能够监测信息，而且还提供完整的分析能力。Tableau控制台灵活，具有高度的动态性。

总结

在任何一个领域，JavaScript都不是最佳语言。JavaScript的优势在于它的多功能性。它来自开放式的社区，它采用了这种无分类、多态的脚本语言，并将其转变为当今最强大的开发生态系统。

创新工场首席布道师 蔡学镛曾说过：

如果你是一个在校生，希望以后进入IT行业，但没有明确的目标以后要做什么技术领域，那么我会建议你把时间花在JavaScript以及相关框架上。这是目前 “性价比” 最高的技术。 性 ＝用途广泛性（跨前后端与各种平台），价 ＝学习的代价（耗费时间与难易程度）。