字符串连接是我们经常做的一项常见任务。字符串连接是将字符串首尾相连的操作。例如,“雪”和“球”串联起来就是“雪球”。
在本文中,我将展示两种在 JavaScript 中连接字符串的方法。我还将确保澄清您何时应该使用每种方法。
使用字符串
在讨论字符串连接之前,让我们先讨论一些基本的东西。
假设我想打印我的全名,但我不想一次输入我的全名。检查下面的示例:
myName = "Md. Fahim ";
myName2 = "Bin Amin";
console.log(myName); // Md. Fahim
console.log(myName2); // Bin Amin
我的全名是“Md. Fahim Bin Amin”。我把它分成两部分,或者你可以说分成两半。因此,myName包含我的名字,"Md. Fahim "末尾有一个空格,以便我可以在打印我的姓氏之前有一个前导空格。但是您也可以将此空格添加为第二个字符串中的前导空格。
myName2包含我的姓氏"Bin Amin"。然后我打印了两个变量的值。因此,我得到了包含我的全名的两行单独的行。但把一个人的名字打印成两行,看起来不太好,对吧?
现在让我们解决这个问题。有很多方法可以做到这一点,但我们将使用字符串连接方法。我们将学习使用字符串连接的两种不同方法以及每种方法的合适用法。
字符串连接方法1 – 使用+运算符
这是最简单的方法:它使用+运算符。让我先给你举个例子,我保证一旦我们经历过这个例子,你就会一目了然。
假设我正在创建一个名为fullName存储我的全名的新变量。但与之前一样,我将使用单独的字符串,而不是在双引号中使用我的全名。
fullName = "Md. Fahim " + "Bin Amin";
console.log(fullName); // Md. Fahim Bin Amin
在这里,我在单个字符串变量中提供了两个单独的字符串,但我使用加号 ( +) 运算符将第二个字符串附加到第一个字符串的末尾。这"Md. Fahim "是第一个字符串,这"Bin Amin"是第二个字符串。
由于我想要两个单独的字符串之间有一个空格,因此我在第一个字符串中添加了一个尾随空格。但是您也可以在第二个字符串中添加前导空格,而不是在第一个字符串中添加尾随空格,正如我上面提到的。
需要注意的是,字符串的顺序在字符串连接中始终很重要。
例如,如果我更改变量中的顺序(在第一个字符串之前给出第二个字符串)fullName,那么整个字符串也会获得不同的方向,并且我将不会得到我想要的结果(它打印出我的名字错误!)。
fullName = "Bin Amin" + "Md. Fahim ";
console.log(fullName); // Bin AminMd. Fahim
它始终将首先出现的字符串视为第一个字符串,并将下一个字符串附加到第一个字符串的末尾。每次都会这样继续进行——无论您想要在单个字符串变量中附加多少个单独的字符串,都没有关系。
fullName = "Bin Amin " + "Md. Fahim" + " My name is";
console.log(fullName); // Bin Amin Md. Fahim My name is
啊! 看起来很糟糕。现在让我纠正一下方向:
fullName = "My name is " + "Md. Fahim " + "Bin Amin";
console.log(fullName); // My name is Md. Fahim Bin Amin
现在好多了。
字符串连接方法2——使用+=运算符
这个方法非常方便。使用它时,我们将单独的字符串附加在单独的行中。让我再给你举一个例子。
我将使用像之前一样命名的变量fullName,但我不会像+之前那样使用运算符来连接字符串,而是使用+=:
fullName = "Md. Fahim ";
fullName += "Bin Amin";
console.log(fullName); // Md. Fahim Bin Amin
在第一行中,我将我的名字存储在fullName变量中。在第二行中,我将我的姓氏存储在同一个变量中,但使用了+=运算符(实际上是 的组合fullName = fullName + "Bin Amin")。它像之前一样将第二个字符串附加在第一个字符串的末尾。
这让我可以在一行上打印我的全名。
+=是一个组合,所以直接使用通用方式也可以起到同样的作用,如下所示:
fullName = "Md. Fahim ";
fullName = fullName + "Bin Amin";
console.log(fullName); // Md. Fahim Bin Amin
但您几乎可以假设使用+=将是更简单、更紧凑的方式。所以我建议你直接使用+=operator。
有什么不同?
我知道您可能会感到困惑,并认为如果这些方法给出完全相同的结果,为什么您应该学习它们呢?每一种的具体用例是什么?
稍安毋躁!我现在就回答你的问题。
按照下面的代码,我使用第一种方法:
fullParagraph = "This is the first line of the paragraph. " + "This is the second line of the paragraph. " + "This is the third line of the paragraph. ";
console.log(fullParagraph); // This is the first line of the paragraph. This is the second line of the paragraph. This is the third line of the paragraph.
在这里,我采用了一个名为 的变量fullParagraph,并在其中存储了三个单独的字符串/句子。输出是准确的,但您会发现,根据添加新字符串/句子的数量,用于在该特定变量中存储数据的一行变得越来越长。
使用第一种方法为字符串连接添加的字符串或不同句子越多,单个语句就会变得越长。因此,它会变得非常无聊并且很难在以后进行检查。
第二种拯救方法来了!😉
按照下面的代码,我使用的是第二种方法:
fullParagraph = "This is the first line of the paragraph. ";
fullParagraph += "This is the second line of the paragraph. ";
fullParagraph += "This is the third line of the paragraph. ";
console.log(fullParagraph); // This is the first line of the paragraph. This is the second line of the paragraph. This is the third line of the paragraph.
在这里,我采用了一个名为的变量fullParagraph并将各个字符串存储在各个行中。像往常一样,我可以使用+=运算符轻松地将新字符串附加到新行中。
由于我每次都采用新行来附加新字符串,因此它不会给我带来任何麻烦。此外,每个单独的声明都很短,很容易稍后阅读或检查。代码看起来也很干净。
请记住,字符串的顺序在每种方法中当然都很重要。这意味着它们在附加(字符串连接)期间始终遵循字符串顺序的方向。
何时使用每种方法
我想你已经知道这个答案了。但是,为了这篇文章的目的,让我再次澄清一下。
如果您使用任何字符串连接,其中各个字符串相对较小,或者您知道它们的大小将保持较小,那么您可以直接采用第一种方法。
但如果您知道稍后可能需要附加更长的字符串,那么您应该使用第二种方法。
结论
我希望您喜欢这篇短文。为你写一篇有深度的文章需要花费大量的时间和精力