写在前面

面试的过程,很有可能面试到c#那种方式拼接字符串更高效,然后就会引申到js中的拼接方式。这也是我在面试中遇到的问题,当时,也真没比较过js中到底哪种方式更高效。然后,跟猜测一样,说了使用数组的方式,然后使用join方法实现。

代码测试

 <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>字符串拼接</title>
<script type="text/javascript">
var start = new Date();
var str = "";
for (var i = 0; i < 1000000; i++) {
str += "test";
}
var end = new Date();
document.writeln("+拼接字符串,耗时:" + (end.getMilliseconds() - start.getMilliseconds()));
document.writeln("<br/>");
var begin = new Date();
var arry = new Array();
for (var i = 0; i < 1000000; i++) {
arry.push("test");
}
arry.join("");
var stop = new Date();
document.writeln("数组方式拼接字符串,耗时:" + (stop.getMilliseconds() - begin.getMilliseconds()));
</script>
</head>
<body>
</body>
</html>

测试结果
IE11

+拼接字符串,耗时:39
数组方式拼接字符串,耗时:31

IE11兼容性视图

+拼接字符串,耗时:40
数组方式拼接字符串,耗时:33

IE10

+拼接字符串,耗时:39
数组方式拼接字符串,耗时:32

IE9

+拼接字符串,耗时:36
数组方式拼接字符串,耗时:33

IE8

+拼接字符串,耗时:35
数组方式拼接字符串,耗时:35

IE7

+拼接字符串,耗时:37
数组方式拼接字符串,耗时:35

总结

在面试过程中遇到的一个知识点,在此记录一下。

js中高效拼接字符串的更多相关文章

  1. js 高效拼接字符串

    <script>//如果我们大量使用+=进行字符串拼接的话,将会使界面失去响应(卡死状态) //高效拼接字符串 var StringBuilder=function() { this.da ...

  2. [转]JS中对象与字符串的互相转换

    原文地址:http://www.cnblogs.com/luminji/p/3617160.html 在使用 JSON2.JS 文件的 JSON.parse(data) 方法时候,碰到了问题: thr ...

  3. JS中对象与字符串的互相转换

    在使用 JSON2.JS 文件的 JSON.parse(data) 方法时候,碰到了问题: throw new SyntaxError('JSON.parse'); 查询资料,大概意思如下: JSON ...

  4. Js中常用的字符串,数组,函数扩展

    由于最近辞职在家,自己的时间相对多一点.所以就根据prototytpeJS的API,结合自己正在看的司徒大神的<javascript框架设计>,整理了下Js中常用一些字符串,数组,函数扩展 ...

  5. js中多行字符串拼接

    前言 我们会经常遇到这样的场景,需要拼接多行字符串,在字符串中动态插入一些数据以达到业务的需求.但是js中并没有标准的多行编辑的函数,于是聪明的程序员们便脑洞大开,书写出许多有趣的方法. 1 2 3 ...

  6. js中使用进行字符串传参

    在js中拼接html标签传参时,如果方法参数是字符串需要加上引号,这里需要进行字符转义 <a href='javascript:addMenuUI("+"\"&qu ...

  7. 源码上看 .NET 中 StringBuilder 拼接字符串的实现

    前几天写了一篇StringBuilder与TextWriter二者之间区别的文章(链接).当时提了一句没有找到相关源码,于是随后有很多热心人士给出了相关的源码链接(链接),感谢大家.这几天抽了点时间查 ...

  8. js中把JSON字符串转换成JSON对象最好的方法

    在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式: 1.一种为使用eval()函数. 2. 使用Function对象来进行返回解析. 第一种解析方式:使用eval函数来解析,并且使用j ...

  9. Js中把JSON字符串转换为JSON对象(eval()、new Function())

    在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式: 1.一种为使用eval()函数. 2. 使用Function对象来进行返回解析. 第一种解析方式:使用eval函数来解析,并且使用j ...

随机推荐

  1. vue-cli 中引入 jq

    vue-cli webpack 引入jquery   今天费了一下午的劲,终于在vue-cli 生成的工程中引入了jquery,记录一下.(模板用的webpack) 首先在package.json里的 ...

  2. WTForm

    Flask-WTForm: from flask import Flask,render_template,request,redirect from wtforms.fields import co ...

  3. cf975d Ghosts

    ref #include <algorithm> #include <iostream> #include <cstdio> #include <map> ...

  4. sqlserver中top 1 赋值的问题

    看代码 declare @iid intselect @iid=111select top 1 @iid=isnull(IID,0) from YYGL_PCDMX where IID=0print ...

  5. Box 类

    public class Box extends JComponent implements Accessible使用 BoxLayout 对象作为其布局管理器的一个轻量级容器.Box 提供几个对使用 ...

  6. 【转】BehaviorDesigner学习

    BehaviorDesigner学习   行为树: 行为树设计师插件是一个专门为unity设计的AI插件. 通过继承Behavior中的Task下的四个节点,可以创建自己的行为树节点. 行为树中的自定 ...

  7. mysql-Innodb事务隔离级别-repeatable read详解1

    经验总结: Python使用MySQLdb数据库后,如使用多线程,每个线程创建一个db链接,然后再各自创建一个游标cursor,其中第一个线程读一个表中数据为空,第二个写入该表一条数据并提交,第一个线 ...

  8. [LOJ#2328]「清华集训 2017」避难所

    [LOJ#2328]「清华集训 2017」避难所 试题描述 "B君啊,你当年的伙伴都不在北京了,为什么你还在北京呢?" "大概是因为出了一些事故吧,否则这道题就不叫避难所 ...

  9. pq

    pq 题目描述 小q 的女朋友送给小q nn个整数.但是这些数太大了,小q 的女朋友拿不动,于是拜托小q把这些数减少一些. 小q 每次可以选择其中的两个x,yx,y (不能同时选择同一个数) 变成x− ...

  10. bzoj3105【CQOI2013】新nim游戏

    题意:http://www.lydsy.com/JudgeOnline/problem.php?id=3105 sol  :要想必胜则拿完后异或空间不能包含0,即给对手留下一组线性基 为保证拿走的最小 ...