---
description: 🚧 under construction
---

# arrow function as class field❗️

[JS](../../..) ⟩ [objects](../../obj) ⟩ [arrow function]() ⟩ as class field

{% hint style="warning" %}
* the <mark style="color:yellow;">**body**</mark> of a [class](../../class "mention") has a [this](../../../concept/execution-context/this "mention") <mark style="color:yellow;">**context**</mark>.
* [](<> "mention") <mark style="color:yellow;">**as**</mark> [field](../../class/member/field "mention") <mark style="color:orange;">**closes over**</mark> the **class**'s [this](../../../concept/execution-context/this "mention") <mark style="color:yellow;">**context**</mark>.&#x20;
* the [this](../../../concept/execution-context/this "mention") <mark style="color:yellow;">**inside**</mark> the **arrow function's&#x20;**<mark style="color:yellow;">**body**</mark>：
  * will <mark style="color:red;">**correctly**</mark> point to the <mark style="color:yellow;">**instance**</mark> (or the <mark style="color:yellow;">**class itself**</mark>, for [static fields](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/static)).&#x20;
  * it is a [closure](../closure "mention"), <mark style="color:red;">**not**</mark> the <mark style="color:yellow;">**function's own binding**</mark>, the <mark style="color:yellow;">**value**</mark> of [this](../../../concept/execution-context/this "mention") <mark style="color:red;">**will not change**</mark> based on the execution context (call site):exclamation:

👉 MDN ⟩ [arrow functions used as methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions#arrow_functions_used_as_methods) ⭐️
{% endhint %}

{% tabs %}
{% tab title="👥 相關" %}
* [as-method](as-method "mention").
* [field](../../class/member/field "mention")
{% endtab %}

{% tab title="📘 手冊" %}
* [ ] [arrow functions used as methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions#arrow_functions_used_as_methods) ⭐️
* [ ] [Public class fields](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/Public_class_fields)
{% endtab %}
{% endtabs %}
