欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

关于JS作用域的简单理解

程序员文章站 2022-04-11 21:51:29
作用域分类1.全局作用域2.函数作用域3.块级作用域(es6新增) 什么是全局作用域? 1.最外层的变量、函数2.未定义直接赋值的变量(不建议这么做!严格模式会报错!)没啥好说的~ 什么是函数作...

作用域分类1.全局作用域2.函数作用域3.块级作用域(es6新增)

什么是全局作用域?

1.最外层的变量、函数2.未定义直接赋值的变量(不建议这么做!严格模式会报错!)没啥好说的~

什么是函数作用域?

1.函数内部代码块,能够嵌套注意点:javascript中的函数运行在它们被定义的作用域里,而不是它们被执行的作用域里下面是代码亲测:

关于JS作用域的简单理解

输出结果:① 'global'解析:echo函数在全局作用域定义(name=‘global'),调用处在env函数作用域内(name='env'),结果为'global',可以看出,函数运行时的作用域为定义时的作用域。②③ 'env'解析:两处调用的是同一个函数(都是innerenv,定义处name=‘env’),但是它们调用处的作用域不一样,②处name='env',③处name='global',而调用结果都为'env',再次说明,函数运行时的作用域为定义时的作用域。

什么是块级作用域?

1.let、const定义的变量

// 代码展示
{
  var a = 'var';
  let b = 'let';
  const c = 'const';
}

console.log(a);
// console.log(b); // 报错,b is not defined
// console.log(c); // 报错,c is not defined
块级作用域小技巧
for (var i = 0; i < 5; i++) {
  settimeout(function () {
    console.log(i);
  }, 100);
}

上面这段代码本意是输出:0 1 2 3 4,结果输出:5 5 5 5 5,批量绑定dom事件时很常见(当然,用事件委托可能更好)

没有块级作用域之前,使用自执行函数解决:

for (var i = 0; i < 5; i++) {
  (function (i) {
    settimeout(function () {
      console.log(i);
    }, 100);
  })(i);
}

有了块级作用域之后,是这样的:

for (let i = 0; i < 5; i++) {
  settimeout(function () {
    console.log(i);
  }, 100);
}

非常简洁~