- 1. 基本:プリミティブ値とラッパーオブジェクトの違い
- 2. オートボクシング:プリミティブでもメソッドが使える理由
- 3. プロパティを付けても残らない(破棄される)
- 4. Boolean の罠:オブジェクトは常に truthy
- 5. 数値リテラルの構文トラップ
- 6. undefined / null はラッパーなし(TypeError)
- 7. 明示的に変換したいとき
- 8. Object() でラッパーを明示的に作る
- 9. valueOf() と toString() の挙動比較
- 10. 比較時の型変換の流れ
- 11. BigInt と Symbol の特別扱い
- 12. プリミティブのコピー動作
- 13. ラッパーオブジェクトは参照を共有する
- 14. instanceof の違い
- 15. 実務バグ例(リアルに起きる)
- まとめ
1. 基本:プリミティブ値とラッパーオブジェクトの違い
let n1 = 10;
let n2 = new Number(10);
console.log(typeof n1); // "number"
console.log(typeof n2); // "object"
console.log(n1 == n2); // true (型変換後は等しい)
console.log(n1 === n2); // false (型が違う)
JavaScript解説:new Number(10) は「Number型オブジェクト」であって、数値リテラルの「プリミティブ値」ではない。== はオブジェクト → プリミティブに変換するため値が一致するが、=== では不一致。
2. オートボクシング:プリミティブでもメソッドが使える理由
let str = "hello";
console.log(str.toUpperCase()); // "HELLO"
console.log(str.length); // 5
JavaScript解説:"hello" は String オブジェクトではないけれど、メソッド呼び出し時にnew String("hello") が一時的に作られて .toUpperCase() が実行される。
処理が終わるとオブジェクトは破棄される。
3. プロパティを付けても残らない(破棄される)
let str = "abc";
str.x = 99;
console.log(str.x); // undefined
JavaScript解説:str.x = 99 は一時的な String オブジェクトに x を追加しただけ。
すぐ破棄されるため次の行では存在しない。
4. Boolean の罠:オブジェクトは常に truthy
let b1 = false;
let b2 = new Boolean(false);
if (b1) console.log("b1 true"); else console.log("b1 false"); // b1 false
if (b2) console.log("b2 true"); else console.log("b2 false"); // b2 true ❗
JavaScript解説:new Boolean(false) はオブジェクト → truthy。
中身が false でも、条件式では常に「真」になる。
5. 数値リテラルの構文トラップ
// console.log(1.toString()); // 構文エラー ❌
console.log((1).toString()); // "1"
console.log(1..toString()); // "1"
JavaScript解説:1.toString() は「小数点」と解釈され構文エラー。
括弧で囲むか、. を2つ続けると動く(2つ目のドットがプロパティアクセス)。
6. undefined / null はラッパーなし(TypeError)
let u;
let n = null;
console.log(typeof u); // "undefined"
console.log(typeof n); // "object"
// u.toString(); // ❌ TypeError: Cannot read properties of undefined
// n.valueOf(); // ❌ TypeError: Cannot read properties of null
JavaScript解説:undefined と null にはラッパーオブジェクトが存在しないため、
メソッドやプロパティアクセスは即エラー。
7. 明示的に変換したいとき
let x = "42";
console.log(Number(x)); // 42
console.log(String(100)); // "100"
console.log(Boolean("")); // false
console.log(Boolean("hi")); // true
JavaScript解説:new を使わず、関数として呼び出すことでプリミティブ変換できる。Number() / String() / Boolean() は安全な型変換。
8. Object() でラッパーを明示的に作る
let a = 5;
let o = Object(a);
console.log(o instanceof Number); // true
console.log(typeof o); // "object"
JavaScript解説:Object(プリミティブ) はその型に対応するラッパーを返す。Object(5) → new Number(5) と同等。
9. valueOf() と toString() の挙動比較
let numObj = new Number(12.34);
console.log(numObj.valueOf()); // 12.34
console.log(numObj.toString()); // "12.34"
let strObj = new String("abc");
console.log(strObj.valueOf()); // "abc"
console.log(strObj.toString()); // "abc"
JavaScript解説:valueOf() はプリミティブ値を返す。toString() は文字列化した表現を返す。
等価演算子で比較されるとき、valueOf() が呼ばれることが多い。
10. 比較時の型変換の流れ
let numObj = new Number(100);
console.log(numObj == 100); // true (valueOf() で比較)
console.log(numObj === 100); // false (型が違う)
console.log(numObj.valueOf() === 100); // true
JavaScript解説:== ではラッパーオブジェクト → プリミティブに変換(内部的に valueOf() 呼び出し)。=== では変換されない。
11. BigInt と Symbol の特別扱い
let big = BigInt(123);
console.log(typeof big); // "bigint"
// new BigInt(123); // ❌ TypeError
let sym = Symbol("x");
console.log(typeof sym); // "symbol"
// new Symbol("x"); // ❌ TypeError
JavaScript解説:BigInt と Symbol は コンストラクタではない。new で呼ぶとエラー。
12. プリミティブのコピー動作
let a = "hello";
let b = a; // 値コピー(独立)
b = "world";
console.log(a); // "hello"
console.log(b); // "world"
JavaScript解説:
プリミティブは 値渡し。
一方、オブジェクトは参照渡し(次の例参照)。
13. ラッパーオブジェクトは参照を共有する
let x = new String("hi");
let y = x;
y.extra = "OK";
console.log(x.extra); // "OK" ✅
JavaScript説:
オブジェクトは参照がコピーされるため、プロパティの追加・変更が共有される。
これがプリミティブとの大きな違い。
14. instanceof の違い
let s1 = "abc";
let s2 = new String("abc");
console.log(s1 instanceof String); // false
console.log(s2 instanceof String); // true
JavaScript解説:
プリミティブは String のインスタンスではない。
ラッパーオブジェクトだけが instanceof String にマッチする。
15. 実務バグ例(リアルに起きる)
// ❌ 間違った真偽チェック
let isOk = new Boolean(false);
if (isOk) {
console.log("実行されてしまう…"); // 実行される
}
JavaScript理由: isOk はオブジェクトなので truthy。
修正方法:
let isOk = Boolean(false); // または false
if (isOk) { ... } // 実行されない(正しい)
JavaScriptまとめ
| 種類 | 生成例 | 型 | 注意点 |
|---|---|---|---|
| プリミティブ | let x = 5; | "number" | メソッド使用OK(自動ボクシング) |
| ラッパーオブジェクト | let x = new Number(5); | "object" | 比較・真偽判定で混乱しやすい |
| 明示的変換 | Number("5") | "number" | 推奨(安全) |
| 自動変換 | "5" * 2 → 10 | 演算時に自動 | 暗黙の型変換に注意 |

