【JavaScript】2つの文字列を連結するプログラム ― 重複する文字を1つ省略する方法

本記事では、2つの文字列を受け取り、それらを連結するJavaScript関数の作成方法について解説します。ポイントは、最初の文字列の最後の文字と、2番目の文字列の最初の文字が同じだった場合、重複する文字のうち1つを省略して連結するという処理です。

要件の整理

• 引数として2つの文字列を受け取る
• 2番目の文字列を1番目の文字列の末尾に連結する
• ただし、1番目の文字列の末尾の文字と2番目の文字列の先頭の文字が同一の場合は、どちらか一方を省略する

入力例

例えば、以下のような2つの文字列を扱うケースを考えてみましょう。

const str1 = 'Food';
const str2 = 'dog';

この場合、「Food」の最後の文字「d」と「dog」の最初の文字「d」が一致しているため、単純に連結すると「Fooddog」となり文字が重複してしまいます。期待する出力は「Foodog」です。

実装コード

const str1 = 'Food';
const str2 = 'dog';

const concatenateStrings = (str1, str2) => {
    const { length: l1 } = str1;
    const { length: l2 } = str2;

    // 末尾と先頭の文字が異なる場合は、そのまま連結
    if (str1[l1 - 1] !== str2[0]) {
        return str1 + str2;
    }

    // 重複する場合は、2番目の文字列の先頭1文字を除去してから連結
    const newStr = str2.substr(1, l2 - 1);
    return str1 + newStr;
};

console.log(concatenateStrings(str1, str2));

実行結果

コンソールには以下のように出力されます。

Foodog

コードの解説

この関数の処理の流れは以下の通りです。

1. 文字列の長さを取得： 分割代入（const { length: l1 } = str1;）を使い、各文字列の長さを変数 l1・l2 に格納します。
2. 境界の文字を比較： str1[l1 - 1] で1番目の文字列の最後の文字を、str2[0] で2番目の文字列の最初の文字を参照し、両者が異なれば何も加工せずに str1 + str2 を返します。
3. 重複時の処理： 文字が一致していた場合は、substr(1, l2 - 1) によって2番目の文字列の先頭1文字を取り除いた新しい文字列を作成し、1番目の文字列と連結して返します。

補足：モダンな書き方

なお、substr() メソッドは現在レガシー扱いとなっているため、新規のコードでは slice() を使うのがおすすめです。slice() を使うと、該当部分は次のように書き換えられます。

// substr の代わりに slice を使用
const newStr = str2.slice(1);
return str1 + newStr;

slice(1) は「インデックス1以降のすべての文字」を返すため、先頭1文字を除いた文字列を簡潔に取得できます。