# accidental global variable in sloppy mode❗️

* [JS](https://lochiwei.gitbook.io/web/js) ⟩ [concepts](https://lochiwei.gitbook.io/web/browser/concepts) ⟩ [sloppy mode](https://lochiwei.gitbook.io/web/js/concept/env/js-engine/mode/sloppy-mode) ⟩ accidental global variable
* [JS](https://lochiwei.gitbook.io/web/js) ⟩ [scope](https://lochiwei.gitbook.io/web/js/scope) ⟩ [global](https://lochiwei.gitbook.io/web/js/scope/global) ⟩ [variable](https://lochiwei.gitbook.io/web/js/scope/global/variable) ⟩ accidental global variable

{% hint style="warning" %}
[assignment](https://lochiwei.gitbook.io/web/js/grammar/op/assign/assignment "mention") to [undeclared](https://lochiwei.gitbook.io/web/js/grammar/token/id/undeclared "mention") <mark style="color:yellow;">**in**</mark> [](https://lochiwei.gitbook.io/web/js/concept/env/js-engine/mode/sloppy-mode "mention") will result in&#x20;

* [accidental-global-variable-in-sloppy-mode](https://lochiwei.gitbook.io/web/js/concept/env/js-engine/mode/sloppy-mode/accidental-global-variable-in-sloppy-mode "mention")
* <mark style="color:orange;">**unlike**</mark> [var](https://lochiwei.gitbook.io/web/js/scope/global/variable/var "mention"), these <mark style="color:yellow;">**accidental**</mark> [prop](https://lochiwei.gitbook.io/web/js/scope/global/object/prop "mention") <mark style="color:green;">**can**</mark>**&#x20;**<mark style="color:yellow;">**be deleted**</mark> by [delete](https://lochiwei.gitbook.io/web/js/val/obj/prop/create/delete "mention"):exclamation:
  {% endhint %}

{% hint style="danger" %}
[assignment](https://lochiwei.gitbook.io/web/js/grammar/op/assign/assignment "mention") to [undeclared](https://lochiwei.gitbook.io/web/js/grammar/token/id/undeclared "mention") <mark style="color:yellow;">**in**</mark> [strict-mode](https://lochiwei.gitbook.io/web/js/concept/env/js-engine/mode/strict-mode "mention") will result in&#x20;

* :no\_entry:️ [<mark style="color:red;">**ReferenceError**</mark>](https://lochiwei.gitbook.io/web/js/err/ref)：[<mark style="color:yellow;">**'...' is not defined**</mark>](https://lochiwei.gitbook.io/web/js/err/ref/not-defined):exclamation:&#x20;
  {% endhint %}

{% tabs %}
{% tab title="💈範例" %}

* replit：[accidental global var](https://replit.com/@pegasusroe/accidental-global-var#index.js)

```javascript
// 'use strict';        // sloppy mode

// test for run/compile time error
log('hello');            // hello (compilation is OK)

// test accidental global variable
function f() {
    
    function g() {
        // ❗ assignment to an "undeclared variable" 
        //    will result in:
        //    • an "accidental global variable" in "non-strict mode".
        //    • a "ReferenceError" in strict mode.
        neverDeclared = 123;
    }

    g();
}

f();

// accidental global variable❗
neverDeclared,                // 123
globalThis.neverDeclared,     // 123
```

in [strict-mode](https://lochiwei.gitbook.io/web/js/concept/env/js-engine/mode/strict-mode "mention")

```javascript
'use strict';            // strict mode

console.log('hello');    // hello

// block scope
{
    neverDeclared = "Surprise";    // runtime error
    // ⛔️ ReferenceError: `neverDeclared` is not defined
}
```

{% endtab %}

{% tab title="👥 相關" %}

* [variable](https://lochiwei.gitbook.io/web/js/scope/global/variable "mention")
* :white\_check\_mark:[always](https://lochiwei.gitbook.io/web/js/concept/env/js-engine/mode/strict-mode/always "mention") to <mark style="color:yellow;">**prevent**</mark> <mark style="color:purple;">**accidental global variable**</mark>.
  {% endtab %}

{% tab title="📗 參考" %}

* [ ] [ydkjs-scope-and-closures-v.2](https://lochiwei.gitbook.io/web/master/ref/book/you-dont-know-js-series-v.2/ydkjs-scope-and-closures-v.2 "mention") > [Ch. 2](https://github.com/getify/You-Dont-Know-JS/blob/2nd-ed/scope-closures/ch2.md#global-what)
  {% endtab %}

{% tab title="📘 手冊" %}

* [Strict mode](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode)
  {% endtab %}
  {% endtabs %}