> For the complete documentation index, see [llms.txt](https://lochiwei.gitbook.io/web/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lochiwei.gitbook.io/web/js/variable/declare/let/let-cant-shadow-param.md).

# let can't shadow parameter even in sloppy mode❗️

[JS](/web/js.md) ⟩ [variable](/web/js/variable.md) ⟩ [shadowing](/web/js/variable/shadow.md) ⟩ let can't shadow parameter even in sloppy mode.

{% hint style="success" %}
:white\_check\_mark:[let](/web/js/variable/declare/let.md) <mark style="color:red;">**can't**</mark>**&#x20;**<mark style="color:yellow;">**shadow**</mark> [parameter](/web/js/val/func/param.md)(s) <mark style="color:yellow;">**even in**</mark> [sloppy mode](/web/js/concept/env/js-engine/mode/sloppy-mode.md):exclamation:
{% endhint %}

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

* [function declaration instantiation](/web/js/val/func/declare/instantiation.md)
* [lexical environment](/web/js/concept/execution-context/lexical-environment.md)
* [parameter](/web/js/val/func/param.md) / [argument](/web/js/val/func/argument.md)
* [strict mode](/web/js/concept/env/js-engine/mode/strict-mode.md)
* :white\_check\_mark:[stop using var❗️](/web/js/variable/declare/var/stop-using-var.md)
* :exclamation:[var can shadow parameter even in strict mode❗️](/web/js/variable/declare/var/param-by-var.md)
  {% endtab %}

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

* replit：l[et can't shadow parameters](https://replit.com/@pegasusroe/shadow-parameter-by-let#index.js)

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

const { log } = console;

// ⭐ only "simple" parameters
//    "parameters" / "body declarations" in the same environment record.
function f(x) {
    let x = 1;        // ⛔ SyntaxError
    log(x);
}

// ⭐ "non-simple" parameters exist,
//    "parameters" / "body declarations" in different environment records.
function g(x = 0) {
    let x = 100;      // ⛔ SyntaxError
    log(x);
}

function h(x = 0) {
    var x = 300;      // ❗ "var" do shadow parameter (even in strict mode)
    log(x);
}

function k(x) {
    var x = 400;      // ❗ "var" do shadow parameter
    log(x);
}

//   mode:   sloppy            strict
// -----------------------------------------------
f(10);    // ⛔ SyntaxError    ⛔ SyntaxError
g(20);    // ⛔ SyntaxError    ⛔ SyntaxError
h(30);    // ✅ 300            ✅ 300
k(40);    // ✅ 400            ✅ 400

// ⛔ SyntaxError: Identifier 'x' has already been declared
```

{% endtab %}

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

* [JS spec](/web/master/ref/js-spec.md) ⟩&#x20;
  * [FunctionDeclarationInstantiation](https://tc39.es/ecma262/#sec-functiondeclarationinstantiation)
  * [Function Environment Record](https://tc39.es/ecma262/#sec-function-environment-records)
    {% endtab %}

{% tab title="🗣 討論" %}

* [shadowing parameters by local variables?](https://stackoverflow.com/questions/74154964/shadowing-parameters-by-local-variables) (my question)
* [Where are arguments positioned in the lexical environment?](https://stackoverflow.com/questions/61208843/where-are-arguments-positioned-in-the-lexical-environment) ⭐️
  {% endtab %}

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

* [ ] [YDKJS: Scope & Closures (v.2)](/web/master/ref/book/you-dont-know-js-series-v.2/ydkjs-scope-and-closures-v.2.md) ⟩ Ch. 8 ⟩ [Parameter Scope](https://github.com/getify/You-Dont-Know-JS/blob/2nd-ed/scope-closures/apA.md#parameter-scope)
  {% endtab %}
  {% endtabs %}