JS作用域,这里为什么读不到hello这个变量?

Roger
  • 342
window.onload = function() {
  var hello = 'hello world';
  sayHello();
}
function sayHello() {
  console.log(hello);
}

按理说在调用sayHello函数的时候会先找当前函数内有没有这个变量,没有的话应该往上找找到var hello的呀?
但是如果使用参数,就是正确的。

window.onload = function() {
  var hello = 'hello world';
  sayHello(hello);
}
function sayHello(text) {
  console.log(text);
}
回复
阅读 1.6k
8 个回答

JS中的作用域是函数作用域。
也就是函数内的局部变量,在另外的函数中是没法获取到的。

window.onload 中的 hello 是函数的局部变量。
从编码规范来说,你的第二种更清晰一些。

// 这样是可以的。
var hello;
window.onload = function() {
  hello = 'hello world';
  sayHello();
};

var sayHello = function() {
  console.log(hello);
};

js的作用域是词法作用域

所有 var 声明的变量都是局部变量,只能被当前作用域访问到。

你所说的往上找,是原型链相关的知识点,建议花点时间去学学!

window.onload = function() {
var hello = 'hello world';
sayHello();
}
function sayHello() {
console.log(hello);
}

这段代码 首先有两个作用域 作用域1 window.onload=function(){}; 作用域2 sayHello函数
第一个作用域中有一个变量 这个变量只是属于window.onload的
函数console.log(hello); 当创建函数sayHello的时候属于是在全局下创建的函数,这个函数直接指向的是window 所以里面的console.log(hello)会再全局中找hello这个值。因为在全局中没有找到hello 所以会报错
虽然是在window.onload的作用域中引用的sayHello函数,但是sayHello的词法作用域并不是在window.onload 下

第二段代码因为加了参数。它的词法环境发生了改变 ,也就变成了哪里调用找哪里。当在window.onload中调用了sayHello(hello)函数,那么sayHello函数的词法环境就是在当前window.onload的作用域中,在当前作用域中有hello这个值 返回变量hello。

个人见解,讲得有点乱,欢迎指正。

一般来说是会在当前函数内有没有这个变量,没有的话应该往上找找到,但是你这里sayHello()和window.onload()都是函数属于同一级,var hello = 'hello world'是window.onload()中内部变量,不属于全局变量,所以sayHello()它找不到。
除了传参的形式,还可以采用下面的方法:

window.onload = function() {
  var hello = 'hello world';
  function sayHello(){
  console.log(hello);
  }
  return sayHello;
}
var c=window.onload();
c();
已注销
  • -2
新手上路,请多包涵
你知道吗?

宣传栏