Question

请解释这两种行为背后的逻辑是什么，以便轻松理解。

var a = 10;
function foo(){
    a = 20;
}
foo();
console.log(a);

打印---＆GT; a = 20;

var a = 10;
function foo(a){
        a = 20;
}
foo();
console.log(a);

打印---＆GT; a = 10;

Answer 1

由于范围

在Javascript中，当您在函数中分配参数时，您可以在该函数的范围内定义它，无论外部/全局范围内的名称是否已存在变量。

更新

值得一提的是，使用ES6的箭头函数，如果您的函数是在父类或函数中定义的，那么使用this关键字仍然可以访问外部变量。

示例

class Bar {

    this.a = 10;

    this.foo = function(a) {
        this.a = 20;    
    };

    this.foo2 = (a) => {
        this.a = 20;
    };

}

不完全相同，但它与范围有关

Answer 2

在第一个示例中，函数中的a正在替换函数外部的a的第一个声明，因为您没有在本地使用var（或{{1 }或let）。

在第二个示例中，函数接受const作为参数，因此它在本地作用于函数。请注意，即使 a未实际传入函数（因此a），也会发生。

A good article on scope and context可能对你有用。

Answer 3

检查以下代码段

＆＃13;

var a =10;
var b = a;
function foo(a){
        // a here woukd refer to the parameter a and not the global variable, since it got overridden 
        console.log(a, b);
        a= 20;
}
foo();
// prints the global variable a
console.log(a);

function bar(){
        console.log(a, b);
        // overrides the global variable a
        a = 20;
}

bar();
// prints the global variable a
console.log(a);

＆＃13;

Answer 4

第一个是因为全球范围

var a =10; function foo(){ a= 20; }

这里varieble a加入全局并从函数内部更新全局varieble可以访问每个地方

在第二个例子中，只是将varieble a的参考作为参数传递，并且在函数内部，recived参数值被更改

var a =10;
function foo(a){
 a= 20;
 console.log(a)
}
foo();
console.log(a);

请在控制台中运行第二个代码示例，然后您就可以了解更改。

Answer 5

在javascript中，函数变量有自己的作用域，如果你使用var，let，const或者使用函数中的形式参数中提供的变量。如果你不使用上述任何变量，那么范围将是全局的。

两个javascript函数行为背后的逻辑

5 个答案: