# runtime

[JS](..) ⟩ [concepts](../concept) ⟩ runtime

{% hint style="success" %}
the <mark style="color:orange;">**period**</mark> when a program is <mark style="color:yellow;">**running**</mark> (generally after [compile-time](compile-time "mention")).
{% endhint %}

{% tabs %}
{% tab title="⭐️ 重點" %}
{% hint style="warning" %}
[scope](../scope "mention")s&#x20;

* <mark style="color:yellow;">**determined**</mark> at [compile-time](compile-time "mention").&#x20;
* <mark style="color:red;">**but**</mark> <mark style="color:yellow;">**created**</mark> at <mark style="color:purple;">**runtime**</mark> (each time a [scope](../scope "mention") needs to run).
* [id](../grammar/token/id "mention")s are <mark style="color:yellow;">**registered**</mark> to <mark style="color:yellow;">**respective**</mark> [scope](../scope "mention") during [compile-time](compile-time "mention").
* <mark style="color:red;">**but in**</mark> [sloppy-mode](../concept/env/js-engine/mode/sloppy-mode "mention"), you can <mark style="color:red;">**cheat**</mark> it at <mark style="color:purple;">**runtime**</mark>. \
  ( 👉 [modify-current-scope-at-runtime](../concept/env/js-engine/mode/sloppy-mode/modify-current-scope-at-runtime "mention"):exclamation:)
{% endhint %}

{% hint style="warning" %}
[this](../concept/execution-context/this "mention")&#x20;

* is <mark style="color:red;">**not**</mark>**&#x20;**<mark style="color:yellow;">**fixed**</mark> in a [method](../val/obj/method "mention").&#x20;
* <mark style="color:yellow;">**does**</mark>**&#x20;**<mark style="color:red;">**not**</mark>**&#x20;**<mark style="color:yellow;">**necessarily refer**</mark> to the [obj](../val/obj "mention") containing the [method](../val/obj/method "mention").
* is <mark style="color:yellow;">**passed**</mark> (at <mark style="color:purple;">**runtime**</mark>) by the <mark style="color:yellow;">**function call**</mark>.  👉 [method binding](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this#method_binding).
{% endhint %}

{% hint style="info" %}
[vs-arg](../val/func/vs-arg "mention")

* [param](../val/func/param "mention")(s) live in <mark style="color:yellow;">**function's definition**</mark> ([compile-time](compile-time "mention"))
* [argument](../val/func/argument "mention")(s) live in <mark style="color:yellow;">**call sites**</mark> ([runtime](runtime "mention"), may be <mark style="color:red;">**different**</mark> <mark style="color:yellow;">**on each call**</mark>)
{% endhint %}
{% endtab %}

{% tab title="🔴 主題" %}
* [dynamic](../val/type/term/dynamic "mention") - the [type](../val/type "mention") of a [val](../val "mention") can be changed at <mark style="color:purple;">**runtime**</mark>.
* [dynamic-binding](../grammar/token/id/dynamic-binding "mention")\
  (the [val](../val "mention") of an [id](../grammar/token/id "mention") is <mark style="color:red;">**not determined**</mark> until <mark style="color:purple;">**runtime**</mark>)
{% endtab %}

{% tab title="👥 相關" %}
* [](<> "mention") - how JS is compiled
* compare：[compile-time](compile-time "mention")
* [runtime](../err/runtime "mention")
* [scope](../scope "mention")s are created at <mark style="color:purple;">**runtime**</mark>.
{% endtab %}

{% tab title="📗 參考" %}
* Baeldung ⟩ [Runtime vs. Compile Time](https://www.baeldung.com/cs/runtime-vs-compile-time)
{% endtab %}
{% endtabs %}
