最近在 perfectionkills 上看到几道 JavaScript 题目,这里拿来分享一下,下面列举出来了题目,你可以在这里做题,答案解析可以到这里找到。
理解正则表达式的全局匹配
本文讨论何时以及如何使用正则表达式全局匹配(/g),以及使用全局匹配可能会遇到的一些坑。
什么是全局匹配
有时候你可能期望重复匹配目标字符串多次,那么你就会创建一个全局匹配的正则表达式(通过正则表达式字面量 /.../g
或创建 new RegExp(..., 'g')
对象),这样正则表达式的 global
属性将会是 true
,并且会导致一些行为的不同,下面会具体介绍。
|
|
全局的正则表达式的另一个属性 lastIndex
表示上一次匹配文本之后的第一个字符的位置,上次匹配的结果是由方法 RegExp.prototype.exec()
和 RegExp.prototype.test()
找到的,它们都以 lastIndex
属性所指的位置作为下次检索的起始点。这样,就可以通过反复调用这两个方法来遍历一个字符串中的所有匹配文本。lastIndex
属性是可读可写的,只要目标字符串的下一次搜索开始,就可以对它进行设置。当方法 RegExp.prototype.exec()
或 RegExp.prototype.test()
再也找不到可以匹配的文本时,它们会自动把 lastIndex
属性重置为 0。
理解 JavaScript 中的原型
当你在JavaScript中定义一个函数,它有一些预定义的属性,其中之一就是令人迷惑的原型。本文将详细解释什么是原型,以及为什么要在项目中使用它。
什么是原型
对象初始化时原型是一个空对象,你可以将任何其他对象添加到原型上。
|
|
上面的代码中,我们创建了一个函数,如果我们调用 myObject()
,它将简单的返回一个 window
对象,因为它还没有被实例化,而这个函数是在全局作用域中定义的,this
理所当然地指向了全局对象。
|
|
解释 JavaScript 的作用域和闭包
面试或被面试时基本都会涉及到这个最原始的 JavaScript 基础问题,试想一下您有没有在某些时候向别人解释这些概念时,把自己给绕进去了;网络上偶遇一篇英文文章,细读之后觉得有参考价值,文章不长,就顺手翻译了一下,希望某些同学可以用的上。
原文文中的 Scope 翻译成中文是“变量作用域”,译文某些地方直接简称为“作用域” ,Closure 翻译后是“闭包”。Rebort Nyman 的原文是 Explaining JavaScript Scope And Closures,某些不清楚的地方可以直接参考原文。
以下是译文
背景
很多文章或博客都在试着解释作用域和闭包,但大多数都没有解释的很清楚(crystal-clear)。此外,很多人想当然地认为每个人都有大约 15 种其他语言的开发经验,但依我的经验,大多数 JavaScript 开发人员是来自 HTML 和 CSS 的背景,而不是 C 或者 Java。(译者注:在 Node 盛行的今天,情况或许有些不一样。)
因此,文本谦虚的目标是想让大家都能理解作用域和闭包,他们的原理是什么,尤其重要的是如果更好地使用他们。在阅读本文之前,需要您有一些 JavaScript 中变量和函数的基础知识。
学习使用 Timing API
高性能的 Web 应用是获得伟大用户体验的关键。随着 Web 应用越来越复杂,要想建立吸引人的用户体验,了解性能的影响是至关重要的。在过去的几年中,浏览器中也新增了许多 API 来帮助我们分析网络性能、页面加载时间等。但这些并没有给出详尽的足够灵活的方式,来帮助我们分析具体是什么降低了我们网站的性能。User Timing API 提供了一套机制来帮助我们测量我们的应用,从而找到应用中耗时的部分。在本文中,我将介绍这个 API 并提供一些如何使用它的例子。
你不能优化那些不能被测量的东西
给运行缓慢的应用提速的第一步是,找到应用中耗时的部位。要想找到这些烫手山药,最理想的方式就是对 JavaScript 代码进行区域性的运行时间测量,这是寻找如何提高网站性能的第一步。幸运的是,可以在代码的不同部位去调用 User Timing API,提取到时间的详细数据,来帮助你进行性能优化。
高精度时间和now()
准确测量时间的一个基础是精确度,之前我们是基于毫秒的时间测量,这种方式工作良好,但是对于一个每帧需要在 16ms 内绘制完成的 60FPS 的网站,如果只有毫秒精度的测量,对于网站的分析就缺乏所需要的精度。High Resolution Time 是现代浏览器内置的一种新的测量时间的方式,它给我们提供了一个精确到微秒的浮点类型的时间戳,是之前精度的 1000 倍。
可以通过调用 Performance 对象中的扩展方法 now()
来获取当前的时间,就像下面代码这样:
JSHint 选项列表
有时候会查找 JSHint 某些选项的具体含义,针对项目需求开启或关闭某些选项,所以从这里转载了 JSHint 选项列表的中文翻译,供不时之需。
使用 Developer Tools 进行 JavaScript 性能分析
原文链接:JavaScript Profiling With The Chrome Developer Tools
现在,让我们来让你的网站跑得更快,网站性能通常包括两个方面:页面加载速度和脚本执行速度,有很多方法可以让网站加载更快,例如,压缩文件和 CND 等,但是要让脚本执行更快就得靠开发人员自己了。
代码很小的改动就可能对性能产生巨大影响,不同位置的几行代码可能就意味着一个快的网站和产生可怕的“无响应脚本”对话框的网站之间的区别。本文展示了使用 Chrome 开发工具来找到这些性能关键点代码的一些方法。
建立基准线
我们来看一个简单的颜色排序应用,这个应用展示了一个由各种颜色构成的网格,您可以拖放任意一个颜色点来混淆。每一个颜色点都是一个 div 标签,使用了一些 CSS 来让它们看起来像一个圆点。
点击这里访问该应用。
生成一个这些颜色有点棘手,所以我参考了 Making Annoying Rainbows in JavaScript 这篇文章。
【译】Javascript 基准测试
原文发表在 Performance Calendar 上,作为其 2010 年系列文章的一部分。在上一篇翻译的文章中,作者推荐了这篇文章,译者阅读之后觉得有一定的价值,而且网络上没有这篇文章的中文翻译,权当学习就在此翻译成了中文,水平有限,如果有表达不恰当或者表达有误的地方,请直接在评论中指出。
原文链接:Bulletproof JavaScript benchmarks,下面开始翻译正文。
编写 JavaScript 基准测试并不是想象的那么容易,撇开潜在的跨浏览器兼容问题不说,还将面临很多陷阱(甚至诡雷)。
这也是我创建 jsPerf 的一部分原因,jsPerf 提供了一个非常简单的 Web 接口,您可以非常轻松地创建和分享不同代码片段的性能测试用例。您不需要考虑其他问题,只需要输入你想做基准测试的代码,jsPerf 就会为您创建一个运行在不同的浏览器和设备上测试用例。
其实,jsPerf 最开始使用的是一个基于 JSLitmus 的基准测试库 - Benchmark.js
。后来添加了很多新功能,最近,John-David Dalton
又从头开始完全重写了该代码,Benchmark.js 也变得越来越完善。
本文将阐明编写和运行 JavaScript 基准测试的各种陷阱。
【译】编写快速、高效的 JavaScript

原文连接:Writing Fast, Memory-Efficient JavaScript
许多 JavaScript 引擎都是为了快速执行的大型 JavaScript 应用程序设计而特别设计,如 Google V8 引擎(正被 Chrome 和 NodeJS 使用)。在开发过程中,如果你关心内存使用情况和页面性能,你应该了解户浏览器的 JavaScript 引擎的内部运作原理。
无论是V8、SpiderMonkey(Firefox)、Carakan(Opera)、Chakra)(IE)或其他 JavaScript 引擎,了解引擎背后的一些运行机制可以帮助你更好地优化你的应用程序。但,这并不是说应该专门为某一浏览器或引擎进行程序的优化,而且,永远不要这样做。
你应该先问自己下面几个问题:
- 我可以做些什么来让我的代码更加高效
- 主流的 JavaScript 引擎都做了哪些优化
- 什么是引擎无法优化的,垃圾回收器是不是按照我预想的那样,回收了我不需要的内存空间
在我们编写高效、快速的代码的时候,有许多常见的陷阱,本文将讨论一些经过验证的、更好的编写代码的方式。
MongoDB 用户和身份验证
MongoDB是一个介于关系数据库和非关系数据库之间的产品,是非关系数据库当中功能最丰富,最像关系数据库的。这里推荐一个快速入门教程 - 8天学通 MongoDB,写的很全面。这里讨论的是 MongoDB 的用户和身份验证。
在默认情况下,MongoDB 不会进行身份验证,也没有账号,只要能连接上服务就可以对数据库进行各种操作,如果你在一个面向公众的服务器上使用它,那么这的确是一个问题。