js字符串拼接的4种常见方法
更新时间：2023年07月19日 09:44:33 作者：西晋的no1
JavaScript中,字符串拼接是非常常见的操作,拼接字符串有很多种方式,这篇文章主要给大家介绍了关于js字符串拼接的4种常见方法,需要的朋友可以参考下
一、使用连接符 + 把想要连接的字符串串起来
let shy = '帅哥' let a = '我是' + shy console.log(a) // 我是帅哥
二、模板字符串
模板字符串（template string）是增强版的字符串，用反引号（`）标识，特点：
1) 字符串中可以出现换行符
2) 可以使用 ${xxx} 形式输出变量
1. 最基础的变量拼接
// 变量拼接
let shy = '帅哥'
let a = `我是${shy}`
console.log(a) // 我是帅哥
2. 在模版字符串中使用htnl代码以及多行文本代码
// html代码以及换行文本
let hi=`<div>
<h2>你好呀！</h2>
</div>`
console.log(hi) // 原样输出，包括换行
3. 插入一个表达式
// 插入表达式
let x=30;
let y=10;
let a=`x-y=${x-y}`
console.log(a) // 输出表达式计算结果
4. 在模版字符串里面调用函数表达式
let food=function(){
return "苹果"
}
let a=`我喜欢吃${food()}`;
console.log(a)
三、使用 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"]
// 拼接字符串 let a = 'java' let b = 'script' let str = a.concat(b) console.log(a) console.log(b) console.log(str) // javascript
四、使用 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
参考资料：
1、 https://blog.csdn.net/chenjunxing1992/article/details/125514168
2、https://blog.csdn.net/m0_51708342/article/details/119005518
3、https://blog.csdn.net/weixin_44880730/article/details/109379041
总结
到此这篇关于js字符串拼接的4种常见方法的文章就介绍到这了,更多相关js字符串拼接内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了基于Bootstrap仿淘宝分页控件实现代码，本文分步骤给大家介绍的非常详细，感兴趣的朋友参考下吧2016-11-11
目前已经有很多网页版在线小工具,之前很多窗体化的工具也逐渐网页化,比如：PS画图软件,也都能直接网页化进行设计,由于自己实际项目经常会用到颜色转换,所以直接自己开发个简单版的在线颜色转换小工具,需要的朋友可以参考下2024-01-01
背景：很久之前就在marry5.com看到这个效果，当时觉得很神奇，碍于水平有限，没做出来。2008-09-09
下面小编就为大家带来一篇浅谈JavaScript中变量和函数声明的提升。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-08-08
下面小编就为大家带来一篇JS公共小方法之判断对象是否为domElement的实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-11-11
这篇文章主要介绍了webpack 自动清理 dist 文件夹的两种实现方法,本文给大家介绍的非常详细,感兴趣的朋友跟随小编一起看看吧2024-06-06
这篇文章主要为大家详细介绍了js插件实现图片滑动验证码，滑动模块，实现验证功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-10-10
下面小编就为大家带来一篇用js写的一个路由(简单实例)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-09-09
本文针对经常使用长连接进行消息收发的应答场景，采用 Websocket 长连接作为服务监听的对象，模拟了一套类 http 服务框架，通过实例代码介绍了Javascript 基于长连接的服务框架,需要的朋友可以参考下2022-07-07
这篇文章主要介绍了简单了解JS打开url的方法,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-02-02
最新评论