紧接上一篇博文:js函数的作用域与this指向

先来说说this的作用于链,this后的属性或者方法在使用时是先从本实例中查找,如果找到就先返回,如果没找到就接着向上从原型链中查找,如果有多重继承关系,那就一级一级的找上去,如果最终没找到就返回undifined.看下面示例:

代码中实例obj的doFunction方法就是先在本实例查找,因为在本实例中定义了name属性所以返回“MyObj下的name<br/>”,如果把“this.name = 'MyObj下的name<br/>';”注释掉,那就顺着原型找上去,返回“prototype下的name<br/>”。这就是js的链作用域查找机制,利用这个机制就能做一些性能优化。理论上严格控制this作用域链上的属性与方法数目无疑会加查找速度(去除那些没有必要放进this作用域链的属性和方法),两次及两次以上使用this下的属性和方法请将其缓存也可以提高查找速度。看一下优化后与优化前速度的对比:

before是优化前的,after是优化后的,长度表示每秒执行的次数(所以越长的性能越好)。查看性能测试用例:http://jsperf.com/scope-of-this

手动添加了100万个属性与只有一个属性做性能对比,可以看到只有IE10在性能对比中有一点点优势,所以这些理论上的东西很多都需要实际的测一下才知道,过多强调技巧可能得不偿失。

令人失望的是将属性加到原型中作对比,重复调用两次this属性,缓存与不缓存作对比结果没有太大的改进。因为多了一步缓存复制操作甚至在IE8下出现了性能下滑。

性能测试用例:http://jsperf.com/scope-of-this/5

函数的作用域与this指向 --- 性能篇的更多相关文章

  1. js函数的作用域与this指向

    函数的作用域与this指向是js中很重要的一部分,理清这点东西需要个逻辑,看看我的逻辑怎么样... 下面是个提纲,可以直接挑你感兴趣的条目阅读. 函数的定义方式:直接定义(window下,内部定义), ...

  2. javascript 函数和作用域(闭包、作用域)(七)

    一.闭包 JavaScript中允许嵌套函数,允许函数用作数据(可以把函数赋值给变量,存储在对象属性中,存储在数组元素中),并且使用词法作用域,这些因素相互交互,创造了惊人的,强大的闭包效果.[upd ...

  3. JavaScript函数及作用域

    知识内容: 1.JavaScript函数 2.JavaScript全局函数及特殊函数 3.JavaScript作用域 4.本节练习 参考资料:<JavaScript高级程序设计> 一.Ja ...

  4. 如何编写高质量的 JS 函数(4) --函数式编程[实战篇]

    本文首发于 vivo互联网技术 微信公众号 链接:https://mp.weixin.qq.com/s/ZoXYbjuezOWgNyJKmSQmTw作者:杨昆 [编写高质量函数系列],往期精彩内容: ...

  5. 【js】 vue 2.5.1 源码学习(六) initProxy initLifeCycle 渲染函数的作用域代理

    大体思路 (五) 1. initProxy 渲染函数的作用域代理 ==> es6 如果支持proxy (hasProxy) 就用proxy 不支持就用 defineProperty() prox ...

  6. JS核心系列:浅谈函数的作用域

    一.作用域(scope) 所谓作用域就是:变量在声明它们的函数体以及这个函数体嵌套的任意函数体内都是有定义的. function scope(){ var foo = "global&quo ...

  7. javascript 函数及作用域总结介绍

    在js中使用函数注意三点: 1.函数被调用时,它是运行在他被声明时的语法环境中的: 2.函数自己无法运行,它总是被对象调用的,函数运行时,函数体内的this指针指向调用该函数的对象,如果调用函数时没有 ...

  8. [译]JavaScript:函数的作用域链

    原文:http://blogs.msdn.com/b/jscript/archive/2007/07/26/scope-chain-of-jscript-functions.aspx 在JavaScr ...

  9. SQL Server 性能篇- 碎片

    本文分为两个问题: 第一,碎片是什么:第二,碎片怎么处理: 现在,来找解决这两个问题:  一.碎片是什么 说到碎片,就要提到索引了,索引用着挺爽的啊!是的,一旦索引建立,我们搜索数据的效率就提高了:然 ...

随机推荐

  1. css元素选择器 first-child nth-child

    E:first-child   只要E元素是它的父级的第一个子元素,就选中.它需要同时满足两个条件,    (1)是"第一个子元素",    (2)是"这个子元素刚好是E ...

  2. [DeeplearningAI笔记]ML strategy_2_4端到端学习

    机器学习策略-端到端学习 End-to-end deeplearning 觉得有用的话,欢迎一起讨论相互学习~Follow Me 2.9 什么是端到端学习-What is End-to-end dee ...

  3. ArrayBuffer and Base64

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8& ...

  4. 初识React-Redux之粗暴理解入门

    权当暂记 日后再行补充完善,若有阅读者,请翻到下文黄色标题'从这里开始'起阅读. Rudex在我看来最本质做的事情就是将所有的State属性统一存储(一个属性就是一个注册到store的Reducer) ...

  5. idea 新建的xml文件显示为文本问题

    由于是新手 在用idea 中出现了 显示问题,一开始 都随它去 ,结果发现几次 都一样 由于 mybatis配置的config 我都命名为 mybatis-config.xml 网上搜索了下 没有搜到 ...

  6. SSM框架搭建(Spring+SpringMVC+MyBatis)与easyui集成并实现增删改查实现

    一.用myEclipse初始化Web项目 新建一个web project: 二.创建包 controller        //控制类 service //服务接口 service.impl //服务 ...

  7. 如何自学Python?

    ​关于如何自学Python,我也是有话说的.来看看? Python具有丰富和强大的类库,常被称为胶水语言.而且语法简洁而清晰,功能强大且简单易学,因而得到了广泛应用和支持.它特别适合专家使用,也非常适 ...

  8. ASP.NET Core 2.0 MVC「远程」验证

    问题 如何 在ASP.NET Core MVC中使用[Remote]属性来实现模型验证 . 解 在 启动时, 为MVC配置中间件和服务. 添加一个模型. 添加一个控制器. 为jQuery添加一个Raz ...

  9. mysql timeout

    (待更新整理) 因为最近遇到一些超时的问题,正好就把所有的timeout参数都理一遍,首先数据库里查一下看有哪些超时: root@localhost : test 12:55:50> show ...

  10. javascript第十章--Ajax与Comet

    ① XMLHttpRequest对象 ② XMLHttpRequest2级 ③ 进度事件 ④ 跨域源资源共享 ⑤ 其他跨域技术