本文给大家汇总介绍了几种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. java动态线程池LinkedBlockingQueue和SynchronousQueue比较

    import java.util.concurrent.Callable; public class MyCallable implements Callable<String> { pr ...

  2. js中去掉字符中间空格和首尾空格

    转载: https://www.jb51.net/article/109522.htm 1.  去掉字符串前后所有空格: 代码如下: ? 1 2 3 4 function Trim(str)  {   ...

  3. CUDA杂谈

    这一年都在编写CUDA的程序,用了很多优化的手段,发现大部分其实还是官方的指南里面的手段 https://docs.nvidia.com/cuda/cuda-c-best-practices-guid ...

  4. Storm概念学习系列之Task任务

    不多说,直接上干货! 每一个Spout/Bolt的线程称为一个Task. Task任务 Task是运行Spout或Bolt的单元,每一个Spout/Bolt的线程称为一个Task. 在Storm 0. ...

  5. 【踩坑】socket.io服务器不能访问

    今天在单机测试socket.io服务器时一切正常,但用jar包的方式部署在服务器时发现客户端无法连接. 于是做了一系列排查,如检查端口是否在占用,防火墙有没有开放该端口,阿里云终端是否有开放安全组,本 ...

  6. centos6安装lnmp

    CentOS 6 默认仓库不包含nginx,我们可以手动添加nginx的仓库. 访问nginx官网获取repo文件 我们需要先访问nginx的官方网站,获取官方的仓库地址.点击这里访问nginx官方文 ...

  7. win10+asp+access 父路径开启无效

    如题: 在win10环境下,布署asp+access,发现在用到"../website/"时就出错,提示不能使用父路径 可是我在IIS 的asp中明明打开了父路径的 如下 但是偏偏 ...

  8. Oracle SQL Developer-3.2.20.09.87 Windows 10启动问题处理&配置

    用了好多年的工具,准备在笔记本上使用时启动不了,但在办公室PC上可以正常使用.两者电脑OS都一样,一个是全新安装.一个是从Windows 7升级而来.下载了最新版发现版本到17了,Oracle刷版本号 ...

  9. bank conflct 一句话总结

    由于最新的多播模式区别于原来的广播模式,原来同一个warp不同线程访问同一个bank的相同地址不再是bank conflict, 现在总结为:只要同一个 warp 的不同线程会访问到同一个 bank ...

  10. 使用腾讯IP分享计划网站中的纯JS省市区三级联动

    JS地址:http://ip.qq.com/js/geo.js 实例如下: <!DOCTYPE html> <html> <head> <title>省 ...