深入理解JavaScript
深入学习JavaScript
且听真言
努力工作,玩命生活。
展开
-
JavaScript 自记忆函数
如同前面所提到的,记忆化(memoization)是一种构建函数的处理过程,能够记住上次计算结果。在这个果壳里,当函数计算得到结果时就将该结果按照参数存储起来。采用这种方式时,如果另一个调用也使用相同的参数,我们则可以直接返回上次存储的结果而不是再计算一遍。像这样避免既重复又复杂的计算可以显著地提高性能。对于动画中的计算、搜索不经常变化的数据或任何耗时的数学计算来说,记忆化这种方式是十分有用的。...原创 2019-01-31 10:55:32 · 322 阅读 · 0 评论 -
javascript 函数的定义
JavaScript函数通常由函数字面量(function literal)来创建函数值,就像数字字面量创建一个数字值一样。要记住这一点,作为第一类对象,函数是可以用在编程语言中的值。 JavaScript提供了几种定义函数的方式,可以分为4类:1.函数定义(function declarations)和函数表达式(function expressions)——最常用,在定义函数上却有...原创 2019-01-31 09:39:44 · 290 阅读 · 0 评论 -
javascript函数声明和函数表达式
JavaScript中定义函数最常用的方式是函数声明和函数表达式。这两种技术非常相似,有时甚至难以区分,但在后续章节中可以看到,它们之间还是存在着微妙的区别。JavaScript定义函数最基本方式是函数声明,如下图:正如你所见,每个函数声明以强制性的function开头,其后紧接着强制性的函数名,以及括号和括号内一列以逗号分隔的可选参数名。函数体是一列可以为空的表达式,这些表达式必须包含在花括...原创 2019-01-30 13:59:31 · 1294 阅读 · 0 评论 -
javascript 箭头函数
注意 箭头函数是JavaScript标准中的ES6新增项。由于JavaScript中会使用大量函数,增加简化创建函数方式的语法十分有意义,也能让我们开发者生活更愉快。在很多方式中,箭头函数是函数表达式的简化版。var values = [0, 3, 2, 5, 7, 4, 8 , 1];values.sort(function (value1, value2) { return v...原创 2019-01-30 10:27:03 · 305 阅读 · 0 评论 -
javascript 函数的实参和形参
在讨论函数时,经常使用的术语实参(argument)和形参(parameter)几乎可以互换,就好像它们是差不多是同一种事物。1.形参是我们定义函数时所列举的变量。2.实参是我们调用函数时所传递给函数的值。/参数列表中的ninja是形参function skulk(ninja) { //performAction传入的两个参数是ninja和'skulking'是函数实参 r...原创 2019-01-29 19:40:06 · 1750 阅读 · 0 评论 -
JavaScript剩余参数和默认参数
剩余参数注意:剩余参数已被加入ES6标准。下一个例子中,我们会构建一个函数,它会将第一个参数与剩余参数中最大的数相乘。这个例子可能并不是特别适用于我们的应用,然而,这个例子可能为函数中参数处理提供了一种技术。console.log('----------------------使用剩余参数--------------------------');//剩余参数以...做前缀fun...原创 2019-01-29 12:14:20 · 677 阅读 · 1 评论 -
javascript 函数小节
1.把JavaScript看作函数式语言你就能书写复杂的代码。2.作为第一类对象,函数和JavaScript中其他对象一样。类似于其他对象类型,函数具有以下功能:2.1通过字面量创建。2.2赋值给变量或属性。2.3作为函数参数传递。2.4作为函数的结果返回。2.5赋值给属性和方法。 3.回调函数是被代码随后“回来调用”的函数,它是一种很常用的函数,特别是在事件...原创 2019-01-28 18:25:56 · 165 阅读 · 0 评论 -
javascript 函数总结
小节:1.当调用函数时,除了传入在函数定义中显示声明的参数之外,同时还传入两个隐式参数:arguments与this。-arguments参数是传入函数的所有参数的结合。具有length属性,表示传入的参数的个数,通过arguments参数还可以获取那些与函数形参不匹配的参数。在非严格模式下,arguments对象是函数参数的别名,修改arguments对象会修改函数实参,可以通过严格...原创 2019-01-27 10:55:36 · 240 阅读 · 1 评论 -
JavaScript使用bind方法
函数还可访问bind方法创建新函数。无论使用哪种方法调用,bind方法创建的新函数与原始函数的函数体相同,新函数被绑定到指定的对象上。<button id="testClick">Click Me!</button><script> console.log('---------------在事件处理中绑定指定的上下文-----------------...原创 2019-01-26 14:10:54 · 2019 阅读 · 0 评论 -
javascript 箭头函数和对象字面量
由于this值在箭头函数创建时确定的,所以会导致一些看似奇怪的行为。看下面代码,因为只有一个按钮,因此可以假设不需要构造函数。直接使用对象字面量。 <button id="testClick">Click Me!</button> <script> if (this === window) { //全局代码中的this指向全局w...原创 2019-01-26 09:52:52 · 765 阅读 · 0 评论 -
JavaScript 使用函数上下文的问题
处理JavaScript函数上下文时可能遇到一些问题。在回调函数中(例如事件处理器),函数上下文与预期不符,但可以使用call或apply方法绕过。在本节中,我们看看另外两个选择:箭头函数和bind方法,在一些情况下可以更优雅地实现相同的效果。使用箭头函数绕过函数上下文箭头函数相比于传统的函数声明和函数表达式,可以更加优雅地创建函数。箭头函数作为回调函数还有一个更优秀的特性:箭头函数没有单...原创 2019-01-25 18:41:31 · 293 阅读 · 0 评论 -
javascript 使用apply和call方法调用
目前不同类型函数调用指尖的主要区别在于:最终作为函数上下文(可以使用this参数隐式引用到)传递给执行函数的对象不同。对于方法而言,即为方法所在的对象;对于顶级函数而言是window或者undefined(取决于是否处于严格模式下);对于构造函数而言是一个新创建的实例对象。但是,如果想改变函数上下文怎么办?如果想要显示指定它怎么办?如果......好吧,我们为什么会提出这样的问题?为了解释...原创 2019-01-24 15:38:01 · 583 阅读 · 0 评论 -
javascript 理解函数的调用——构造函数
函数作为构造函数调用并没有什么特别之处。构造函数的声明和其他函数类似,通过使用函数声明和函数表达式很容易得构造新的对象。唯一的例外是箭头函数。若通过构造函数方式调用,需要在函数调用之前使用关键字new。例如,通过构造函数的方式重新调用上一节中提到的函数whatsMyContext:function whatsMyContext() {return this;}如果我们想要通过构...原创 2019-01-22 19:21:38 · 552 阅读 · 0 评论 -
javascript 理解函数调用-this参数:函数上下文
this参数:函数上下文当调用函数时,除了显示提供的函数外,this参数也会默认地传递给函数。this参数是面向对象JavaScript编程的一个重要组成部分,代表函数调用相关联的对象。因此,通常称之为函数上下文。函数上下文是来自面向对象语言(如java)的一个概念。在这些语言中,this通常指向定义在前面方法的类的实例。但是要小心!正如接下来要提到的,在JavaScript中,将一个...原创 2019-01-18 19:34:31 · 874 阅读 · 0 评论 -
javascript 理解函数调用-操作arguments参数
console.log('---------------------使用arguments参数对所有函数执行操作------------------------');//完全没有任何显式定义参数的函数//迭代所有传入参数,然后通过索引标记获取每个元素的值function sum() { var sum = 0; for (var i = 0; i < arguments.le...原创 2019-01-17 19:20:39 · 475 阅读 · 0 评论 -
理解函数调用-arguments参数
1.函数中两个隐含的参数:arguments和this2.调用函数的不同方式3.处理函数上下文的问题隐式的函数参数this和arguments。两者会被静默地传递给参数,并且可以像函数体内显示声明的参数一样被正常访问。参数this表示被调用函数的上下文对象,而argument参数表示函数调用过程中传递的所有参数。这两个参数在JavaScript代码中至关重要。参数this是Ja...原创 2019-01-16 19:47:27 · 3904 阅读 · 0 评论 -
javascript 生成器和promise总结
生成器和promise总结1.生成器是一种不会在同事输出所有值序列的函数,而是基于每次的请求生成值。2.不同于标准函数,生成器可以挂起和恢复它们的执行状态。当生成器生成一个值后,它将会在不阻塞主线程的基础上挂起执行,随后静静地等待下次请求。3.生成器通过在function 后面加一个星号(*)来定义。在生成器函数体内,我们可以使用新的关键字yield来生成一个值并挂起生成器的执行。如果...原创 2019-01-15 21:24:54 · 628 阅读 · 0 评论 -
javascript 面向未来的async函数
可以看到我们仍然需要书写一些样板代码,所以我们此时需要一个async函数能够管理所有promise函数的调用,还要管理所有向生成器发送的请求。虽然我们可以在代码中只书写一次这个过程,然后每次需要的时候对其进行复用,但如果我们完全不用关心这个问题就更好了。负责JavaScript的人们也注意到了将生成器和promise相结合的强大效果,因而他们也希望直接借助语言层面来支持这个特性,从而使我们开发更加...原创 2019-01-15 09:21:28 · 173 阅读 · 0 评论 -
javascript把生成器和promise相结合
结合生成器(以及生成器暂停和恢复执行的能力)和promise,来实现更加优雅的异步代码。try{ const ninjas = syncGetJSON('data/ninja.json'); const missions = syncGetJSON(ninjas[0].missionsUrl); const missionDetails = syncGetJSON(mission...原创 2019-01-14 19:15:02 · 768 阅读 · 0 评论 -
深入理解Promise2
客户端最通用的异步任务就是从服务器获取数据。使用内置XMLHttpRequest对象来完成底层的实现。console.log('----------------------创建一个真实promise案例-----------------------');console.log('-----------------创建getJSON promise----------------');fu...原创 2019-01-10 19:07:30 · 421 阅读 · 0 评论 -
javascript深入研究promise
promise对象作用域作为异步任务结果的占位符。它代表了一个暂时没有获得的值,但是未来有可能获得的值。基于这一点原因,在一个promise对象的整个生命周期中,它会经历多种状态。一个promise对象从等待(pending)状态开始,此时我们对承诺的值一无所知。因此一个等待状态的promise对象也称为未实现(unresolved)的promise。在程序执行的过程中,如果promise的res...原创 2019-01-09 17:48:12 · 214 阅读 · 0 评论 -
javascript 使用promise
使用JavaScript编写代码会大量的依赖异步计算,计算那些我们现在不需要但将来某个时候可能需要的值。ES6引入一个新概念,用于更简单的异步任务:promise。promise对象是对我们现在尚未得到的但将来会得到值的占位符,它是对我们最终能够得知异步计算结果的一种保证。如果我们兑现了我们的承诺,那结果会得到一个值。如果发生了问题,结果则是一个错误。使用promise的一个最佳的例子是从服务...原创 2019-01-08 19:11:04 · 2816 阅读 · 0 评论 -
javascript探索生成器内部构成
我们已经知道了调用一个生成器不会实际执行它。相反,它创建了一个新的迭代器,通过该迭代器我们才能从生成器中请求值。在生成器生成了一个值后,生成器会挂起执行并等待下一个请求的到来。在某种方面来说,生成器的工作更像是一个小程序,一个在状态中运动的状态机。1.挂起开始——创建一个生成器后,它最先以这种状态开始。其中的人格代码都未执行。2.执行——生成器中的代码已经执行。执行要么刚开始,要么是从上次...原创 2019-01-04 18:41:20 · 222 阅读 · 0 评论 -
javascript与生成器交互
使用yield表达式从生成器中返回多个值,但生成器远比这更加强大!我们还能向生成器发送值,从而实现双向通信!使用生成器我们能够生成中间结果,在生成器以外我们也能够使用该结果进行任何操作,然后,一旦准备好了,就能够把整个新计算得到的数据再完完整整返回给生成器。作为生成器函数发送值向生成器发送值的最简单方法如其他函数一样,调用函数并传入实参。 console.log('-------...原创 2019-01-02 19:18:22 · 311 阅读 · 0 评论 -
javascript对迭代器进行迭代
通过调用生成器得到的迭代器,暴露出一个next方法能让我们向迭代器请求一个新值。next方法返回一个携带着生成值的对象,而该对象中包含的另一个属性done也向我们指示了生成器是否还会追加生成值。//通过调用生成器得到的迭代器,暴露出一个next方法能让我们向迭代器请求一个新值。next方法返回一个携带着生成值的对象,而该对象中包含的另一个属性done也向我们指示了生成器是否还会追加生成值。...原创 2019-01-01 09:49:25 · 1051 阅读 · 0 评论 -
javascript通过迭代器对象控制生成器
调用生成器函数不一定会执行生成器函数体。通过创建迭代器对象,可以与生成器通信。例如,可以通过迭代器对象请求满足条件的值。console.log('-----------------通过迭代器对象控制生成器----------------');//定义一个生成器,它能生成一个包含两个weapon的序列function* WeaponGenerator() { yield 'Katana...原创 2018-12-31 13:16:00 · 170 阅读 · 0 评论 -
javascript未来的函数:生成器和promise
1.通过生成器让函数持续执行。2.使用promise处理异步任务。3.使用生成器和promise书写优雅代码。ES6语言特性:生成器(generator)和promise(promise)生成器(generator)是一种特殊类型的函数。当从头到尾运行标准函数时,它最多只生成一个值。然而生成器函数会在几次运行请求中暂停,因此每次运行都可能会生成一个值。虽然生成器对JavaScrip...原创 2018-12-30 15:40:06 · 406 阅读 · 0 评论 -
javascript分析闭包和回调函数
<div id="box1">First Box</div><div id="box2">Second Box</div><script> function animateIt(elementId) { var elem = document.getElementById(elementId);原创 2018-12-29 15:05:21 · 471 阅读 · 0 评论 -
javascript私有变量的警告
Javascript从未阻止我们将一个对象中创建的属性复制给另一个对象。观察如下代码:console.log("------------通过函数访问私有变量,而不是通过对象访问-------------");function NinjaTest() { var feints = 0; this.getFeints = function () { return feints;...原创 2018-12-28 19:18:47 · 244 阅读 · 0 评论 -
javascript 研究闭包的工作原理
闭包可以访问创建函数时所在作用域内的全部变量,闭包有用的方法:通过闭包模拟私有变量,通过回调函数使得代码更加优雅。闭包与作用域密切相关。闭包对JavaScript的作用域规则产生了直接影响。使用闭包模拟私有变量的代码console.log("------使用闭包模拟私有变量-------");//在构造函数内部声明变量。由于该变量的作用域在构造函数内部,因此,feints是一个私有变量...原创 2018-12-27 18:39:39 · 184 阅读 · 0 评论 -
javascript在词法环境中注册标识符
JavaScript作为一门编程语言,其设计的基本原则是易用性。这也是不需要指定函数返回值类型、函数参数类型、变量类型等主要原因。你已经了解到JavaScript是逐行执行的。查看代码如下:firstRonin = 'Kiyokawa';secondRoin = 'Knodo';将Kiyokawa赋值给firstRonin,将Knodo赋值给标识给标识符secondRoi...原创 2018-12-26 19:00:46 · 322 阅读 · 0 评论 -
javascript定义变量的关键字与词法环境
定义变量的3个关键字——var、let和const,还可以通过与词法环境的关系将其进行分类(换句话说,按照作用域分类)。可以将var分为一组,let与const分为一组。使用关键字var当使用关键字var时,该变量是在距离最近的函数内部或是在全局词法环境中定义的。(注意:忽略块级作用域)这是JavaScript由来已久的特性。console.log("----------------...原创 2018-12-25 19:21:23 · 7627 阅读 · 0 评论 -
使用词法环境跟踪变量的作用域
词法环境(lexical environment)是JavaScript引擎内部用来跟踪标识符与特定变量之间的映射关系。例如,查看如下代码:var ninja = "Hattori";console.log(ninja);当console.log语句访问ninja变量时,会进行词法环境的查询。注意:词法环境是JavaScript作用域的内部实现机制,人们通常称为作用域(scopes...原创 2018-12-24 19:25:14 · 409 阅读 · 0 评论 -
理解JavaScript的变量类型
在JavaScript中,我们可以通过3个关键字定义变量:var、let和const。这3个关键字有两点不同:可变性,与词法环境的关系。注意:var关键字从一开始就是JavaScript的一部分,而let与const是在ES6时加进来的。变量可变性如果通过变量的可变性来进行分类,那么可以将const放在一组,var和let放在一组。通过const定义的变量都不可变,也就是说通过const声...原创 2018-12-23 10:11:49 · 149 阅读 · 0 评论 -
javascript 通过执行上下文来跟踪代码
在javascript中,代码执行的基础单元是函数。我们时刻使用函数,使用函数进行计算,使用函数更新UI,使用函数达到复用代码的目的,使用函数让我们的代码更容易理解。为了达到这个目标,第一个函数可以嗲用第二个函数,第二个函数可以调用第三个函数,以此类推。当发生函数调用时,程序会回到函数调用的位置。 JavaScript引擎是如何跟踪函数的执行并回到函数的位置的?JavaScript代码...原创 2018-12-21 19:13:25 · 1297 阅读 · 0 评论 -
JavaScript回调函数
处理回调函数是另一种常见的使用闭包的场景。回调函数指的是需要在将来不确定的某一时刻异步调用的函数。通常,在这种回调函数中,我们经常需要频繁地访问外部数据。<div id="box1">First Box</div><script>function animateIt(elementId) { //在动画函数中,animatelt内部,获取DOM元素...原创 2018-12-19 19:21:54 · 3514 阅读 · 0 评论 -
JavaScript使用闭包
封装私有变量许多编程语言使用私有变量,这些私有变量是对外部隐藏的对象属性。这是非常有用的一种特性,因为当通过其他代码访问这些变量时,我们不希望对象的实现细节对用户造成过度负荷。遗憾的是,原生JavaScript不支持私有变量。但是,通过使用闭包,我们可以实现很接近的、可接受的私有变量。console.log("-----------------------使用闭包模拟私有变量------...原创 2018-12-17 19:15:02 · 174 阅读 · 0 评论 -
javascript闭包和作用域
闭包是javascript的显著特征。虽然许多JavaScript开发者在开发时没有理解闭包的主要优势,但是使用闭包,不仅可以通过减少代码数量和复杂度来添加高级特性,还能实现不太可能完成的功能。换句话说,如果没有闭包,事情将变得非常复杂。例如,如果没有闭包,事件处理和动画等包含回调函数的任务,它们的实现变得复杂的多。除此以外,如果没有闭包,将完全不可能实现私有变量。 闭包允许函数访问并操作...原创 2018-12-15 17:11:55 · 216 阅读 · 0 评论 -
javascript 实现继承
实现继承1.ES6之前的版本重中实现继承是一件痛苦个事。如下面代码:function Person() {}Person.prototype.dance = function(){};function NinjaTest() {}NinjaTest.prototype = new Person();Object.defineProperty(NinjaTest.prototype...原创 2018-12-13 19:29:31 · 150 阅读 · 0 评论 -
javascript之instanceof操作符
在大部分语言的中,检测对象是否是类的最直接方法是使用操作符instanceof。例如,在Java中,使用操作符instanceof检测左边的类和右边的类是否是同一个子类。它的作用是用来判断,instanceof 左边对象是否为instanceof 右边类的实例,返回一个boolean类型值。还可以用来判断子父类的所属关系。虽然在JavaScript中操作符instanceof与java中基本类...原创 2018-12-11 19:16:30 · 339 阅读 · 0 评论