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

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,并且字符串大小较大或数量较多时,那么数组技术就很值得。

时间: 2024-08-22 15:12:02

数组方法解决JS字符串连接性能问题有争议_javascript技巧的相关文章

js字符串操作总结(必看篇)_javascript技巧

字符方法 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>字符方法</title> </head> <body> <script type="text/javascript"> /* charAt方法和charCodeAt方法都接收一个参数,基于0的

JS 字符串连接[性能比较]_javascript技巧

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

js 字符串转化成数字的代码_javascript技巧

方法主要有三种 转换函数.强制类型转换.利用js变量弱类型转换. 1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把值转换成浮点数.只有对String类型调用这些方法,这两个函数才能正确运行:对其他类型返回的都是NaN(Not a Number). 一些示例如下: parseInt("1234blue"); //returns 1234 parseInt("0xA"); //returns 10 par

关于javascript字符串连接性能

最近在看<高性能网站建设进阶指南>,第七章为<编写高效的javascript>,作者为Nicholas C. Zakas(同时也是<javascript高级程序设计>的作者),里面讲到字符串连接的优化问题. 字符串连接一直是javascript中性能最低的操作之一,通常情况下,字符串连接是通过使用加法运算符(+)来实现的,比方说 var text="hello"; text+=" "; text+="world!&quo

js字符串连接效率问题

问题描述 js字符串连接效率问题 function StringBuffer() { this.__strings__ = new Array; //这里也可以去掉括号 } StringBuffer.prototype.append = function (str) { this.__strings__.push(str); } StringBuffer.prototype.toString = function () { return this.__strings__.join(""

js字符串连接代码与注意事项及效率

function xntest(){ var d1=new date(); var str=""; for(var i=0;i<10000;i++){ str+="stext"; } var d2=new date(); document.write(" 字符串拼接方式耗时:"+(d2.gettime()- d1.gettime())+"毫秒:"); d1=new date(); var sb=new array();

javascript 字符串连接的性能问题(多浏览器)_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字符串转换成xml对象并使用技巧解读_javascript技巧

在java端将字符串转化为xml对象可以使用DocumentHelper.parseText(xmlReturn).getRootElement(); 在js中同样有方法可以将字符串转化为xml对象,可以使用如下函数 以下是引用片段: 复制代码 代码如下: function createXml(str){ if(document.all){ var xmlDom=new ActiveXObject("Microsoft.XMLDOM") xmlDom.loadXML(str) retu

JS截取字符串常用方法整理及使用示例_javascript技巧

使用 substring()或者slice() 函数:split() 功能:使用一个指定的分隔符把一个字符串分割存储到数组 例子: 复制代码 代码如下: str="jpg|bmp|gif|ico|png"; arr=theString.split("|"); //arr是一个包含字符值"jpg"."bmp"."gif"."ico"和"png"的数组 函数:John()