JavaScript 作用域

作用域的作用主要是保证我们声明的变量在指定的区域内其效果,并且不会发生被随意修改的情况发生。

全局作用域

全局作用域主要是脚本模式下运行时才会起效。并且全局变量要放在引入的第一个 JS 文件中。具体是如下:

<script src="global.js"></script>
<script src="demoFunction.js"></script>
// glob.js
const global = "全局变量";

// demoFunction.js
console.log(global);

function fn1() {
  console.log(global1); // 函数内部调用全局变量
}
fun1();

全局变量在使用的时候需要注意代码的全局污染,因为当删除全局的变量后,引用了全局变量的 JS 文件就会产生错误,这样就会导致系统的异常,所以我们在使用全局作用域的时候需要做一个全局考虑。

模块作用域

模块作用域主要是使用 export 来导出的变量,只有在引入模块后才能使用其变量。具体实例如下:

// modelFunction.js
const modelInVal = "模块内部变量";
export const modelOutVal = "模块对外暴露的变量";

// runFunction.js
import { modelOutVal } from "./modelFunction.js";
console.log("modelOutVal");

函数作用域

函数作用域主要是变量声明在函数内部或者表达式内。具体实例如下:

const v1 = 1;

function run() {
  const v2 = 2;

  console.log(v1);
  console.log(v2);

  if (true) {
    const v3 = 3;

    console.log(v1);
    console.log(v2);
    console.log(v3);
  }

  console.log(v1);
  console.log(v2);
  console.log(v3); // 报错,因v3变量是在if表达式中声明的,作用域只在if块中使用
}

run();
console.log(v1);
console.log(v2); // 报错,因v2是在run函数内部声明的变量,作用域只在run函数累不使用

需要注意的是 cost 和 let 声明的变量锁级作用域,即在函数内部和表达式内部声明了就不会在提升作用域,而 var 则是会提升作用域。具体实例如下:

const v1 = 1;

function run() {
  const v2 = 2; // 假如这里改为var来声明变量的话,run函数外部引用此变量还是会发生错误

  console.log(v1);
  console.log(v2);

  if (true) {
    var v3 = 3;

    console.log(v1);
    console.log(v2);
    console.log(v3);
  }

  console.log(v1);
  console.log(v2);
  console.log(v3); // v3使用var声明了以后作用域提升到run函数中,所以这里引用变量不会出错
}

块作用域

块作用域其实就是使用 const 和 let 声明的变量,因为 const 和 let 是锁级作用域。例如在函数作用域演示的例子中我们可以看到使用 const 声明的变量只在块中起效。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值