# no-shadow

禁止在外部作用域中声明的隐藏变量中的变量声明

影子化是局部变量与其包含范围内的变量共享相同名称的过程。例如：

var a = 3;
function b() {
    var a = 10;
}

在这种情况下，b() 内部的变量 a 将在全局范围内隐藏变量 a。这可能会在阅读代码时造成混乱，并且无法访问全局变量。

# 规则详情

该规则旨在消除阴影变量声明。

此规则的错误代码示例：

/*eslint no-shadow: "error"*/
/*eslint-env es6*/

var a = 3;
function b() {
    var a = 10;
}

var b = function () {
    var a = 10;
}

function b(a) {
    a = 10;
}
b(a);

if (true) {
    let a = 5;
}

# 选项

此规则采用一个选项，即对象，具有属性 "builtinGlobals"、"hoist"、"allow" 和 "ignoreOnInitialization"。

{
    "no-shadow": ["error", { "builtinGlobals": false, "hoist": "functions", "allow": [], "ignoreOnInitialization": false }]
}

# builtinGlobals

builtinGlobals 选项默认为 false。如果是 true，则该规则防止隐藏内置全局变量：Object、Array、Number 等。

{ "builtinGlobals": true } 选项的错误代码示例：

/*eslint no-shadow: ["error", { "builtinGlobals": true }]*/

function foo() {
    var Object = 0;
}

# hoist

hoist 选项具有三个设置：

functions（默认） - 在定义外部函数之前报告阴影。
all - 在定义外部变量/函数之前报告所有阴影。
never - 在定义外部变量/函数之前从不报告阴影。

# hoist: functions

默认 { "hoist": "functions" } 选项的错误代码示例：

/*eslint no-shadow: ["error", { "hoist": "functions" }]*/
/*eslint-env es6*/

if (true) {
    let b = 6;
}

function b() {}

虽然 if 语句中的 let b 在外部作用域的函数声明之前，但它是不正确的。

默认 { "hoist": "functions" } 选项的正确代码示例：

/*eslint no-shadow: ["error", { "hoist": "functions" }]*/
/*eslint-env es6*/

if (true) {
    let a = 3;
}

let a = 5;

因为 if 语句中的 let a 在外部作用域的变量声明之前，所以是正确的。

# hoist: all

{ "hoist": "all" } 选项的错误代码示例：

/*eslint no-shadow: ["error", { "hoist": "all" }]*/
/*eslint-env es6*/

if (true) {
    let a = 3;
    let b = 6;
}

let a = 5;
function b() {}

# hoist: never

{ "hoist": "never" } 选项的正确代码示例：

/*eslint no-shadow: ["error", { "hoist": "never" }]*/
/*eslint-env es6*/

if (true) {
    let a = 3;
    let b = 6;
}

let a = 5;
function b() {}

因为 if 语句中的 let a 和 let b 在外部作用域的声明之前，所以它们是正确的。

# allow

allow 选项是一个标识符名称数组，允许对其进行遮蔽。例如，"resolve"、"reject"、"done"、"cb"。

{ "allow": ["done"] } 选项的正确代码示例：

/*eslint no-shadow: ["error", { "allow": ["done"] }]*/
/*eslint-env es6*/

import async from 'async';

function foo(done) {
  async.map([1, 2], function (e, done) {
    done(null, e * 2)
  }, done);
}

foo(function (err, result) {
  console.log({ err, result });
});

# ignoreOnInitialization

ignoreOnInitialization 选项默认为 false。如果它是 true，那么当阴影变量可能仍未初始化时，它会阻止在其初始化程序中报告变量的阴影。

阴影变量必须在左侧。阴影变量必须位于右侧并在回调函数或 IIFE 中声明。

{ "ignoreOnInitialization": "true" } 选项的错误代码示例：

/*eslint no-shadow: ["error", { "ignoreOnInitialization": true }]*/

var x = x => x;

因为阴影变量 x 将阴影已经初始化的阴影变量 x。

{ "ignoreOnInitialization": true } 选项的正确代码示例：

/*eslint no-shadow: ["error", { "ignoreOnInitialization": true }]*/

var x = foo(x => x)

var y = (y => y)()

回调函数的基本原理是假设它们将在初始化期间被调用，因此在使用阴影变量时，阴影变量尚未初始化。

← no-sequences no-shadow-restricted-names →