javascript中字符串拼接需注意的问题

在开发中大家也都会注意尽量使用StringBuilder而不采用普通的字符串拼接方式。但是可能大部分开发者却忽略了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 StringBuilder();
for(var i=0;i<10000;i++){
sb.append("stext");
}
var result=sb.toString();
d2=new Date();
document.write("数组方式耗时："+(d2.getTime()- d1.getTime())+"毫秒；");
}
/////利用Array实现的字符串拼接函数，为方便c#开发者特意取名StringBuilde以便于理解
function StringBuilder(){
this._strings_=new Array;
}
StringBuilder.prototype.append=function(str){
this._strings_.push(str);
};
StringBuilder.prototype.toString=function(){
return this._strings_.join("");
};

三次执行 xntest()函数后的结果为：

字符串拼接方式耗时：735毫秒；数组方式耗时：62毫秒；
字符串拼接方式耗时：766毫秒；数组方式耗时：63毫秒；
字符串拼接方式耗时：703毫秒；数组方式耗时：63毫秒；

此例是拼接10000次字符串的性能测试，相信结果大家有目共睹，有兴趣的朋友可以自己测试一下。
所以 ，在前台开发中我们也应尽量避免大规模的字符串拼接操作，应采用数组方式来合理提高代码效率。

赞 (0)

相关推荐

  • javascript中字符串拼接详解

    最近在研究<javascript高级程序设计>中,有一段关于字符串特点的描述,原文大概如下:ECMAScript中的字符串是不可变的,也就是说,字符串一旦创建,他们的值就不能改变.要改变某个变量的保存的的字符串,首先要销毁原来的字符串,然后再用另外一个包含新值的字符串填充该变量,例如: 复制代码 代码如下: var lang = "Java"; lang = lang + "Script"; 实现这个操作的过程如下:首先创建一个能容纳10个字符的新字符串

  • JavaScript 学习笔记二 字符串拼接

    var str="hello"; str+="world"; 实际上,这段代码在幕后执行的步骤如下: (1) 创建存储"hello"的字符串. (2) 创建存储"world"的字符串. (3) 创建存储连接结果的字符串. (4) 把str的当前内容复制到结果中. (5) 把"world"复制到结果中. (6) 更新str,使它指向结果. 每次完成字符串连接都会执行步骤2到6,使得这种操作非常消耗资源.如果重

  • JavaScript中字符串拼接的基本方法

    非常简单,就用一个"+"将两个字符串"相加": var longString = "One piece " + "plus one more piece."; 要将多个字符串累积为一个字符串,还可以使用"+="操作符: var result = ""; result += "My name is Anders" result += " and my age

  • javascript中字符串拼接需注意的问题

    在开发中大家也都会注意尽量使用StringBuilder而不采用普通的字符串拼接方式.但是可能大部分开发者却忽略了js中也需要注意这种效率问题. 下面进行一项性能测试,用事实来说话! 复制代码 代码如下: function xntest(){ var d1=new Date(); var str=""; for(var i=0;i<10000;i++){ str+="stext"; } var d2=new Date(); document.write(&qu

  • Javascript中字符串相关常用的使用方法总结

    刚刚在看Javascript犀牛书,看到字符串这一节,平时工作接触到这方面的不多,想着整理下,以备不时只需. JavaScript的内置功能之一就是字符串连接,如果用'+'连接两个数字,表示两数相加.但是如果用于字符串,就表示第二个字符加在第一个字符之后. var num=1+2; console.log(num); var msg='hello'+'world'; console.log(msg); 对于字符串来说,除了有length属性,还有很多其他有用的属性,如: var str='hel

  • JavaScript中字符串的常用方法总结

    目录 1.字符串长度 2.查找字符串中的位置 indexOf() lastIndexOf() search() 3.提取部分字符串 slice() substring() substr() 4.替换字符串内容 5.转换为大写和小写 6.连接字符串 7.删除字符串两端的空白符 8.提取字符串字符 1.字符串长度 length 属性返回字符串的长度: var str = "字符串常用方法总结-东东吖"; str.length; //13 2.查找字符串中的位置 有三种查找字符串中的位置:

  • JavaScript中字符串分割函数split用法实例

    本文实例讲述了JavaScript中字符串分割函数split用法.分享给大家供大家参考.具体如下: 先来看下面这段代码: <script type="text/javascript"> var str="How are you doing today?" document.write(str.split(" ") + "<br />") document.write(str.split("&q

  • javascript中字符串的定义示例代码

    复制代码 代码如下: <html> <head> <title>javascript中字符串的定义</title> <script> //定义字符串 //第一种 var str = new Array(); alert(str);//空字符 //第二种 var str2 = new Array("hello"); alert(str2);//hello //第三种 /* String 对象可用字符串文字显式创建. 用这种方法创

  • JavaScript中字符串与Unicode编码互相转换的实现方法

    JavaScript中字符串与Unicode编码互相转换的实现方法

    本文实例讲述了JavaScript中字符串与Unicode编码互相转换的实现方法.分享给大家供大家参考,具体如下: 这段代码演示了JavaScript中字符串与Unicode编码的转换: // 为了控制台的演示方便, 变量没有添加 var 定义 // 实际编程中请避免 // 字符串 str = "中文"; // 获取字符 char0 = str.charAt(0); // "中" // 数字编码值 code = str.charCodeAt(0); // 20013

  • 浅谈javascript中字符串String与数组Array

    简单点就是string是字符(串)... 而array是数组...可以放数字啊,字符啊等一系列东东!!! 上个示例: 复制代码 代码如下: var str = "liuzhanqi"; document.write(str["length"]);//等价str.l ength  var str = string.fromcharcode(72, 101, 108, 108, 111, 33); document.write(str); //各整数作为unicode编

  • 基于JavaScript中字符串的match与replace方法(详解)

    基于JavaScript中字符串的match与replace方法(详解)

    1.match方法 match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配. match()方法的返回值为:存放匹配结果的数组. 2.replace方法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串. replace方法的返回值为:一个新的字符串. 3.说明 以上2个方法的参数在使用正则表达式时主要添加全局g,这样才能对字符串进行全部匹配或者替换. 示例代码: <!DOCTYPE html> <html lang

随机推荐