---
description: 🚧 under construction
---

# left-hand side expression

[JS](../../..) ⟩ [statement](..) ⟩ [expression]() ⟩ [operator](../../op) ⟩ [left-hand side](lhs) ⟩&#x20;

{% hint style="success" %}
([op](../../op "mention")) ❓🚧
{% endhint %}

{% tabs %}
{% tab title="🔴 主題" %}
* <mark style="color:purple;">**left-hand side**</mark>**&#x20;**<mark style="color:yellow;">**expressions**</mark>
  * [property-access-expression](../../../val/obj/prop/access/property-access-expression "mention") ( [<mark style="color:blue;">**`.`**</mark>](../../../val/obj/prop/access/dot-notation-.), [<mark style="color:blue;">**`[]`**</mark>](../../../val/obj/prop/access/bracket-notation), [<mark style="color:blue;">**`?.`**</mark>](../../../val/obj/prop/access/optional-chaining), [<mark style="color:blue;">**`?.[]`**</mark>](../../../val/obj/prop/access/optional-chaining), [<mark style="color:blue;">**`?.()`**</mark>](../../../val/obj/prop/access/optional-invocation-.) )
  * [new.target](../../../val/obj/create/new/new.target "mention") (in constructors) refers to the constructor itself.
  * [new](../../../val/obj/create/new "mention") (object creation expression)
  *   [`import.meta`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import.meta)

      &#x20;an object exposing context-specific metadata to a JavaScript module.
  * [`super`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/super) \
    calls the parent constructor.
  *   [`...obj`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax)

      spread syntax allows an expression to be expanded in places where multiple arguments (for function calls) or multiple elements (for array literals) are expected.
{% endtab %}

{% tab title="⭐️ 重點" %}
{% hint style="info" %}
<mark style="color:yellow;">**two types of expressions**</mark>

* those that have <mark style="color:orange;">**side effects**</mark> (such as assigning values)&#x20;
* those that <mark style="color:yellow;">**purely evaluate**</mark>.
{% endhint %}

{% hint style="info" %}
you can use an [](<> "mention") to refer to an object's [prop](../../../val/obj/prop "mention")<mark style="color:yellow;">.</mark>&#x20;

👉 [bracket-notation](../../../val/obj/prop/access/bracket-notation "mention")
{% endhint %}
{% endtab %}

{% tab title="📗 參考" %}
* [ ] (2020) JavaScript The Definitive Guide, 1.3 A Tour of JavaScript
* [ ] [javascript-the-definitive-guide](../../../../master/ref/javascript-the-definitive-guide "mention") ⟩&#x20;
  * [ ] 1.3 A Tour of JavaScript
  * [ ] Ch. 4：Expressions & Operators
* [ ] [Expressions versus statements in JavaScript](https://2ality.com/2012/09/expressions-vs-statements.html) ⭐️
* [ ] [Javascript 的表達式 (Expressions) 和陳述式 (Statements)：一個用說的，一個用做的](https://medium.com/itsems-frontend/javascript-expressions-and-statements-7bd374effc95)
{% endtab %}

{% tab title="📘 手冊" %}
* [ ] [Expressions and operators](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators)
{% endtab %}

{% tab title="❓問題" %}
{% hint style="warning" %}
<mark style="color:red;">**問：**</mark>「為何 super, new, new.target, ... 這些稱為 left-hand side expression」❓

<mark style="color:green;">答：</mark>「...」
{% endhint %}
{% endtab %}
{% endtabs %}
