javascript忍者秘籍(第⼆版)翻译学习第⼀章JavaScript⽆处
不在
前⾔废话(⽴flag)
《javascript忍者秘籍第⼆版》这本书据说是JQUERY之⽗写的,emmm,肯定值得我这种菜狗来学习膜拜,所以打算花时间来把这本书通读记录⼀便,因为是看的英⽂版(因为贫穷,所以只好看看英⽂版的,英⽂版的免费,所以只好⾃⾷其⼒)所以翻译不当之处烦请指正(我统统接受!)
书籍传送门(需要的⾃取)
链接: 提取码:847o 复制这段内容后打开百度⽹盘⼿机App,操作更⽅便哦
第⼀章 JavaScript is everywhere
这章包括三个部分
1. JavaScript的核⼼语⾔功能
2. JavaScript引擎的核⼼项
3. 三个JavaScript开发的最佳实践
1.1 理解JavaScript语⾔
很多⼈之前可能⽤过C++,java等语⾔,所以会以为JavaScript会也和他们⼀样,但是其实根本上有很⼤的不同,与其他语⾔相
⽐,JavaScript功能上更⾯向对象。这些不同包括:
函数是⼀流对象 在JavaScript中,函数也是对象,并且能够和其他对象共存。函数对象可以通过字⾯量来创建,可以通过变量来引⽤,可以作为⼀个函数参数来传递,甚⾄可以作为函数返回值来返回。我们会花费三章来探索函数作为⼀流的对象在JavaScript代码中带给我们的好处。
函数闭包
函数闭包的概念其实很多⼈对他不是很理解,但也⽆法阻⽌他成为JavaScript中很重要的⼀个概念。现在,你只需要知道当闭包就是能够读取其他函数内部变量的函数。如果你现在还没看到闭包的好处,表怕。我们会在第五章中详细解释,我们也会在第三章和第四章中深⼊了解函数。
作⽤域
直到最近,JavaScript都没有块级变量的概念(像C语⾔),为了实现这个功能,我们只能⽤全局变量和函数级别的变量来代替。jquery在线免费学习
基于原型的⾯向对象
就是JavaScript不能像主流函数来实现⾯向对象,所以只能使⽤原型(prototype)来实现这⼀功能。所以我们之后会深⼊研究原型,基于原型的⾯向对象是如何⼯作的以及他在JavaScript中的实现⽅法
JavaScript是由对象,原型,函数和闭包相辅相成的。理解这些概念,才能最⼤限度的提⾼JavaScript编程能⼒。同时,为了接下去阅读的顺畅,需要理解以下⼀些概念(ES6):
传送门
1. generate
2. promises
3. proxies
4. arrary新增的⽅法
5. maps
6. 正则表达式
7. modules
8. class
9. asyn await
10. of
11. .....
1.1.1 JavaScript会如何发展
原⽂就是说ECMAScript委员会每年做⼀些⼩的修改,本书会同时研究ES6和ES7的特性,你可以关注以下⽹址来关注更新动态
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 测试
在本书中,我们会使⽤⼀些测试技术来确保⽰例代码按预期执⾏,同时这些测试技术也⽤于展⽰⼀般情况下如何测试代码。我们⽤于测试的主要⼯具是⼀个断⾔函数,其⽬的在于断定某个假设是真值还是假值。
该函数的⼀般形式如下所⽰:
1assert(condition, message);
2复制代码
第⼀个参数是⼀个应为真值的条件,第⼆个参数是当断⾔为假时所展⽰的⼀句话。JS默认时没有这个⽅法的,只能⾃⼰实现或者⽤其他⽅法检验,不⼀定要⽤这个,给个思路如下
1function assert(condition, message) {
2    if (!condition) {
3        message = message || "Assertion failed";
4        if (typeof Error !== "undefined") {
5            throw new Error(message);
6        }
7        throw message; // Fallback
8    }
9}
10复制代码
例如:
1assert(a === 1, "Disaster! a is not 1!");
2复制代码
如果变量的值不等于1,则断⾔失败,然后那段有点⼉戏剧性的消息就会被展⽰出来。
断⾔函数并不是JavaScript的标准特性,所以我们在附录B中会展⽰它的实现。
1.3.3 性能分析
分析性能是另⼀个重要实践。尽管JavaScript引擎已经让JavaScript以惊⼈的效率提升,然⽽我们依然没有理由书写粗糙低效的代码。
我们会使⽤如下的代码来收集性能信息:
1console.time("My operation");  ⇽---  开始计时器
2for(var n = 0; n < maxCount; n++){
3  /*perform the operation to be measured*/
4}  ⇽---    执⾏多次操作
5console.timeEnd("My operation");    ⇽---    停⽌计时器
6复制代码
这段代码中,我们把要被测量的代码放在两个计时器调⽤之间,分别是内置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应⽤是事件驱动的应⽤。

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。