javascript Object()コンストラクタとObject.create()について

Question

Object()コンストラクタとObject.create()で生成するオブジェクトなど、生成方法がいくつかあって混乱しています。下記11個の生成方法でつくったオブジェクトの理解が正しいのか、お時間のある方に見てもらえたらと思い投稿します。

function f(){return 11;}

o1 =Object(f);              // f f(){return 11}
o2 =Object(f());            // Number(11)
o3 =Object(new f);          // f .. Prototype:Object
o4 =Object(new f());        // f .. Prototype:Object
o5 =new Object(f);          // f f(){return 11}
o6 =new Object(f());        // Number(11)
o7 =new Object(new f);      // f .. Prototype:Object
o8 =new Object(new f());    // f .. Prototype:Object
o9 =Object.create(f);       // Function .Prototype:f f(){return 11}
// o10=Object.create(f());     // Uncaught TypeError:...
o11=Object.create(new f);   // f .. Prototype:f 
o12=Object.create(new f()); // f .. Prototyoe:f

// 返値 11 を表示
console.log(o1());          // o5
console.log(Number(o2));    // o6
console.log(Object.getPrototypeOf(o3).constructor()); // o4 o7 o8
console.log(Object.getPrototypeOf(o9)());
console.log(Object.getPrototypeOf(o11).constructor()); // o12

上記を見ていると、

1. Object()コンストラクターでは、Object() と new Object()は、同じ働きをしている

　 どちらを使っても問題はない
2. o1とo5は、変数fに格納されているオブジェクトが戻され
3. o2とo6は、関数fの返り値のラッパー型が戻され
4. o3,o4,o7,o8は、PrototypeにObjectが設定されたfのオブジェクトが戻され
2~4はPrototypeにObjectが設定されたオブジェクトが戻る

1. o9はf()をPrototyoeに設定した関数型が戻され
2. o11とo12は、Prototypeにfのインスタンスが設定されたオブジェクトが戻されている

という理解でいいのでしょうか？

Comments

[maisumakun]

こちらのような情報原は確認しましたか？

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Object/Object

Answer 1

Object()

Object() はObject型に変換する関数です。
引数が「Undefined 型」「Null 型」の場合に特別なオブジェクトを返しますが、それ以外の型にはObject型への変換処理として扱います。

• 20.1.1.1 Object - ECMAScript® 2021 Language Specification

ToObject

• 7.1.18 ToObject - ECMAScript® 2021 Language Specification

Object型への変換処理は次の工程で行われます。

• 対象が「Undefined 型」「Null 型」なら、TypeErrir
• 対象が「Object 型」なら、対象をそのまま返す
• 対象が「上記以外の型」なら型ごとの個別処理で「Object 型」に変換して返す

'use strict';
function f(){return 11;}

const o1 = Object(f);
console.info(1, o1);
console.log(o1 === f);  // true

const o2 = Object(f());
console.info(2, o2);
console.log(Object.getPrototypeOf(o2) === Number.prototype); // true

const o3 = new f();
console.info(3, o3);
console.log(Object.getPrototypeOf(o3) === f.prototype); // true

const o41 = new f();
const o42 = Object(o41);
console.info(4, o41, o42);
console.log(o41 === o42);  // true
console.log(Object.getPrototypeOf(o41) === f.prototype); // true
console.log(Object.getPrototypeOf(o42) === f.prototype); // true

Object.create()

Object.create() は「第一引数を [[Prototype]] に持つオブジェクトを生成する関数」です。

'use strict';
function f(){ return 11; }

const f1 = new f;
console.log(Object.getPrototypeOf(Object.create(f1)) === f1); // true

new Object()

ES2021で new Object() を探しましたが、現在の挙動を表す説明は見つかりませんでした。

---

new Object() が「[[Prototype]] に Object.prototype を持たないオブジェクト」を返す場合がある点には注意が必要です。

• new 演算子 - JavaScript | MDN

下記コードは多くの人が納得する挙動をしていますが、

console.log(Object.getPrototypeOf(new Object) === Object.prototype); // true

下記コードの挙動には納得しない人もいると思います。

'use strict';
function f(){ return 11; }

console.log(Object.getPrototypeOf(new Object(f)) === Object.prototype); // false

Re: old_dog さん

Comments

[old_dog]

think49様、まとめて頂いたコードと、リンク先の参照先を、何度か見返してみました。ご教授くださいましたコードは、どれも大変に整理しやすく、理解の助けになり、本当に助かりました、というか、ありがたく感じております。リンク先の解説も、見たことがないものがあり、理解が進みました。まだ理解しきれていないところもあるかもしれませんが、随分と頭が整理できてきた気がしております。

ご指導のご投稿から返事が遅れてしまって大変にすみませんでした。とてもとても学習の助けになりました。このような質問に、貴重なお時間、詳細丁寧なご解説をいただきまして、心よりお礼申し上げます。ありがとうございました。

Answer 2

function f(){return 11;}

そもそも論として、「this以外の値をreturnする」関数をnewの対象として使うこと自体が妥当ではありません。試験目的以外で書くべきではありません。

値をreturnする関数をnewで呼んだ場合、

• 返り値がオブジェクトだった場合→新規作成されたオブジェクトは捨てられ、newの返り値は関数の返り値となる
• 返り値がオブジェクトでない場合→返り値は無視され、新規作成されたオブジェクトが返される

という、値ごとに正反対な挙動を示すようになります（MDN）。

Comments

[maisumakun]

資格試験や言語処理系自体の実装などのように、エッジケースまで厳密に詰めないといけないような状況ならともかく、実用的なコードを書くという目的で検討するのなら、このコードの難解さは人工的・衒学的すぎて役に立たないと考えます。

「自分で作った関数自体をプロトタイプとしてObject.createで別なオブジェクトを作る（o9）」なんて、考えたこともなかったですし、それがなにか有意義な利用ができるかというのも疑わしいです。

[old_dog]

「this以外の値をreturnする関数をnewの対象として使うこと自体が妥当ではありません」
ご指摘をありがとうございました。このようなご指導を頂けると、大変にありがたいです。ご指摘されて初めて、インスタンススコープというものを、もっと考えるべきことを教わったような気がします。

ご指導頂きました内容は、ノートに転写して何度も読み返させていただきます。
MDNのObject.create()とObject()コンストラクターをもう数度ほど読み直します。

maisumakun様、いつも本当にありがとうございます。
いつも感謝しております。
他の方の参考にならない質問にも真摯にご指導くださいましてありがとうございました。