一般看理论性知识相对枯燥一些,下面一起带着问题来解释吧。
问题
求以下输出结果,并说明原因:
var x = 1
function foo(x,y = function(){
var x = 2
}){
x = 3
y()
console.log(x)
}
foo()
cosnole.log(x)
解析
首先我们要明白作用域的问题,函数作用域以及全局作用域的知识点。
值得注意的是,上述问题中,y函数里的x看似将作为全局作用域,实则赋值的是foo()函数中的参数x
var x = 1
function foo(
x,
y = function () {
x = 2 // 如果此处是 x = 2,则x为foo()函数的参数x,不会覆盖全局变量1,若有var声明,则x作用域为y()函数内部
}
) {
x = 3 // 因为此时的x为foo()函数的参数,所以不是全局变量,并不能覆盖全局变量之前的值1
y()
console.log(x)
}
foo() // 2
console.log(x) // 1
如果foo()函数没有为x的参数呢?
var x = 1
function foo(
y = function () {
x = 6 // foo()函数没有为x的参数,所以x为全局变量
}
) {
x = 3 // foo()函数没有为x的参数,所以x为全局变量
y()
console.log(x)
}
foo() // 6
console.log(x) // 6
结果显然会覆盖全局变量1。
那如果foo()函数内部有x呢?
var x = 1
function foo(
y = function () {
x = 6
}
) {
var x = 3 // 如果函数内部有x值则将不继续向外层寻找x值,故内部函数作用域x值为3
y()
console.log(x)
}
foo() // 3
console.log(x) // 6
总结
总结就是大家审题一定要仔细呀,不要想当然!