---
description: 🚧 under construction
---

# \[\[HomeObject]]

[JS](../../..) ⟩ [types](../../type) ⟩ [object](broken-reference) ⟩ [method]() ⟩ HomeObject

{% hint style="info" %}
🚧
{% endhint %}

![](https://2527454625-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MfvEFZnSBhKT6fJmus0%2Fuploads%2FF5kvbtrVPhdyhGjb5dT4%2FHomeObject.png?alt=media\&token=a8a489da-d843-4db2-8305-e9de51c1e6ed)

{% tabs %}
{% tab title="🗺️ 圖表" %}

{% endtab %}

{% tab title="💈範例" %}
* [replit](https://replit.com/@pegasusroe/JS-method-HomeObject#index.js)

```javascript
 const { log } = console;

let animal = {
    sayHi() { log(`I'm a 🐶`) }    // [[HomeObject]] === animal
};

let rabbit = {
    __proto__: animal,
    sayHi() { super.sayHi() }      // [[HomeObject]] === rabbit
};

let plant = {
    sayHi() { log("I'm a ☘️") }    // [[HomeObject]] === plant
};

let tree = {
    __proto__: plant,

    // (non-method syntax for objects❗)
    // ----------------------------------------------------------------
    // ⭐ `rabbit.sayHi` method remembers its [[HomeObject]]❗
    // ⭐ `tree.sayHi` is NOT a method❗
    //    (just a "reference" to another method)
    sayHi: rabbit.sayHi            // [[HomeObject]] === rabbit
    // ----------------------------------------------------------------
};

tree.sayHi();
// super.sayHi()                   // ⭐ in `rabbit.sayHi` method
//
//     super === [[HomeObject]].[[Prototype]]
//           === rabbit.[[Prototype]]
//           === animal
//
// animal.sayHi()                  // "I'm a 🐶"
```
{% endtab %}

{% tab title="⭐️ 重點" %}
{% hint style="danger" %}
⭐️ 非常重要：

* only <mark style="color:yellow;">**methods**</mark> have <mark style="color:purple;">**`[[HomeObject]]`**</mark>.
* <mark style="color:purple;">**`[[HomeObject]]`**</mark> <mark style="color:red;">**can’t be changed**</mark>.
* [super](../../class/inheritance/super "mention") can only be used <mark style="color:yellow;">**within methods**</mark>.
* [super](../../class/inheritance/super "mention") === [<mark style="color:purple;">**`[[HomeObject]]`**</mark>](home-object)<mark style="color:purple;">**`.`**</mark>[<mark style="color:purple;">**`[[Prototype]]`**</mark>](../proto)⭐️&#x20;
{% endhint %}

{% hint style="success" %}
* a method's <mark style="color:orange;">**HomeObject**</mark> is <mark style="color:yellow;">**only**</mark> used when calling [super](../../class/inheritance/super "mention").
* if a **method** <mark style="color:yellow;">**does not**</mark> use [super](../../class/inheritance/super "mention"), then we can still consider it "<mark style="color:orange;">**free**</mark>" (like a free [func](../../func "mention"))
{% endhint %}

{% hint style="danger" %}
for <mark style="color:red;">**objects**</mark>, **methods** must be specified：&#x20;

* as <mark style="color:blue;">`method()`</mark>(**method** syntax)
* <mark style="color:red;">**not**</mark> as <mark style="color:blue;">`nonMethod: function()`</mark> (**non-method** syntax)
{% endhint %}

```javascript
const { log } = console;

// -------------------------------------------------------------
// ⭐️ only methods have [[HomeObject]].
// ⭐️ `super` can only be used in a method (with [[HomeObject]])
// ⭐️ super === [[HomeObject]].[[Prototype]]
// -------------------------------------------------------------

// ❌ regular function
// --------------------
function f1(){ super.method() }
//             ^^^^^                // ⛔️ SyntaxError: 'super' unexpected here.

// ❌ arrow function (not in a method)
// ------------------------------------
let f2 = () => super.method();
//             ^^^^^                // ⛔️ SyntaxError: 'super' unexpected here.

const a = {
    // ❌ object property (function as property value)
    // ------------------------------------------------
    nonMethod: function(){ super.method() }
    //                     ^^^^^    // ⛔️ SyntaxError: 'super' unexpected here.
}

const b = {
    // ✅ object method:
    // ------------------
    // • [[HomeObject]] === b
    // • super === [[HomeObject]].[[Prototype]]
    //         === b.[[Prototype]]
    //         === Object.prototype
    method(){ log(`${super.constructor.name}`) }
}

b.method();    // Object
```
{% endtab %}

{% tab title="📗 參考" %}
* [ ] JS.info ⟩&#x20;
  * [x] [\[\[HomeObject\]\]](https://javascript.info/class-inheritance#homeobject) - every **method** remembers its [HomeObject](https://javascript.info/class-inheritance#homeobject).
  * [ ] [Mixins](https://javascript.info/mixins#a-mixin-example)
{% endtab %}

{% tab title="👥 相關" %}
* a method's <mark style="color:orange;">**HomeObject**</mark> is <mark style="color:yellow;">**only**</mark> used when calling [super](../../class/inheritance/super "mention").
* [super](../../class/inheritance/super "mention") === [<mark style="color:purple;">**`[[HomeObject]]`**</mark>](home-object)<mark style="color:purple;">**`.`**</mark>[<mark style="color:purple;">**`[[Prototype]]`**</mark>](../proto)⭐️&#x20;
* [mixin-inheritance](../extend/mixin/mixin-inheritance "mention") is possible through <mark style="color:purple;">\[\[HomeObject]]</mark>.
{% endtab %}
{% endtabs %}
