javascript忍者秘籍（第二版）翻译学习 第一章 JavaScript无处不在

前言废话（立flag）

《javascript忍者秘籍第二版》这本书听说是JQUERY之父写的，emmm，确定值得我这种菜狗来学习膜拜，因此打算花时间来把这本书通读记录一便，由于是看的英文版（由于贫穷，因此只好看看英文版的，英文版的免费，因此只好自食其力）因此翻译不当之处烦请指正（我通通接受！)

书籍传送门(须要的自取)

连接：pan.baidu.com/s/1xF3SVjOP… 提取码：847o 复制这段内容后打开百度网盘手机App，操做更方便哦

第一章 JavaScript is everywhere

这章包括三个部分

1. JavaScript的核心语言功能
2. JavaScript引擎的核心项
3. 三个JavaScript开发的最佳实践

1.1 理解JavaScript语言

不少人以前可能用过C++，java等语言，因此会觉得JavaScript会也和他们同样，可是其实根本上有很大的不一样，与其余语言相比，JavaScript功能上更面向对象。这些不一样包括：

• 函数是一流对象 在JavaScript中，函数也是对象，而且可以和其余对象共存。函数对象能够经过字面量来建立，能够经过变量来引用，能够做为一个函数参数来传递，甚至能够做为函数返回值来返回。咱们会花费三章来探索函数做为一流的对象在JavaScript代码中带给咱们的好处。
• 函数闭包

函数闭包的概念其实不少人对他不是很理解，但也没法阻止他成为JavaScript中很重要的一个概念。如今，你只须要知道当闭包就是可以读取其余函数内部变量的函数。若是你如今还没看到闭包的好处，表怕。咱们会在第五章中详细解释，咱们也会在第三章和第四章中深刻了解函数。

• 做用域

直到最近，JavaScript都没有块级变量的概念（像C语言），为了实现这个功能，咱们只能用全局变量和函数级别的变量来代替。

• 基于原型的面向对象

就是JavaScript不能像主流函数来实现面向对象，因此只能使用原型（prototype）来实现这一功能。因此咱们以后会深刻研究原型，基于原型的面向对象是如何工做的以及他在JavaScript中的实现方法

JavaScript是由对象，原型，函数和闭包相辅相成的。理解这些概念，才能最大限度的提升JavaScript编程能力。同时，为了接下去阅读的顺畅，须要理解如下一些概念(ES6)：

传送门 es6.ruanyifeng.com/

1. generate
2. promises
3. proxies
4. arrary新增的方法
5. maps
6. 正则表达式
7. modules
8. class
9. asyn await
10. for... of
11. .....

1.1.1 JavaScript会如何发展

原文就是说ECMAScript委员会每一年作一些小的修改，本书会同时研究ES6和ES7的特性，你能够关注如下网址来关注更新动态

kangax.github.io/compat-tabl…

kangax.github.io/compat-tabl…

kangax.github.io/compat-tabl…

1.1.2 编译器让咱们可以访问明天的JavaScript

原文就是说 学会使用Babel来支持编译ES6/7，在本书中可使用Babel来调试代码

1.2 理解浏览器

如今的JavaScript能在不少环境中运行，可是最初的运行环境是浏览器，其余运行环境也是借鉴于浏览器环境。本书将专一与浏览器环境。

如图，node和浏览器运行环境存在差别，咱们将主要集中精力放在DOM，events，timer,和浏览器api上

• dom （文档对象模型） DOM 是Web应用的结构化的UI表现形式，至少最初由Web应用的HTML代码构成。为开发大型应用，你不只须要深刻理解JavaScript 的核心机制，还要学习 DOM 是如何构成的（第2章）以及如何书写有效的DOM操做代码（第12章）。你将学会如何创造高级的、动态的UI
• events（事件）大部分JavaScript应用都是事件驱动的应用，这表示大部分代码执行在对某个特殊事件响应的上下文中。这样的事件例如网络事件、计时器、用户生成事件例如点击、鼠标移动、键盘按压事件等。所以，第13章中咱们将完整探索事件机制。咱们特别关注计时器，计时器一般像个谜团同样，但它能帮咱们处理复杂编码任务：例如长期执行的计算和流畅的动画。
• 浏览器api 帮助咱们与世界交互，浏览器提供获取设备的信息、存储本地数据或与远程浏览器交互的API。本书咱们会探索其中的一些API。 完善编程技能并对浏览器提供的API有深刻理解能让你走得更远。可是早晚，你将会遇到浏览器的不一致性等问题。在完美的世界中，全部浏览器都应该没有缺陷，应该都能以一致的方式支持Web标准。然而咱们的现实世界并不完美。

近来浏览器的质量已经大大提升了，但咱们仍然须要面对一些缺陷：例如缺失的API、某个浏览器的奇怪问题。针对浏览器的这些问题开发出一种易于理解的机制，并搞清楚它们的差别和宽松模式，这与精通JavaScript几乎同等重要。

当咱们开发浏览器应用或JavaScript库时，选择支持哪一个浏览器是很值得深思熟虑的。咱们但愿所有支持，但受限于开发测试资源要求或其余要求。所以在第14章中，咱们将完全地探索跨浏览器开发的策略。

开发高效的跨浏览器代码显著依赖于开发者的经验和技巧。本书旨在提升开发者技能水平，因此让咱们经过当前的最佳实践来开始学习吧。

1.3 使用当前的最佳实践

精通JavaScript语言和掌握跨浏览器代码问题对于专家级Web应用开发者来讲是重要课题，但它们不是整个蓝图。若想进入整个联盟，你还须要展现出一些已经被大量先前开发者所证实可以开发出高质量代码的特质。这些特质被称为最佳实践，因此你除了精通JavaScript语言之外，还须要具备如下特质：

• 调试技巧
• 测试
• 性能分析

在编程中把这些技能有效结合在一块儿很是重要，本书会使用它们。接下来看看这些技巧。

1.3.1 调试

之前，调试JavaScript代码意味着使用alert来验证变量的值。好在，因为Firefox浏览器的开发者扩展Firebug的流行，因此调试JavaScript代码的能力大大加强了。全部主流浏览器的相似工具也都被开发出来：

• Firebug——开发者扩展工具Firefox的流行成为调试工具的开端；
• Chrome DevTools——由Chrome 团队开发，并应用在了 Chrome 和 Opera浏览器中；
• Firefox开发者工具——包含在Firefox中的工具，由Firefox 团队开发；
• F12 开发者工具——Internet Explorer 浏览器 及微软 Edge浏览器中包含的调试工具；
• WebKit 检视器——Safari中包含的调试工具。 如你所见，主流浏览器都为开发者提供了调试Web应用程序的工具。使用alert来调试JavaScript代码的日子一去不复返了！全部这些工具都有着相似于Firebug最初引入的概念，故而它们都提供着类似的功能：探索DOM、调试JavaScript、编辑CSS样式和跟踪网络事件等。其中的每样工具都作得很棒。你既可使用你本身选择的浏览器所提供的调试工具，也可使用你发现缺陷时所用的浏览器调试工具。

除此以外，你也可使用其中的几个工具，例如用Chrome开发者工具来调试其余类型的应用，例如 Node.js应用（在附录B中，咱们会向你介绍一些调试技术）。

1.3.2 测试

在本书中，咱们会使用一些测试技术来确保示例代码按预期执行，同时这些测试技术也用于展现通常状况下如何测试代码。咱们用于测试的主要工具是一个断言函数，其目的在于判定某个假设是真值仍是假值。

该函数的通常形式以下所示：

assert(condition, message);
复制代码

第一个参数是一个应为真值的条件，第二个参数是当断言为假时所展现的一句话。JS默认时没有这个方法的，只能本身实现或者用其余方法检验，不必定要用这个，给个思路以下

function assert(condition, message) {
    if (!condition) {
        message = message || "Assertion failed";
        if (typeof Error !== "undefined") {
            throw new Error(message);
        }
        throw message; // Fallback
    }
}
复制代码

例如：

assert（a === 1, "Disaster! a is not 1!"）;
复制代码

若是变量的值不等于1，则断言失败，而后那段有点儿戏剧性的消息就会被展现出来。

断言函数并非JavaScript的标准特性，因此咱们在附录B中会展现它的实现。

1.3.3 性能分析

分析性能是另外一个重要实践。尽管JavaScript引擎已经让JavaScript以惊人的效率提高，然而咱们依然没有理由书写粗糙低效的代码。

咱们会使用以下的代码来收集性能信息：

console.time("My operation");   ⇽---   开始计时器
for(var n = 0; n < maxCount; n++){
  /*perform the operation to be measured*/
}   ⇽---    执行屡次操做
console.timeEnd("My operation");    ⇽---    中止计时器
复制代码

这段代码中，咱们把要被测量的代码放在两个计时器调用之间，分别是内置console对象上的time和timeEnd方法。

在操做开始执行以前，调用console.time启动一个命名计时器（本例中计时器名为 My operation）。而后在特定的循环次数下运行代码（本例中运行maxCount次）。因为一次操做执行太快很难测量，因此咱们要屡次运行代码从而取得一个可以测量的值。运行次数能够成百上千，甚至上万，其彻底依赖于将被测量的代码性质。几回摸索后咱们就能获得一个合理的值。

操做结束后则用相同的计时器名字调用console.timeEnd。随后浏览器就会输出从开始到当前的时间差。

把这种技术与前面所学到的最佳实践技术统一块儿来，你对JavaScript的开发能力就会大幅度提高。在浏览器提供的有限资源下，在浏览器能力和兼容性逐渐复杂的世界中开发应用，须要一套健壮和完整的技巧。

1.4 提升跨平台开发能力

Bob初入Web开发行业时，他会发现每一个浏览器都有一套本身的脚本及UI样式的解释方式，并试图鼓吹他们的方式才是最好的方式，这使开发者们沮丧地咬牙切齿。好在浏览器之争以HTML、CSS, DOM、API和JavaScript的标准化而结束，从而开发者能集中精力开发高效的跨浏览器JavaScript应用。确实，集中精力于把网站开发为应用催生了大量的想法、工具和从桌面应用到网站应用的技术。现现在，这些知识和工具的转换再次发生，想法、工具和源于客户端Web开发的技术逐渐渗入应用开发的其余领域。

对JavaScript基本原理和核心API的渗入理解能让你成为更全能的开发者。经过使用浏览器和Node.js（源自于浏览器的环境），你可以开发几乎你能想到的任何类型的应用。

桌面应用，经过使用如NW.js或Electron的库能够开发桌面应用。这些技术一般经过包装浏览器使咱们能用标准的HTML、CSS和JavaScript（咱们能够彻底依赖咱们的核心JavaScript和浏览器知识来开发）以及一些额外的访问文件系统的能力来构建桌面应用。从而可以开发真正独立于平台的桌面应用，它和咱们在Windows、Mac和Linux上见到的应用看起来同样。 移动应用，使用相似Apache Cordova的框架开发。与使用 Web 技术构建桌面应用同样，该应用框架也包装了浏览器，不过其中还包含一些额外的针对特定平台的API，从而让开发者能与移动平台交互。 使用Node.js开发服务器端应用和嵌入式应用，Node.js是源自于浏览器的环境，使用了不少相似浏览器的底层原理。例如，Node.js 能执行 JavaScript 代码，而且也基于事件驱动。 Ann并不知道本身有多幸运（尽管Bob有个很棒的想法）。不管她是否须要构建一个标准的桌面应用仍是移动应用、服务器端应用或嵌入式应用都没问题——全部这些应用都共享一样的标准客户端Web应用底层原理。

只要理解了JavaScript工做的核心原理、理解了浏览器提供的核心API（例如事件，一样与Node.js提供的机制有不少共同点），她就能加速全部应用的开发。在这个过程当中，你将变得更全能，知识和理解力也逐步增加，从而可以处理各类各样的问题。你将可以在云上经过使用JavaScript API构建无需依赖服务器的应用，例如使用相似AWS Lamda来部署、维护和控制你应用的云组件。

1.5 小结

客户端Web应用做为现在最流行的应用，其概念、工具和技术从仅开发客户端Web应用已经深刻到其余应用领域。理解客户端Web应用的基础能帮助你开发一系列不一样领域的应用。 为了提升开发技能，你须要深刻理解JavaScript的核心机制和浏览器所提供的架构。 本书集中探讨了核心JavaScript的机制，例如函数、函数闭包和原型，还有一些新的JavaScript特性，例如生成器、promise、代理、映射、集合和模块。 JavaScript能够在大量的环境中执行，但全部环境的开端是咱们将集中探讨的浏览器环境。 除了JavaScript之外，咱们还将探索浏览器内部，例如DOM （网页UI的一种结构化表示方式）和事件，这是由于客户端Web应用是事件驱动的应用。