js对象的读取速度实例详解

1、访问字面量和局部变量最快，而访问数组元素和对象成员相对较慢。访问对象成员时，就像作用域链一样，在原型链上搜索。

2、如果找到的成员在原型链中的位置太深，访问速度就会变慢。

所以要尽量减少对象成员的搜索次数和嵌套深度。

实例

 // 进行两次对象成员查找
  function hasEitherClass(element, className1, className2) {
    return element.className === className1 || element.className === className2;
  }
  // 优化，如果该变量不会改变，则可以使用局部变量保存查找的内容
  function hasEitherClass(element, className1, className2) {
    const currentClassName = element.className;
    return currentClassName === className1 || currentClassName === className2;
  }

内容扩展：

js对象操作性能问题

1 string越长，那么使用str+="xxx"所花的时间将显著增加（近乎指数级别）。

2 对象数组仅仅只有400个元素的时候，对每个元素的属性和方法的访问时间都达到
了每个属性或者方法1/4毫秒！如果一个元素有10个属性，那么对数组的一次遍历，至少需要1秒，恐怖

3 FileSystem的操作，特别是write的操作几乎与要写的字符串长度的平方成正比。

4 不要采用自己定义的方法进行字符串操作，特别是替代和查找，比较；

我对正则式掌握不透，使用自定义函数的时候，发现在上述2）中提到的遍历中，

自定义函数耗费的时间达到了总时间的80％！

到此这篇关于js对象的读取速度实例详解的文章就介绍到这了,更多相关js对象的读取速度内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • JS对象数组去重的3种方法示例及对比

    JS对象数组去重的3种方法示例及对比

    目录 一.去重前后数据对比 二.使用方法 1.使用filter和Map 2.使用reduce 3.使用for循环 三.2400条数据,三种方法处理时间对比 总结 一.去重前后数据对比 // 原数据是这样的 // 去重后数据是这样的 [{ [{ "goodsId": "1", "goodsId": "1", "quota": 12, "quota": 12, "skuId&quo

  • JS对象复制(深拷贝和浅拷贝)

    一.浅拷贝 1.Object.assign(target,source,source...) a.可支持多个对象复制 b.如果source和target属性相同 source会复制target的属性 c.target只能为Object对象 var obj = {a:1,b:2} undefined Object.assign({c:3},obj) {c: 3, a: 1, b: 2} obj {a: 1, b: 2} 兼容性写法if(Object.assign){//兼容}else{//不兼容}

  • js对象实现数据分页效果

    本文实例为大家分享了js对象实现数据分页效果的具体代码,供大家参考,具体内容如下 实现数据分页要清楚这个的方面的设计: 1.先模拟建立一个后台数据库,如下: var peoson=[ { "id":"1", " name":"鞠婧祎", "sex":"女", "age":"25", "class":"八班",

  • 详解JS对象遍历的顺序问题

    可能有些同学听过在 JavaScript 中遍历对象顺序不固定的这一说法.事实上,这个说法不是特别准确. 对待遍历顺序,对象有一套自己既定的规则,在此规则下呢,对象的遍历顺序会受插入元素顺序的影响,但是不完全受插入元素先后顺序的影响.如果您有「必须按插入元素顺序遍历」的场景,可以考虑使用 Map. 遍历对象的方法有很多种,我们经常会使用的有 for...in ,除此之外,还有: Object.keys Object.entries Obejct.getOwnerProPertyNames Ref

  • 何时使用Map来代替普通的JS对象

    何时使用Map来代替普通的JS对象

    1. Map 接受任何类型的键 如前所述,如果对象的键不是string或symbol,JS 将隐式地将其转换为字符串. 幸运的是,map的键类型没有问题 const numbersMap = new Map(); numbersMap.set(1, 'one'); numbersMap.set(2, 'two'); [...numbersMap.keys()]; // => [1, 2] 1和2是numbersMap中的键,这些键的类型(数字)保持不变. 可以在mpa中使用任何键类型:数字.布尔

  • js对象属性名驼峰式转下划线的实例代码

    一.题目示例: 思路: 1.匹配属性名字符串中的大写字母和数字 2.通过匹配后的lastIndex属性获取匹配到的大写字母和数字的位置 3.判断大写字母的位置是否为首位置以及lastIndex是否为0,为0则表示匹配结束 4.将存放位置的数组进行从小到大排序,排序后将属性名按照字符串的slice方法切割并使用下划线重组 5.遍历对象的属性名并使用函数改变为新的命名,从新赋值到新的对象上(也可以使用改变对象的ES6新语法) 6.注意,每次在调用函数后,需要清空之前存放位置的数组 二.实现代码 le

  • js对象的读取速度实例详解

    1.访问字面量和局部变量最快,而访问数组元素和对象成员相对较慢.访问对象成员时,就像作用域链一样,在原型链上搜索. 2.如果找到的成员在原型链中的位置太深,访问速度就会变慢. 所以要尽量减少对象成员的搜索次数和嵌套深度. 实例 // 进行两次对象成员查找 function hasEitherClass(element, className1, className2) { return element.className === className1 || element.className ==

  • jQuery.datatables.js插件用法及api实例详解

    jQuery.datatables.js插件用法及api实例详解

    1.DataTables的默认配置 $(document).ready(function() { $('#example').dataTable(); } ); 示例:http://www.guoxk.com/html/DataTables/Zero-configuration.html 2.DataTables的一些基础属性配置 "bPaginate": true, //翻页功能 "bLengthChange": true, //改变每页显示数据数量 "

  • 基于js对象,操作属性、方法详解

    一,概述 在Java语言中,我们可以定义自己的类,并根据这些类创建对象来使用,在Javascript中,我们也可以定义自己的类,例如定义User类.Hashtable类等等. 目前在Javascript中,已经存在一些标准的类,例如Date.Array.RegExp.String.Math.Number等等,这为我们编程提供了许多方便.但对于复杂的客户端程序而言,这些还远远不够. 与Java不同,Java2提供给我们的标准类很多,基本上满足了我们的编程需求,但是Javascript提供的标准类很

  • 原生js中ajax访问的实例详解

    原生js中ajax访问的实例详解 form表单中 登录名: 失去光标即触发事件 function createXmlHttp() { var xmlHttp; try { // Firefox, Opera 8.0+, Safari xmlHttp = new XMLHttpRequest(); } catch (e) { try {// Internet Explorer xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (

  • JS前端实现fsm有限状态机实例详解

    目录 引言 举个栗子 从零开始 获取状态 状态改变 transition 实现fsm状态机 实现钩子函数 完整代码 总结 引言 我们平时开发时本质上就时对应用程序的各种状态进行切换并作出相应处理,最直接的方法就是添加标志位然后考虑所有可能出现的边界问题,通过if...else if...else 来对当前状态进行判断从而达成页面的交互效果, 但随着业务需求的增加各种状态也会随之增多,我们就不得不再次修改if...else代码或者增加对应的判断,最终使得程序的可读性.扩展性.维护性变得很麻烦 有限

  • Vue.js框架路由使用方法实例详解

    Vue.js框架路由使用方法实例详解

    Vue.js框架路由使用方法实例详解 html代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name='viewport' content='width=device-width,initial-

  • Vue.js进行查询操作的实例详解

    Vue.js进行查询操作的实例详解

    Vue.js进行查询操作的实例详解 实例代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script src="../lib/vue.min.js" type="text/javascript" ></script> <title>字符转换</title> </head>

  • JS JSOP跨域请求实例详解

    在项目开发中遇到跨域的问题,一般都是通过JSONP来解决的.但是JSONP到底是个什么东西呢,实现的原理又是什么呢.在项目的空闲时间可以好好的来研究一下了. 1.什么是JSONP? 要了解JSONP,不得不提一下JSON,那么什么是JSON? JSON is a subset of the object literal notation of JavaScript. Since JSON is a subset of JavaScript, it can be used in the langu

  • 微信小程序引用公共js里的方法的实例详解

    微信小程序引用公共js里的方法的实例详解

    微信小程序引用公共js里的方法的实例详解 一个小程序页面由四个文件组成,一个小程序页面的四个文件具有相同路径与文件名,由此我们可知一个小程序页面对应着一个跟页面同名的js文件.可是当有些公共方法,我们想抽离出来成为一个独立公共的js文件.我们该如何实现呢. 在根目录下有一个app.js文件.这个根目录的js 文件我们可以通过getApp()轻松调用. //app.js App({ globaData:'huangenai' }) //test.js var app = getApp(); Pag

  • Java 用反射设置对象的属性值实例详解

    Java 用反射设置对象的属性值实例详解 /** * 用反射设置对象的属性值 * @param obj 需要設置值的對象 * @param fieldName 需要設置值的屬性 * @param value 需要设置的值 * @return 设置值后的对象 */ private Object invoke(Object obj, String fieldName, Object value) { String firstWord = fieldName.substring(0, 1).toUpp

随机推荐