首页 > 其他分享 >"let" 和 "var" 的区别是什么?

"let" 和 "var" 的区别是什么?

时间:2023-10-08 21:13:38浏览次数:35  
标签:console log 区别 作用域 let var foo

内容来自 DOC[ https://q.houxu6.top/?s="let" 和 "var" 的区别是什么?](https://q.houxu6.top/?s="let" 和 "var" 的区别是什么?)

ECMAScript 6引入了let语句

我听说它被描述为一个局部变量,但我仍然不太清楚它与var关键字的行为有什么不同。

它们之间的区别是什么?什么时候应该使用let代替var


作用域规则

主要区别在于作用域规则。var关键字声明的变量作用域为函数体(因此为函数作用域),而let变量作用域为由{ }表示的立即包围块(因此为块作用域)。

function run() {
  var foo = "Foo";
  let bar = "Bar";

  console.log(foo, bar); // Foo Bar

  {
    var moo = "Mooo"
    let baz = "Bazz";
    console.log(moo, baz); // Mooo Bazz
  }

  console.log(moo); // Mooo
  console.log(baz); // ReferenceError
}

run();

let关键字被引入语言的原因是函数作用域令人困惑,并且是JavaScript中的主要错误来源之一。

看看这个来自Stack Overflow另一个问题的示例:

var funcs = [];
// 让我们创建3个函数
for (var i = 0; i < 3; i++) {
  // 并将它们存储在funcs中
  funcs[i] = function() {
    // 每个都应该记录其值。
    console.log("My value: " + i);
  };
}
for (var j = 0; j < 3; j++) {
  // 现在让我们运行每个函数以查看
  funcs[j]();
}

每次调用funcs[j]();时,My value: 3都会被输出到控制台,因为匿名函数绑定到了相同的变量。

人们不得不创建立即调用的函数来捕获循环中的正确值,但这也很棘手。

提升

虽然使用var关键字声明的变量会被提升(在代码运行之前用undefined初始化),这意味着它们在包围范围内可访问,直到它们的定义被评估:

function run() {
  console.log(foo); // undefined
  var foo = "Foo";
  console.log(foo); // Foo
}

run();

let变量在初始化之前不会被初始化,直到它们的定义被评估。在初始化处理之前访问它们会导致ReferenceError。该变量从块的开始处被称为“临时死区”。

function checkHoisting() {
  console.log(foo); // ReferenceError
  let foo = "Foo";
  console.log(foo); // Foo
}

checkHoisting();

创建全局对象属性

在顶层,与var不同,let不会在全局对象上创建属性:

var foo = "Foo";  // 全局作用域
let bar = "Bar"; // 不允许全局作用域

console.log(window.foo); // Foo
console.log(window.bar); // undefined

重新声明

在严格模式下,var将允许您在同一作用域中重新声明相同的变量,而let会引发语法错误。

'use strict';
var foo = "foo1";
var foo = "foo2"; // 没有问题,'foo1'被替换为'foo2'。

let bar = "bar1"; 
let bar = "bar2"; // 语法错误:标识符'bar'已经被声明过了

标签:console,log,区别,作用域,let,var,foo
From: https://www.cnblogs.com/xiaomandujia/p/17750142.html

相关文章

  • The Virtual KVM Client applet is not running or not initialized properiy.
    KVM TheVirtualKVMClientappletisnotrunningornotinitializedproperly. PortAccessisdisabled. PortAccessisdisabled.  ......
  • ol ul li的区别
    众所周知olulli都是列表,但具体有什么区别呢,今天就为大家讲解一下。olli为有序列表,各个列表项会按照一定顺序排列,如网页中常见的游戏排行榜,歌曲排行榜等。注意:ol标签下不能直接放内容或其它标签,即使要放都必须放入li标签内,而li标签内可以再放ulol等格式各样标签。默认示例表现为......
  • Spring MVC DispatcherServlet 解读
     在整个SpringMVC框架中,DispatcherServlet处于核心位置,它负责协调和组织不同组件完成请求处理并返回响应工作。DispatcherServlet是SpringMVC统一的入口,所有的请求都通过它。DispatcherServlet是前端控制器,配置在web.xml文件中,Servlet依自已定义的具体规则拦截匹配的......
  • SQLSugar中Includes和Mapper的区别
    在SQLSugar中,Include和Mapper确实在处理过滤器方面有一些不同的行为。Include方法:当你使用Include方法来加载关联实体时,SQLSugar会忽略过滤器,不会将过滤器应用于加载的关联实体。这意味着无论你是否定义了过滤器,使用Include方法加载的关联实体都会被加载,而不受过滤器的影响。......
  • 接入层交换机、汇聚层交换机和核心层交换机的认识与区别
    接入层交换机、汇聚层交换机和核心层交换机是交换机的分类吗?接入层交换机、汇聚层交换机、核心层交换机并非是交换机的分类和属性,它们没有固定要求,主要看网络环境的大小、设备的转发能力以及在网络结构中所处位置。例如,同一个二层交换机在不同的网络结构中,可能用在接入层,也可能用在......
  • Spring中@Autowired和@Resource的区别
    说明@Autowired这个注解呢,是由Spring提供的;@Resource由JDK提供的区别①注解内参数不同@Autowired只包含一个required参数,默认为true,表示开启自动注入@Resource包含七个参数,其中最重要的两个是name和type②装配方式默认值不同@Autowired默认按type自动装配@Resource默认按......
  • v-show 与 v-if 的区别
    v-show:1.作用:控制元素显示隐藏2.语法:v-show="表达式"  表达式值为true则显示,false则隐藏3.底层原理:切换css的display:none来控制显示隐藏4.使用场景:频繁切换显示隐藏的场景  v-if:1.作用:控制元素显示隐藏(条件渲染)2.语法:v-if="表达式"  表达式值tr......
  • 芯片的pad 和pin 有啥区别
    芯片内部晶圆的标号,而GPIO只是某些PAD拥有的功能,但是PAD和GPIO的序号却不是一一对应的PIN指芯片封装好后的管脚,即用户看到的管脚;PAD是硅片的管脚,是封装在芯片内部的,用户看不到。PAD到PIN之间还有一段导线连接的。 参考链接:SYD8811GPIO模块中PAD和GPIO的关系_padgpiopin-CSD......
  • 正向代理和反向代理的区别、应用场景及在nginx上的应用
    正向代理和反向代理是两种常见的代理服务器架构,它们在网络通信中扮演不同的角色和应用场景。1、正向代理(ForwardProxy):正向代理是一个位于客户端和目标服务器之间的代理服务器。当客户端需要访问互联网上的资源时,它首先将请求发送给正向代理服务器,然后由代理服务器代表客户端发送请......
  • OLAP与OLTP的区别
    随着企业信息化的发展,数据量越来越庞大,对于数据分析和处理提出了更高的要求。在数据仓库中,联机分析处理(OLAP)和联机事务处理(OLTP)是常见的两种处理方式。一、定义与功能1.OLAP(联机分析处理)OLAP全称为OnlineAnalyticalProcessing,它强调对大量历史数据的分析与处理。OLAP系统通常用......