什么'；在JavaScript中进行字符串构建/连接的最佳方法是什么？

JavaScript支持替换/插值吗

概述

---

我正在做一个JS项目，随着项目的不断扩大，保持字符串的良好状态变得越来越困难。我想知道在JavaScript中构造或构建字符串最简单、最传统的方法是什么

我迄今为止的经验：

字符串连接开始看起来很难看，并且随着项目变得更加复杂而变得更难维护

在这一点上，最重要的是简洁性和可读性，考虑一堆运动部件，而不仅仅是2-3个变量

同样重要的是，目前主要浏览器都支持它（即至少支持ES5）

我知道JS连接速记：

var x = 'Hello';
var y = 'world';
console.log(x + ', ' + y);

和功能

var hello = "Hello ";
var world = "world!";
var res = hello.concat(world);

我在找更整洁一点的

Ruby和Swift以一种有趣的方式完成了这项工作

红宝石

var x = 'Hello'
var y = 'world'
print "#{x}, #{y}"

Swift

var x = "Hello"
var y = "world"
println("\(x), \(y)")

我在想JavaScript中可能会有类似的东西，可能类似于

问题:

---

---

在没有任何第三方库的情况下，可以做到这一点吗？如果没有，我可以使用什么？

您可以使用

concat

功能

var hello = "Hello ";
var world = "world!";
var res = hello.concat(world);

更多信息：

您可以使用它，它使javascript代码更加简洁。。对于字符串连接，可以执行如下操作：

first_name = "Marty"
full_name = "#{first_name} McFly"
console.log full_name

也许您可以开始了解coffescript提供的功能。

对于ES6，您可以使用

• :

ES5及以下：

• 使用

  +

  运算符

  var username = 'craig';
  var joined = 'hello ' + username;
  

• 弦的

或者，使用数组方法：

• :

• 或者甚至是爱好者，结合以上任何一项：

  var a = ['hello', 'world', 'and', 'the', 'milky', 'way'];
  var b = a.reduce(function(pre, next) {
    return pre + ' ' + next;
  });
  console.log(b); // hello world and the milky way
  

我认为这里值得一提

在某些情况下，replace方法在构建字符串时可以很好地为您服务。很明显，当您将动态部分注入到其他静态字符串中时。例如：

var s = 'I am {0} today!';
var result = s.replace('{0}', 'hungry');
// result: 'I am hungry today!'

要替换的占位符显然可以是任何内容。出于C#的习惯，我使用“{0}”和“{1}”等。它只需要具有足够的唯一性，以避免在字符串中出现预期以外的其他位置

所以，如果我们可以稍微摆弄一下字符串部分，OPs示例也可以这样解决：

var x = 'Hello {0}';
var y = 'World';
var result = x.replace('{0}', y);
// result: 'Hello World'. -Oh the magic of computing!

“替换”的参考：

---

我很失望，其他答案中没有人将“最佳方式”解释为“最快方式”

我从中提取了两个示例，并从上面添加了

str.join（）

和

str.reduce（）

。以下是我在Linux上的Firefox77.0.1上的结果

---

注意：我在测试这些时发现，如果我将

str=str.concat（）

和

str+=

直接放在彼此之前或之后，第二个总是表现得更好一些。。。所以我单独运行了这些测试，并对其他测试的结果进行了注释

即使仍然，如果我重新运行它们，它们的速度也会有很大的变化，因此我对每一个都测量了3次

一次1个字符：

• str=str.concat（）

• …..str+=

  ：

  9491130664 ms/1e7+='s

• ……[].join（）

  ：

  335029113522ms/1e7个字符[]

• …[].reduce（）

  ：

  395442284547ms/1e7个字符[]

一次26个字符串：

• str=str.concat（）

• ………str+=

  ：

  1037473875 ms/1e7+='s

• …..[].join（）

  ：

  269333943457 ms/1e7字符串在[]

• …[].reduce（）

  ：

  278227704520ms/1e7字符串在[]

---

因此，无论是一次追加1个字符还是一次追加26个字符串：

• 明确的赢家：基本上是

  str=str.concat（）

  和

  str+=

• 清除失败者：

  [].reduce（）

  ，然后是

  [].join（）

---

我的代码，易于在浏览器控制台中运行：

{
console.clear（）；
让concatMe='a'；
//让concatMe='abcdefghijklmnopqrstuvwxyz'；
//[]加入
{
s=性能。现在（）；
设str=''，sArr=[]；
for（设i=1e7；i>0；--i）{
sArr[i]=concatMe；
}
str=sArr.join（“”）；
e=性能。现在（）；
控制台日志（e-s）；
console.log（'[].join（）：'+str）；
}
//str+=
{
s=性能。现在（）；
设str=''；
for（设i=1e7；i>0；--i）{
str+=concatMe；
}
e=性能。现在（）；
控制台日志（e-s）；
log（'str+=：'+str）；
}
//[]减少
{
s=性能。现在（）；
设str=''，sArr=[]；
for（设i=1e7；i>0；--i）{
sArr[i]=concatMe；
}
str=sArr.reduce（函数（前、后）{
返回pre+next；
});
e=性能。现在（）；
控制台日志（e-s）；
console.log（'[].reduce（）：'+str）；
}
//str=str.concat（）
{
s=性能。现在（）；
设str=''；
for（设i=1e7；i>0；--i）{
str=str.concat（concatMe）；
}
e=性能。现在（）；
控制台日志（e-s）；
log（'str=str.concat（）：'+str）；
}
“完成”；
}

如果我想构建一个更长的字符串，比如说6个不同的移动部分，那么使用concat函数根本无法读取。如果

hello

没有尾随空格，您如何在同一行中实现这一切<代码>hello.concat（world.concat（“”））？或者您仍然会使用速记并执行

hello.concat（''+world）

？@MrHaze

concat

接受不同数量的参数。所以，也许，

str1.concat.apply（null，[str2，str3，str4]）

稍微提高了可读性？str1.concat.apply（nul

var a = ['hello', 'world', 'and', 'the', 'milky', 'way'];
var b = a.reduce(function(pre, next) {
  return pre + ' ' + next;
});
console.log(b); // hello world and the milky way

var s = 'I am {0} today!';
var result = s.replace('{0}', 'hungry');
// result: 'I am hungry today!'

var x = 'Hello {0}';
var y = 'World';
var result = x.replace('{0}', y);
// result: 'Hello World'. -Oh the magic of computing!