JavaScriptで文字列操作第二弾です。
今回は文字列の連結についてまとめます。
1.文字列連結
1.1. ＋演算子
「文字列 + 文字列 ・・」で文字列を連結します。
let newline = “Hello, ” + “World.”;
console.log(newline);
// -> Hello, World.
では次のサンプルはどうでしょうか？
let msg = 100 + 200 + “円です。”;
console.log(msg);
// -> 300円です。
このサンプルでは最初に 100 + 200 の演算が行われます。 2つとも数値なので加算が行われ 300 という結果となります。次に 300 + “円です。” の演算が行われます。こちらは数値と文字列の組み合わせなので、結果として変数には 「300円です。」 という文字列が代入されます。
let msg = “値段は” + 100 + 200 + “円です。”;
console.log(msg);
// -> 値段は100200円です。
このサンプルでは最初に “値段は” + 100 の演算が行われます。こちらは数値と文字列の組み合わせなので、文字列連結され “値段は100” となります。次に “値段は100” + 200 の演算が行われます。こちらも1つが文字列なので、文字列連結され “値段は100200″ となります。最後に”値段は100200” + “円です。” の演算が行われ、変数には「値段は100200円です。」 という文字列が代入されます。
このように＋演算子で数値と文字列を混在させる場合は、意図しない結果になる可能性があります。
＋演算子を利用して「値段は300円です。」としたい場合は、グループ化の括弧()を使うことで演算を行う順序を変更しましょう。
let msg = “値段は” + (100 + 200) + “円です。”;
console.log(msg);
// -> 値段は300円です。
1.2. joinメソッド
join()メソッドは、配列の全要素を区切り文字で連結した文字列を返します。
区切り文字は引数で設定し、区切り文字を省略した場合は、区切り文字はカンマ（,）として見なされます。
また、区切り文字に空文字を指定した場合、各要素は区切り文字なしで連結されます。
let arr = [“田中”, “太郎”];
//引数を省略
let name = arr.join();
console.log(name);
// -> 田中,太郎
//区切り文字は”と”
let name = arr.join(“と”);
console.log(name);
// -> 田中と太郎
//区切り文字は空文字列
let name = arr.join(“”);
console.log(name);
// -> 田中太郎
参考：https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/join
入会申込
ログイン
