在 JavaScript 中连接一个字符串和一个变量

作者

在 JavaScript 中连接一个字符串和一个变量

Concatenate a String with a Variable in JavaScript

使用加法 (+) 运算符将字符串与变量连接起来，例如
'hello' + myVar.

加法 (+) 运算符用于连接字符串或求和数字。

索引.js
const example = 'world';

const result = 'hello ' + example;

console.log(result); // 👉️ 'hello world'

我们使用
加法 (+)
运算符将字符串与变量连接起来。

您可以根据需要对尽可能多的字符串和变量使用这种方法。

索引.js
const example = 'world';

const result = 'hello ' + example + '!';

console.log(result); // 👉️ 'hello world!'

加法 (+) 运算符用于实现 2 个主要目标：

  1. 连接字符串
  2. 求和数

如果对数字和字符串使用加法 (+) 运算符，它会将数字转换为字符串并连接字符串。

索引.js
const num = 100;

const result = num + ' percent';

console.log(result); // 👉️ '100 percent'

请注意，如果您在尝试对数字求和时弄错了值的类型，这可能会造成混淆。

索引.js
const num = 100;

const result = '100' + num;

console.log(result); // 👉️ 100100

如果要获得正确的结果，则必须将字符串转换为数字。

索引.js
const num = 100;

const result = Number('100') + num;

console.log(result); // 👉️ 200

使用模板文字连接字符串和变量

您还可以使用模板文字将字符串与变量连接起来。

模板文字允许我们将变量嵌入到字符串中。然后用它的值替换该变量。

索引.js
const example = 'world';

const result = `hello ${example}`;

console.log(result); // 👉️ 'hello world'

我们使用反引号将字符串包装起来，使其成为
模板文字。

美元符号和花括号部分${}是一个被评估的表达式。

模板文字的语法是${variable}or ${expression}。

您可以在变量之前或之后添加字符。

索引.js
const variable = 'two';

const result = `one ${variable} three`;

console.log(result); // 👉️ one two three
请注意，该字符串包含在反引号 (“) 中，而不是单引号中。

以下是使用模板文字的更多示例。

索引.js
const example = 'world';

const result = `hello ${example}!`;
console.log(result); // 👉️ 'hello world!'

const str = `${50 + 50} percent`;
console.log(str); // 👉️ '100 percent'

花括号之间的表达式被计算并放入字符串中。