JavaScript：%演算子が文字列に対して機能するのはなぜ？型強制の仕組みを徹底解説

JavaScriptには、一見すると奇妙に見える動作がいくつか存在します。例えば、モジュロ演算子（%）が文字列に対しても正常に機能すること、また文字列連結の際に予想外の結果が生じることが挙げられます。本記事では、こうした現象がなぜ起こるのかを「型強制」という重要な概念を通じて分かりやすく解説します。

問題となるコード

まず、実際のコードを見てみましょう。

const numStr = '127';
const result = numStr % 5;
const firstName = 'Armaan';
const lastName = 'Malik';
const fullName = firstName + + lastName;
console.log('modulo result: ', result);
console.log('full name: ', fullName);

出力結果

modulo result: 2
full name: ArmaanNaN

文字列'127'に対する剰余計算は正しく行われている一方で、氏名の連結ではArmaanNaNという予想外の文字列が出力されています。コードの詳細に入る前に、JavaScriptの最も基本的なトピックの一つである型強制について理解しておきましょう。

型強制とは何か

型強制とは、JavaScriptエンジンがあるデータ型を自動的または意図的に別のデータ型へ変換する仕組みのことです。例えば、文字列からブール値への変換や、数値から文字列への変換などが該当します。

型強制は非常に幅広いテーマですが、ここでは今回のコードに関係する部分に絞って解説します。型強制には大きく分けて明示的なものと暗黙的なものがありますが、コンパイラ（JavaScriptエンジン）が自動的に実行するものは暗黙的な型強制と呼ばれます。

暗黙的な型強制の基本ルール

あらゆるデータ型（プリミティブ・非プリミティブ問わず）は、文脈に応じて以下のように暗黙的に変換されます。

• 文字列への変換：二項の+演算子と共に使用された場合（片方が文字列なら連結が行われる）
• 数値への変換：算術演算子（+、-、/、*、%）と共に使用された場合、または比較演算子・ビット演算子・等価演算子（==）と共に使用された場合。ただし二項の+は数値変換ではなく文字列連結を優先する点に注意
• ブール値への変換：論理演算子（&&、||、!）と共に使用された場合

重要なポイント：単項の+演算子は、二項の+演算子よりも高い優先順位を持っています。これが後述の奇妙な挙動の鍵となります。

コードの詳細な解説

以上を踏まえて、コードを1行ずつ見ていきましょう。

2行目：文字列に対する%演算子

result = '127' % 5;

%演算子は算術演算子であるため、暗黙的な型強制が働き、文字列'127'は数値127へと自動的に変換されます。その結果、127 % 5 = 2が計算され、resultには数値の2が格納されます。これが「%演算子が文字列でも機能する」ように見える理由です。実際には、演算の前に文字列が数値へ変換されているのです。

5行目：文字列連結における予想外の結果

fullName = firstName + + lastName;

この式は、通常の左から右への評価とは異なり、次のように解釈されます。

fullName = firstName + (+lastName);

これは単項の+演算子が二項の+演算子より高い優先順位を持つためです。そのため、まず+lastNameが評価され、単項+によって文字列'Malik'は数値への変換を試みます。しかし'Malik'は有効な数値ではないため、変換結果はNaN（Not a Number）になります。

したがって、式は次のように変わります。

fullName = firstName + NaN;

さらに、二項の+演算子の片方（firstName）が文字列であるため、文字列連結が優先され、NaNは文字列"NaN"として扱われます。最終的な出力は以下の通りです。

fullName = 'ArmaanNaN'

まとめ

この記事から学べる重要なポイントは以下の2つです。

• 算術演算子（%）を使うと、オペランドは暗黙的に数値へ変換されるため、数字のみの文字列でも計算が可能になる。
• 単項の+演算子は二項の+より優先順位が高いため、a + + bのような記述は意図しない結果（NaNとの連結）を招く可能性がある。

JavaScriptの型強制を正しく理解することで、このような予測困難なバグを未然に防ぎ、より安全で読みやすいコードを書くことができます。特に+演算子を使用する場面では、文字列連結と数値加算のどちらが意図した操作なのかを常に意識しましょう。