本文给大家汇总介绍了几种javascript中字符串拼接的方法,十分的简单实用,有需要的小伙伴可以参考下。

在JavaScript中会经常遇到字符串拼接,但是如果要拼接的字符串过长就比较麻烦了。

如果在一行的话,可读性太差;如果换行的话,会直接报错。

现在就来介绍几个JavaScript拼接字符串的几个小技巧(主要针对字符串过长的情况)。

1. 字符串相加(+)

1
2
3
var empList = ' <li data-view-section="details">'+
      '<span>Hello world</span>'+
     '</li>';

2.利用反斜杠拼接字符串

1
2
3
var empList = ' <li data-view-section="details">\
      <span>Hello world</span>\
    </li>';

3. 利用数组拼接字符串

复制代码代码如下:

var empList = ['<li data-view-section="details">', '<span>Hello world</span>','</li>'].join("");

利用数组的join方法,把数组转成字符串

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function StringBuffer(){
  this.buffer = [];
}
//将新添加的字符串添加到数组中
StringBuffer.prototype.append = function(str){
  this.buffer.push(str);
  return this;
};
//转成字符串
StringBuffer.prototype.toString = function(){
  return this.buffer.join("");
};
//用法
var buffer = new StringBuffer();
buffer.append("hello");
buffer.append(',world');
console.log(buffer.toString());

在数组方法的基础上可以封装一个类似Java中的StringBuffer的类来完成字符串的拼接。

以上所述就是本文的全部内容了,希望大家能够喜欢。

浅谈JavaScript字符串拼接的更多相关文章

  1. 谈JavaScript组合拼接字符串的效率 --转载

    JavaScript组合拼接字符串的效率.在脚本开发过程中,经常会按照某个规则,组合拼接出一个大字符串进行输出.比如写脚本控件时控制整个控件的外观的HTML标签输出,比如AJAX里得到服务器端的回传值 ...

  2. 浅谈 js 字符串之神奇的转义

    原文:浅谈 js 字符串之神奇的转义 字符串在js里是非常常用的,但是你真的了解它么?翻阅<MDN String>就可以了解它的常见用法了,开门见山的就让你了解了字符串是怎么回事. 'st ...

  3. 浅谈 JavaScript 编程语言的编码规范

    对于熟悉 C/C++ 或 Java 语言的工程师来说,JavaScript 显得灵活,简单易懂,对代码的格式的要求也相对松散.很容易学习,并运用到自己的代码中.也正因为这样,JavaScript 的编 ...

  4. 浅谈JavaScript中的null和undefined

    浅谈JavaScript中的null和undefined null null是JavaScript中的关键字,表示一个特殊值,常用来描述"空值". 对null进行typeof类型运 ...

  5. 浅谈JavaScript中的正则表达式(适用初学者观看)

    浅谈JavaScript中的正则表达式 1.什么是正则表达式(RegExp)? 官方定义: 正则表达式是一种特殊的字符串模式,用于匹配一组字符串,就好比用模具做产品,而正则就是这个模具,定义一种规则去 ...

  6. 浅谈javascript函数节流

    浅谈javascript函数节流 什么是函数节流? 函数节流简单的来说就是不想让该函数在很短的时间内连续被调用,比如我们最常见的是窗口缩放的时候,经常会执行一些其他的操作函数,比如发一个ajax请求等 ...

  7. 浅谈JavaScript中的闭包

    浅谈JavaScript中的闭包 在JavaScript中,闭包是指这样一个函数:它有权访问另一个函数作用域中的变量. 创建一个闭包的常用的方式:在一个函数内部创建另一个函数. 比如: functio ...

  8. 浅谈JavaScript浮点数及其运算

    原文:浅谈JavaScript浮点数及其运算     JavaScript 只有一种数字类型 Number,而且在Javascript中所有的数字都是以IEEE-754标准格式表示的.浮点数的精度问题 ...

  9. 浅谈 js 字符串 trim 方法之正则篇

    原文:浅谈 js 字符串 trim 方法之正则篇 关于 trim 其实没啥好说的,无非就是去除首位空格,对于现代浏览器来说只是简单的正则 /^\s+|\s+$/ 就可以搞定了.而且支持中文空格   等 ...

随机推荐

  1. JS——制作简单的网页计算器

    用JS做了一个简易的网页计算器 <!DOCTYPE html> <html lang="en"> <head> <meta charset ...

  2. jquery——事件冒泡、事件委托

    一个事件冒泡的例子: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...

  3. I - Defeat the Enemy UVALive - 7146 二分 + 贪心

    https://icpcarchive.ecs.baylor.edu/index.php?option=com_onlinejudge&Itemid=8&page=show_probl ...

  4. Spring Cloud下使用Feign Form实现微服务之间的文件上传

    背景 ​ Spring Cloud现在已经被越来越多的公司采用了,微服务架构比传统意义上的单服务架构从复杂度上多了很多,出现了很多复杂的场景.比如,我们的产品是个app,支持第三方登录功能,在手机端调 ...

  5. SVN的搭建(入门篇)

    如果转载,请注明出处,谢谢 1.安装SVN # yum install subversion 2.创建一个仓库 创建一个仓库svnrepos # svnadmin create /usr/svnrep ...

  6. vnc安装问题

    在xenserver中安装vncserver软件.启动显示正常 用grep命令查看也确实有线程在运行. 但实际上用命令service vncserver status查看vnc状态,显示没有桌面在运行 ...

  7. WCF 内置绑定在不同的传输安全模式下的信道层

    basicHttpBinding Transport安全模式信道层 Message安全模式信道层 TransportWithMessageCredential安全模式信道层 TransportCred ...

  8. TAS5508 output changing

    1.如果信号从3th通道输入,正常就是从PWM5,6输出,现在要想从PWM7,8输出,就按照以下红线部分选择DAP CH5和DAP CH6,然后写入相应寄存器产生的12 bytes的数组数据即可.

  9. 禁止ASP.NET MVC模型绑定时将空字符串绑定为null

    为model添加[DisplayFormat(ConvertEmptyStringToNull = false)] [Display(ResourceType = typeof(AppStrings) ...

  10. OpenCV转为灰度图像 & 访问像素方法

    cvtColor(src, dst, CV_RGB2GRAY); 可转为灰度图像. 彩色图像像素访问:image.at<Vec3b>(i, j)[0],image.at<Vec3b& ...