当前位置: 首页 > 编程笔记 >

Javascript字符串拼接小技巧(推荐)

田鸿彩
2023-03-14
本文向大家介绍Javascript字符串拼接小技巧(推荐),包括了Javascript字符串拼接小技巧(推荐)的使用技巧和注意事项,需要的朋友参考一下

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

如果是在一行的,可读性差不说,如果要换行的,会直接报错。

在此介绍几种Javascript拼接字符串的技巧.

字符串相加(+)

var items = '<li class="details">' + 
      '<span>Hello world</span>' + 
      '</li>'; 

利用反斜线拼接字符串

var items = '<li class="details">' \ 
      '<span>Hello world</span>' \ 
      '</li>'; 

利用数组拼接字符串

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

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

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

function StringBuffer(){ 
  this.buffer = []; 
} 
StringBuffer.prototype = { 
  constructor: StringBuffer, 
  append: function(str){ 
    this.buffer.push(str); 
    return this; 
  }, 
  toString: function(){ 
    return this.buffer.join(''); 
  } 
}; 

ES6模板字符串

ES6中引入了一种新型的字面量语法,称为模板字符串。

用反撇号`来代替原来的单引号或双引号.

$('.warning').html(` 
  <h1>Working!</h1> 
  <p>迷糊餐厅</p> 
  <p>区区一只亚麻太</p> 
`); 

字符串中的换行、缩进、空格都会原样输出到新生成的字符串中。

如果想要了解字符串拼接的性能问题,推荐去看Nicholas C.Zakas的《高性能Javascript》一书

以上这篇Javascript字符串拼接小技巧(推荐)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持小牛知识库。

 类似资料:
  • 本文向大家介绍Python字符串中查找子串小技巧,包括了Python字符串中查找子串小技巧的使用技巧和注意事项,需要的朋友参考一下 惭愧啊,今天写了个查找子串的Python程序被BS了… 如果让你写一个程序检查字符串s2中是不是包含有s1。也许你会很直观的写下下面的代码: 可是这是Python,我们可以利用字符串自带的find()方法,于是可以这样: 悲情的事就在于此,原来Python中的关键字"

  • 主要内容:Python字符串和数字的拼接在 Python 中拼接(连接)字符串很简单,可以直接将两个字符串紧挨着写在一起,具体格式为: strname = "str1" "str2" strname 表示拼接以后的字符串变量名,str1 和 str2 是要拼接的字符串内容。使用这种写法,Python 会自动将两个字符串拼接在一起。 【示例】以连续书写的形式拼接字符串: 运行结果: Python教程https://www.xnip.cn/

  • 本文向大家介绍php技巧小结【推荐】,包括了php技巧小结【推荐】的使用技巧和注意事项,需要的朋友参考一下 1 如何定义linux和window通用的文件分隔符号 DIRECTORY_SEPARATOR : 目录分隔符,是定义php的内置常量。在调试机器上,在windows我们习惯性的使用“\”作为文件分隔符,但是在linux上系统不认识这个标识,于是就要引入这个php内置常量了:DIRECTOR

  • 主要内容:使用连接运算符“+”,使用 concat() 方法,连接其他类型数据对于已经定义的字符串,可以对其进行各种操作。连接多个字符串是字符串操作中最简单的一种。通过字符串连接,可以将两个或多个字符串、字符、整数和浮点数等类型的数据连成一个更大的字符串。 String 字符串虽然是不可变字符串,但也可以进行拼接只是会产生一个新的对象。String 字符串拼接可以使用“+”运算符或 String 的 concat(String str) 方法。 “+”运算符优势是可以连接任

  • 本文向大家介绍JavaScript小技巧整理,包括了JavaScript小技巧整理的使用技巧和注意事项,需要的朋友参考一下 本文整理总结了JavaScript的小技巧。分享给大家供大家参考,具体如下: 1.组织默认事件 阻止默认事件,h5默认的input type='date'在某些浏览器和android设备上没有效果,这时要调用h5+的时间选择器,但是要组织input默认的click事件,代码如

  • 本文向大家介绍JavaScript常用小技巧小结,包括了JavaScript常用小技巧小结的使用技巧和注意事项,需要的朋友参考一下 前言      总结一下最近接触到的JavaScript语法糖,与大家共享。      每块糖都有详细的说明和示例,就不多说了。 准确的类型检查  优雅的添加原型方法  快捷创建命名空间