【JavaScript】文字列をスマートに連結する関数の実装方法

今回は、2つの文字列を受け取り、それらを連結するJavaScript関数の作成方法を解説します。単純な連結ではなく、少し賢い処理を行うのがポイントです。

要件

求められる仕様は以下のとおりです。

• 関数は2つの文字列を引数として受け取る
• 2番目の文字列を1番目の文字列の後ろに連結して返す
• ただし、1番目の文字列の末尾の文字と、2番目の文字列の先頭の文字が同じ場合は、重複する文字を1つ省略する

例えば 'Food' と 'dog' を連結する場合、通常なら 'Fooddog' となりますが、d が重複しているため、結果は '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

コードの解説

• まず、分割代入を使って各文字列の長さを取得し、それぞれ l1、l2 に格納しています。
• str1[l1 - 1] は1番目の文字列の末尾の文字、str2[0] は2番目の文字列の先頭の文字を表します。
• この2つが異なる場合は、何も加工せずに + 演算子でそのまま連結して返します。
• 同じ文字だった場合は、substr(1, l2 - 1) によって2番目の文字列の先頭1文字を取り除いた部分文字列を作成し、1番目の文字列と連結することで重複を回避しています。

補足：よりモダンな書き方

substr() メソッドは現在では非推奨（レガシー）とされているため、代わりに slice() を使うとより安全です。str2.substr(1, l2 - 1) の部分は str2.slice(1) と書き換えることができ、先頭の1文字を除いた残り全体を取得できます。挙動は同じで、コードもすっきりします。