数组方法解决JS字符串连接性能问题有争议

1、传统上，字符串连接一直是js中性能最低的操作之一。
var text="Hello";
text+=" World!";
早期浏览器没有对这种运算进行优化。
由于字符串是不可变的，这意味着要创建中间字符串来存储连接的结果。频繁地在后台创建和销毁字符串导制性能异常低下。
2、发现这一点后，开发者们利用数组对象进行优化。
var buffer=[],i=0;
buffer[i++]="Hello";//通过相应索引值添加元素比push方法快
buffer[i++]=" World!";
var text=buffer.join("");
在早期的浏览器中，没有创建和销毁中间字符串，在大量字符串连接情况下，这技术已被证明远快于使用加法方式。
3、如今浏览器对字符串的优化已经改变了字符串相连的局面。
Safari、Opera、Chrome、Firefox和IE8都在使用加法运算符上表现出了更好的性能。但是，IE8之前的版本没有优化，因此数组方法依然有效。
这并不意味着字符串相连时我们要进行浏览器检测。在决定如何连接时要考虑的是字符串的大小和数量。
1）当字符串相对较小（<20字符）且连接数量也较小时(<1000个），所有的浏览器使用加法运算符都能在不到1豪秒内轻松完成连接。
2）增加字符串数量或大小时，IE7中性能会明显下降。
3）字符串大小增加时，Firefox中加法运算符和数组成技巧性能差异会变小。
4）字符串数量增加时，Safari中加法运算符和数组成技巧性能差异会变小。
5）改变字符串数量或大小时，Chrome和Opera中加法运算符一直保持领先优势。
所以，由于在各浏览器下性能不一致，选用技术取决于实际情况和面对的浏览器。
大多数情况下，加法运算符是首选；如果用户主要使用IE6或7，并且字符串大小较大或数量较多时，那么数组技术就很值得。

赞 (0)

相关推荐

  • 你必须知道的JavaScript 中字符串连接的性能的一些问题

    你必须知道的JavaScript 中字符串连接的性能的一些问题

    而JavaScript的核心是ECMAScript .与其他语言类似,ECMAScript 的字符串是不可变的,即它们的值不能改变. 请考虑下面的代码: 复制代码 代码如下: var str = "hello ";str += "world";实际上,这段代码在幕后执行的步骤如下: 1.创建存储 "hello " 的字符串.2.创建存储 "world" 的字符串.3.创建存储连接结果的字符串.4.把 str 的当前内容复制到结

  • javascript下高性能字符串连接StringBuffer类

    复制代码 代码如下: function StringBuffer(){ this.__strings__ = new Array(); } StringBuffer.prototype.append = function(str){ this.__strings__.push(str); }; StringBuffer.prototype.toString = function(){ this.__strings__.join(" "); }; 其实上面的代码,主要利用了js的数组原理

  • JS 字符串连接[性能比较]

    一.ECMAScript的字符串是不可变的,即它们的值不能改变,因此当你写出下面的代码的时候发生了什么呢? Js代码 复制代码 代码如下: var str = "Hello "; str += "world"; 执行的步骤如下: 创建存储"Hello"的字符串 创建存储"world"的字符串 创建存储连接结果的字符串 把str的当前内容复制到结果中 把"world"复制到结果中 更新str,使它指向结果 每

  • 再论Javascript下字符串连接的性能

    1 如何进行字符串连接? 首先让我们来回顾一下字符串连接的两种常用方法: 1.1 使用字符串连接运算符 常用的语言(如Java.C#.PHP等)都有字符串连接运算符,Javascript也不例外,代码示例: 复制代码 代码如下: var str = ""; str = str + "a"; 1.2 使用数组 在常用的语言中,字符串连接运算的性能普遍不高,为此在C#中就专门提供了StringBuilder(Java中提供了StringBuffer)用于连接字符串.而在

  • 温故知新——JavaScript中的字符串连接问题最全总结（推荐）

    ECMAScript 中最常见的一个问题是字符串连接的性能.与其他语言类似,ECMAScript 的字符串是不可变的,即它们的值不能改变.请考虑下面的代码: var str = "hello "; str += "world"; 实际上,这段代码在幕后执行的步骤如下: 1.创建存储 "hello " 的字符串. 2.创建存储 "world" 的字符串. 3.创建存储连接结果的字符串. 4.把 str 的当前内容复制到结果中.

  • JavaScript 字符串连接性能优化

    复制代码 代码如下: var str = "hello"; str += " world"; 后台所做工作: 1)创建存储 "hello" 的字符串,且使 str 指向它. 2)创建存储 "world" 的字符串. 3)创建存储结果的字符串. 4)将 str 中的当前内容复制到结果字符串中. 5)把 world 复制到结果字符串中. 6)更新 str ,使 str 指向结果字符串. 每拼接一次字符串就循环重复2)~6),如果重

  • javascript 字符串连接的性能问题(多浏览器)

    书中附带的测试代码如下  复制代码 代码如下: <html> <head> <title>Example</title> </head> <body> <p><strong>Note:</strong> The latest versions of Firefox seem to have fixed the string concatenation problem. If you are usin

  • 浅谈JS中的三种字符串连接方式及其性能比较

    工作中经常会碰到要把2个或多个字符串连接成一个字符串的问题,在JS中处理这类问题一般有三种方法,这里将它们一一列出顺便也对它们的性能做个具体的比较. 第一种方法 用连接符"+"把要连接的字符串连起来: str="a"; str+="b"; 毫无疑问,这种方法是最便捷快速的,如果只连接100个以下的字符串建议用这种方法最方便. 第二种方法 以数组作为中介用 join 连接字符串: var arr=new Array(); arr.push(a);

  • 数组方法解决JS字符串连接性能问题有争议

    1.传统上,字符串连接一直是js中性能最低的操作之一. var text="Hello"; text+=" World!"; 早期浏览器没有对这种运算进行优化. 由于字符串是不可变的,这意味着要创建中间字符串来存储连接的结果.频繁地在后台创建和销毁字符串导制性能异常低下. 2.发现这一点后,开发者们利用数组对象进行优化. var buffer=[],i=0; buffer[i++]="Hello";//通过相应索引值添加元素比push方法快 bu

  • 24个ES6方法解决JS实际开发问题(小结)

    本文主要介绍 24 中 es6 方法,这些方法都挺实用的,本本请记好,时不时翻出来看看. 1.如何隐藏所有指定的元素: const hide = (el) => Array.from(el).forEach(e => (e.style.display = 'none')); // 事例:隐藏页面上所有`<img>`元素? hide(document.querySelectorAll('img')) 2.如何检查元素是否具有指定的类 ? 页面DOM里的每个节点上都有一个 classL

  • 让javascript加载速度倍增的方法(解决JS加载速度慢的问题)

    通常我们的网站里面会加载一些js代码,统计啊,google广告啊,百度同盟啊,阿里妈妈广告代码啊, 一堆,最后弄得页面加载速度很慢,很慢. 解决办法:换一个js包含的方式,让javascript加载速度倍增. 把通常加载方式: <script src="xxxx.js"></script> 改变成: 复制代码 代码如下: <script type="text/javascript"> document.write("&l

  • 改进 ASP 的字符串处理性能

    改进 ASP 的字符串处理性能

    大多数 Active Server Pages (ASP) 应用程序都要通过字符串连接来创建呈现给用户的 HTML 格式的数据.本文对几种创建此 HTML 数据流的方法进行了比较,在特定情况下,某些方法在性能方面要优于其他方法.本文假定您已经具备一定的 ASP 和 Visual Basic 编程方面的知识. 目录 简介 ASP 设计 字符串连接 快捷的解决方案 StringBuilder 内置方法 测试 结果 小结 简介 编写 ASP 页面时,开发人员实际上是创建一个格式化的文本流,通过 ASP

  • 探讨js字符串数组拼接的性能问题

    我们知道,在js中,字符串连接是性能最低的操作之一. 例如: 复制代码 代码如下: var text="Hello";  text+=" World!"; 早期浏览器没有对这种运算进行优化. 由于字符串是不可变的,这意味着要创建中间字符串来存储连接的结果.频繁地在后台创建和销毁字符串导制性能异常低下. 因此,可以利用数组对象进行优化. 例如: var buffer=[],i=0; buffer[i++]="Hello"; //通过相应索引值添加元

  • Linux fgetcsv取得的数组元素为空字符串的解决方法

    但服务器上,很多使用Linux服务器,源程序使用UTF-8,这样很容易产生字符编码的问题. 如果仅仅将CSV文件转码为UTF-8,这样在Windows服务器上没有问题, 而在RedHat5.5上,用fgetcsv取得的数组中,如果某列的内容是中文,则该列对应的数组元素为空字符串,而英文则正常. 这时,需要设置区域: setlocale(LC_ALL, 'zh_CN.UTF-8'); 代码如下 复制代码 代码如下: // 上传的CSV文件,通常是用Excel编辑的GBK编码, // 而源代码是UT

随机推荐