js 字符串拼接的4种方法

这篇具有很好参考价值的文章主要介绍了js 字符串拼接的4种方法。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

一、使用连接符 + 把想要连接的字符串串起来

let shy = '帅哥'
let a =  '我是' + shy
console.log(a)  // 我是帅哥

js字符串拼接函数,前端(html+css+js)知识点杂烩,javascript,前端,js

二、模板字符串

模板字符串(template string)是增强版的字符串,用反引号(`)标识,特点:

1) 字符串中可以出现换行符

2) 可以使用 ${xxx} 形式输出变量

1. 最基础的变量拼接

// 变量拼接
let shy = '帅哥'
let a =  `我是${shy}`
console.log(a)  // 我是帅哥

js字符串拼接函数,前端(html+css+js)知识点杂烩,javascript,前端,js

2. 在模版字符串中使用htnl代码以及多行文本代码

// html代码以及换行文本
let hi=`<div>
    <h2>你好呀!</h2>
</div>`
console.log(hi)  // 原样输出,包括换行

js字符串拼接函数,前端(html+css+js)知识点杂烩,javascript,前端,js

3. 插入一个表达式

// 插入表达式
let x=30;
let y=10;
let a=`x-y=${x-y}`
console.log(a)  // 输出表达式计算结果

js字符串拼接函数,前端(html+css+js)知识点杂烩,javascript,前端,js

4. 在模版字符串里面调用函数表达式

let food=function(){
    return "苹果"
}
let a=`我喜欢吃${food()}`;
console.log(a)

js字符串拼接函数,前端(html+css+js)知识点杂烩,javascript,前端,js

 

三、使用 js的 concat() 方法连接字符串或数组

concat() 方法用于连接两个或多个数组或者字符串。

该方法不会改变现有的数组,而仅仅会返回被连接的新数组。

字符串就会拼接在一起

// 拼接数组
let a = ['java']
let b = ['script']

let str = a.concat(b)

console.log(a)
console.log(b)
console.log(str)  //  ["java", "script"]

js字符串拼接函数,前端(html+css+js)知识点杂烩,javascript,前端,js

 

// 拼接字符串
let a = 'java'
let b = 'script'

let str = a.concat(b)

console.log(a)
console.log(b)
console.log(str)  // javascript

js字符串拼接函数,前端(html+css+js)知识点杂烩,javascript,前端,js

四、使用 js的 join() 方法,把数组中的所有元素放入一个字符串

join() 方法把数组中的所有元素放入一个字符串:

join()——默认每个元素中之间是逗号隔开

join("-")——每个元素之间以- 隔开,分隔符可自定义

var arr=[1,2,3];
var str=arr.join();// 默认是逗号,也可以自定义连接符
var str2=arr.join('-');// 自定义连接符-
var str3=arr.join('.');// 自定义连接符-
console.log(arr); // [1,2,3]
console.log(str); // 1,2,3
console.log(str2); // 1-2-3
console.log(str3); // 1.2.3

js字符串拼接函数,前端(html+css+js)知识点杂烩,javascript,前端,js

 

参考资料: 1、 https://blog.csdn.net/chenjunxing1992/article/details/125514168?utm_medium=distribute.pc_relevant.none-task-blog-2~default~baidujs_baidulandingword~default-1-125514168-blog-128062139.235^v35^pc_relevant_increate_t0_download_v2&spm=1001.2101.3001.4242.2&utm_relevant_index=4

2、 js 字符串拼接的几种方法_sunhongyu007的博客-CSDN博客

3、 常用的数组Api(方法)_lse717的博客-CSDN博客文章来源地址https://www.toymoban.com/news/detail-621119.html

到了这里,关于js 字符串拼接的4种方法的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 在 SQL Server 中,可以使用加号运算符(+)来拼接字符串。但是,如果需要拼接多个字符串或表中的字段,就需要使用内置的拼接函数了

    以下是 SQL Server 中的一些内置拼接函数: 1. CONCAT:将两个或多个字符串拼接在一起。语法为: 示例: 2. CONCAT_WS:与 CONCAT 类似,但可以指定一个分隔符。语法为: 示例: 3. CONCATN:将多个字符串拼接在一起,并在每个字符串之间添加指定的字符。语法为: 示例: 4. REPLAC

    2024年02月07日
    浏览(57)
  • 华为OD机试 - 字符串拼接(Java & JS & Python & C)

    题目描述 给定 M(0 M ≤ 30)个字符(a-z),从中取出任意字符(每个字符只能用一次)拼接成长度为 N(0 N ≤ 5)的字符串, 要求相同的字符不能相邻,计算出给定的字符列表能拼接出多少种满足条件的字符串, 输入非法或者无法拼接出满足条件的字符串则返回0。 输入描

    2024年01月22日
    浏览(68)
  • 怎么将拼接的字符串element组件通过“v-html“渲染到页面

    如上图所示,没那么多废话,直接上代码 html中 vue中

    2024年02月16日
    浏览(47)
  • FOR XML PATH 函数与同一分组下的字符串拼接

    FOR XML PATH 语句是将查询结果集以XML形式展现,通常情况下最常见的用法就是将多行的结果,拼接展示在同一行。 首先新建一张测试表并插入数据: 查询结果如下: 接下来应用FOR XML PATH的查询结果语句如下: 在查询结果中会出现一个可点击的XML链接,点击后结果如下: 可见

    2024年01月23日
    浏览(64)
  • 五种方式:Python中拼接字符串的正确方法

    在学习Python的过程中, 在拼接字符串的时候遇到了些问题, 所以抽点时间整理一下Python 拼接字符串的几种方式。 方式1:使用加号(+)连接 使用加号连接各个变量或者元素必须是字符串类型 (class ‘str’) 例如: 输出结果: 方式2:使用.joiin(iterable) 拼接 执行结果: 方式3:

    2024年02月12日
    浏览(44)
  • 297.【华为OD机试】拼接url(字符串处理—Java&Python&C++&JS实现)

    🚀点击这里可直接跳转到本专栏,可查阅顶置最新的华为OD机试宝典~ 本专栏所有题目均包含优质解题思路,高质量解题代码(JavaPythonC++JS分别实现),详细代码讲解,助你深入学习,深度掌握!

    2024年04月12日
    浏览(51)
  • python学习之把列表元素拼接成字符串的4种方法

    我们在分析列表数据时,常常需要对列表数据进行输出或多列表关联拼接。直接使用列表,列表中的各元素以逗号分隔,每个元素包含引号。如何连接列表中的元素为一个字符串呢? 文章主要介绍python 连接列表元素的4种方法,帮助大家更好的理解和学习使用python,感兴趣的

    2024年01月23日
    浏览(45)
  • 前端如何安全的渲染HTML字符串?

    在现代的Web 应用中,动态生成和渲染 HTML 字符串是很常见的需求。然而,不正确地渲染HTML字符串可能会导致安全漏洞,例如跨站脚本攻击(XSS)。为了确保应用的安全性,我们需要采取一些措施来在安全的环境下渲染HTML字符串。本文将介绍一些安全渲染 HTML 字符串的最佳实

    2024年02月12日
    浏览(43)
  • 【Jetpack】DataBinding 架构组件 ② ( 字符串拼接函数 | 绑定点击事件函数 | DataBinding 布局中使用 import 标签导入 Java、Kotlin 类 )

    在上一篇博客中 , 遇到 在 DataBinding 布局 中 , 向 TextView 组件设置 int 类型数据的情况会报错 , 最终的处理方式是 将 int 类型的变量 student.age 通过 String.valueOf 函数转为 字符串 类型 , 设置到 TextView 组件中 ; 此外 , 还可以 在 数据类 中定义 字符串拼接函数 , 直接在 DataBinding 布局

    2023年04月08日
    浏览(84)
  • mysql 拼接字符串,截取字符串 常用方式

    1,拼接字符串常用:CONCAT(‘需要拼接的字符串’,列名) CONCAT(\\\'+\\\',b.Telephone)查询出号码,前边加上+号 2,分割字符串 substring_index(b.Telephone,\\\'+\\\',1) 用从左往右的第一个+分割电话号码,获取分割后的从左往右的第一个字符串 比如 86+133333333 执行完后 为 86 substring_index(b.Telephone,\\\'+\\\',

    2024年02月14日
    浏览(49)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包