首頁  >  文章  >  web前端  >  如何在 JavaScript 中連接兩個字串,以便第二個字串必須連接在第一個字串的末尾?

如何在 JavaScript 中連接兩個字串,以便第二個字串必須連接在第一個字串的末尾?

WBOY
WBOY轉載
2023-09-02 16:33:061302瀏覽

如何在 JavaScript 中连接两个字符串,以便第二个字符串必须连接在第一个字符串的末尾?

concat()方法

組合兩個字串的基本運算是串聯。字串組合是程式設計的必要部分。在討論「JavaScript 中的字串連接」之前,我們需要先弄清楚基礎知識。當解釋器執行操作時會產生一個新字串。

為了建立一個新字串,concat() 方法連接呼叫字串和字串參數。初始字串和傳回的字串都不會受到任何變更的影響。

連線時,字串值會先從非字串型別的參數轉換而來。

文法

以下是 concat() 方法的語法

concat(str1)
concat(str1, str2)
concat(str1, str2, ... , strN)
先生。否 參數及說明
1

strN

字串連接一個或多個字串

#返回

concat() 方法透過連接初始字串和作為參數傳遞的字串值來產生一個新字串。

範例 1

該方法傳回一個組合了兩個輸入字串的新字串;它不會以任何方式更改給定或輸入字串。給定的參數必須絕對是字串,這是 concat() 方法的缺點。

此方法接受非字串參數,但是如果給定字串等於 null,則會引發 TypeError。此外,由於 JavaScript 中的字串是不可變的,因此 concat() 方法實際上不會更改字串。

<!DOCTYPE html>
<html>
   <title>How to concatenate two strings so that the second string must concatenate at the end of first
string in JavaScript - TutorialsPoint</title>
<head>
<meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
   <div id="result"></div>
<body>
   <script>
      let string1 = "Tutorialspoint is the best ";
      let string2 = "website available ";
      let string3 = "for online education.";
      let concatRes = string1.concat(string2, string3); document.getElementById("result").innerHTML =concatRes;
   </script>
</body>
</html>

範例 2

在這個例子中,讓我們了解如何連接空字串變數。我們將使用 concat() 方法與空字串變數連接簡單的字串值。

<!DOCTYPE html>
<html>
   <title>How to concatenate two strings so that the second string must concatenate at the end of first string in JavaScript - TutorialsPoint</title>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
   <div id="result"></div>
<body>
   <script>
      let tutpoint_string = ''; document.getElementById("result").innerHTML =tutpoint_string.concat('Visit ','Tut','orials','point!');
   </script>
</body>
</html>

範例 3

為了將兩個數字相加,我們使用 運算子。 JavaScript 也可以實作字串連線。運算符在字串組合時有一個獨特的屬性。您可以附加到現有字串來變更它,也可以僅用於建立新字串。

<!DOCTYPE html>
<html>
   <title>How to concatenate two strings so that the second string must concatenate at the end of first
string in JavaScript - TutorialsPoint</title>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
   <div id="result"></div>
<body>
   <script>
      let firstStr = 'Tutorials Point is a ';
      let secondStr = ' ';
      let thirdStr = 'leading Ed Tech company';
      document.getElementById("result").innerHTML =firstStr+secondStr+thirdStr;
   </script>
</body>
</html>

string.padEnd()方法

string.concat()方法可用來連接。但是,它不會提供任何信息,例如連接後字串的長度或必須添加的精確數字等。

Javascript 因此提供了 string.padEnd() 方法來幫助解決這個問題。這個過程需要兩個參數。第一個是長度,第二個是必須附加到初始字串的附加字串。

使用 padEnd() 函數用其他字串填滿字串。為了使字串被填充達到特定長度,它會執行此操作。

在字串的末尾,填充應用於右側。因此,它也稱為右填充。

文法

padEnd(targetLength)
padEnd(targetLength, padString)

先生。否 參數及說明
1

目標長度

#填充後最終字串所需的長度。

2

pad_string p>

#可選。提供的字串將在字串末尾填充。如果忽略此選項,padEnd() 方法將用空格取代填滿字元。

返回

padEnd 方法的返回值是一个在结尾处按给定字符串加长的字符串。

示例 4

在示例中让我们了解如何使用 padEnd() 方法。我们给firstString 字符串值“TutorialsPoint”,并使用padEnd() 方法在其末尾添加了一个“$”符号。此外,我们 在方法内给出 20 作为 targetLength。

因此,该方法返回 20 个字符长的最终字符串 " Tutorialspoint$$$$$$。”

<!DOCTYPE html>
<html>
   <title>How to concatenate two strings so that the second string must concatenate at the end of first string in JavaScript - TutorialsPoint</title>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
   <div id="result"></div>
<body>
   <script>
      let firstString = "Tutorialspoint";
      let paddfirstStr= firstString.padEnd(20, "$");
      document.getElementById("result").innerHTML =paddfirstStr;
   </script>
</body>
</html>

示例 5

在这个例子中,让我们了解在 padEnd() 中使用多字符 padString。在下面的示例中,我们调用了 padEnd() 并给它一个字符串,“是在线教程”,我们给了 paddSecondStr结果。

该过程通过附加“是在线教程”来扩展“Tutorialspoint”,直到最终字符串的长度为 26 个字符。 paddSecondStr 返回的最终字符串“Tutorialspointis online tu”长度为 26。

<!DOCTYPE html>
<html>
   <title>How to concatenate two strings so that the second string must concatenate at the end of first string in JavaScript - TutorialsPoint</title>
<head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
      <div id="result"></div>
<body>
   <script>
      let firstString = "Tutorialspoint ";
      let paddSecondStr= firstString.padEnd(26, 'is online tutorials');
      document.getElementById("result").innerHTML =paddSecondStr;
   </script>
</body>
</html>

示例 6

在此示例中,让我们了解在 padEnd() 中使用 Long padString。

在下面的示例中,“带有教程点的 JavaScript”已作为 padString 传递。通过 padEnd() 方法对指定的 padString 进行修剪,使填充后的字符串长度等于 targetLength (21)。

因此,firstString.padEnd(21, "JavaScript withtutorialspoint") 返回长度为 21 的最终字符串“Learn JavaScript with”。

<!DOCTYPE html>
<html>
   <title>How to concatenate two strings so that the second string must concatenate at the end of first string in JavaScript - TutorialsPoint</title>
<head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
   <div id="result"></div>
<body>
   <script>
      let firstString = "Learn ";
      let paddThirdStr= firstString.padEnd(21, 'JavaScript with tutorialspoint');
      document.getElementById("result").innerHTML =paddThirdStr;
   </script>
</body>
</html>

以上是如何在 JavaScript 中連接兩個字串,以便第二個字串必須連接在第一個字串的末尾?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文轉載於:tutorialspoint.com。如有侵權,請聯絡admin@php.cn刪除