js拼接字符串方法总结

最常用方法 ：+连接：

js中：

let age = "18"
let message = "我今年" + age + "岁"

Vue模板中： 

<el-form-item :label="item.label+':'" prop="key"></el-form-item>

模板字符串：反引号‘ ` ’标志，变量用${}包围

let age="18";

let message=`我今年${age}岁`

let str3 = "Java"

let str4 = "Script"

let str5 = `${str3}${str4}`

 Vue模板中：

:ref="`formList${index}`"

模板字符串使用Html代码，原样输出，包括换行：

var name="默默";
var phone="139********";
var html = `<div>
    <p>客户姓名：${name}</p>
    <p>客户电话：${phone}</p>
</div>`

模板字符串还能插入表达式：

let a = 20;

let b = 10;

let c = `a-b=${a-b}`; //a-b=10

模板字符串中使用函数表达式：

var setMsg = ()=>{
    return '企业用户'
}
let errMsg = `请选择${setMsg()}!`;//请选择企业用户！

Vue中 

<template>
	<div>
        <div v-html="`
			<strong>客户信息</strong>
			${test()}
		`"></div>

        <div v-html="'<strong>客户信息</strong>'+test()"></div>
    </div>
<template>
methods: {
			test(){
				var name="默默";
				var phone="139********";
				var html = `<div>
					<p>客户姓名：${name}</p>
					<p>客户电话：${phone}</p>
				</div>`
				return html;
			},
}

 join方法：将数组array中的每个元素拼接成字符串，用自定义的连接符分割

let arr =['Math的方法有', 'abs', 'pow', 'max', 'min', '等'];

arr.join(',')

concat方法：

创建一个新的数组连接两个或多个数组 ,并直接使用join转为字符串

let a1 = ['abs', 'acos', 'asin', 'ceil'];

let a2 = ['max', 'min']

let a3 =['floor', 'log', 'sqrt']

let a = a1.concat(a2, a3).join(',')

还可以直接拼接字符串

let str1 = "abc";

let str2 = "def"

let str = str1.concat(str2)