ts 字符串新特性

最新推荐文章于 2025-06-08 17:36:45 发布

原创最新推荐文章于 2025-06-08 17:36:45 发布 · 1.5w 阅读

3 ·

CC 4.0 BY-SA版权

Typescript 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了JavaScript (JS) 和TypeScript (TS) 中处理多行字符串的方法，包括使用加号进行字符串连接、模板字符串的使用及其优势，并展示了如何在模板字符串中插入变量。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、多行字符串

js里，如果字符串换行，中间需用 + 拼接

var a = 'aaa' + 
'bbb' + 
'ccc';

ts里，可用 `` 包裹字符串直接换行

var a = `aaa
bbb
ccc`;

2、字符串模板

ts里支持在字符串中插入变量，格式为${}，注意字符串必须用``包裹

var name = 'forrest';
var getName = function (){
  return 'forrest';
}
console.log(`hello ${name}`);
console.log(`hello ${getName()}`);

有什么用？拼接html时威力就体现出来了

var name = 'forrest';
var getAge = function (){
  return 18;
}
console.log(`<div>
  <span>name:${name}</span>
  <span>age:${getAge()}</span>
</div>`);

省去了一大堆 + 号

3、自动拆分字符串

function test(template, name, age){
  console.log(template);
  console.log(name);
  console.log(age);
}
var name = 'forrest';
var getAge = function (){
  return 18;
}
test`hello,my name is ${name},i'm ${getAge()} years old.`

运行结果