let是es6中新增命令,也是用来声明变量的,可能很多小伙伴都像我一样,定义变量的时候都会用var而很少用到let,那么,let和var到底有什么区别呢?

let和var的区别体现在作用域上。var的作用域被规定为一个函数作用域,而let则被规定为块作用域,块作用域要比函数作用域小一些,但是如果两者既没在函数中,也没在块作用域中定义,那么两者都属于全局作用域。

全局作用域

var 和 let 声明的变量在全局作用域中被定义时,两者非常相似

let bar = 'hehe';
var baz = 'lala';

但是,被let声明的变量不会作为全局对象window的属性,而被var声明的变量却可以

console.log(window.bar);  //undefined
console.log(window.baz); // 'able'
函数作用域

var 和 let 在函数作用域中声明一个变量,两个变量的意义是相同的。

function  aFun(){
let bar = 'hehe'; // 函数作用域中的变量
var baz = 'lala'; // 函数作用域中的变量
}
块作用域

在块作用域中两者的区别较为明显, let只在for()循环中可用,而 var是对于包围for循环的整个函数可用

function  aFun1(){
// i 对于for循环外的范围是不可见的(i is not defined)
for(let i = 1; i<5; i++){
// i只有在这里是可见的
}
// i 对于for循环外的范围是不可见的(i is not defined)
}
function aFun2(){
// i 对于for循环外的范围是可见的
for(var i = 1;i<5; i++){
// i 在for 在整个函数体内都是可见的
}
// i 对于for循环外的范围是可见的
}
let 和var 重新声明

var允许在同一作用域中声明同名的变量,而let不可以

let me  = 'foo';
let me = 'bar'; //SyntaxError: Identifier 'me' has already been declared var me = 'foo';
var me = 'bar'; //这里me被替代了,是可以重复声明的

es6中还有一个声明变量的命令const,const和let都是在声明的块作用域中有效,但是let声明的变量可变,值和类型都可以改变,没有限制。const声明额变量不能改变,所以,const一旦声明一个变量,就必须马上初始化,不能留到以后赋值

const hehe; //报错,Missing initializer in const declaration

const a = 3;
a = 5; //报错,Uncaught TypeError: Assignment to constant variable.

以上就是let和var在不同作用域下的区别

那么在什么情况下要用到let呢?

let 在块作用域中有效,有的时候,我们为了降低变量污染的风险,在块作用域中使用let来代替var,这样不会污染块作用域的外部作用域,降低 bug率,使代码更安全。

作者:程序媛萌小雪Mxx
链接:https://www.jianshu.com/p/9f7f053f7204
来源:简书
简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。

javascript中let和var的区别的更多相关文章

  1. 认识JavaScript中Let和Var的区别

    本文转载自:https://www.cnblogs.com/songzxblog/p/11137117.html

  2. JavaScript中const、var和let区别浅析

    在JavaScript中有三种声明变量的方式:var.let.const.下文给大家介绍js中三种定义变量的方式const, var, let的区别. 1.const定义的变量不可以修改,而且必须初始 ...

  3. JavaScript中:表达式和语句的区别

    JavaScript中:表达式和语句的区别 Javascript语言精粹:表达式是由运算符构成,并运算产生结果的语法结构.程序是由语句构成,语句则是由“:(分号)”分隔的句子或命令.如果在表达式后面加 ...

  4. Javascript中setTimeout和setInterval的区别和使用

    在javascript中,window对象有两个主要的定时方法,分别是setTimeout 和 setInterval,其语法基本上相同,但是完成的功能取有区别. setTimeout方法是定时程序, ...

  5. JavaScript 中 Property 和 Attribute 的区别详解

    property 和 attribute非常容易混淆,两个单词的中文翻译也都非常相近(property:属性,attribute:特性),但实际上,二者是不同的东西,属于不同的范畴. property ...

  6. javascript中typeof与instanceof的区别

    JavaScript 中 typeof 和 instanceof 常用来判断一个变量是否为空,或者是什么类型的.但它们之间还是有区别的: typeof typeof 是一个一元运算,放在一个运算数之前 ...

  7. javascript中基本类型和引用类型的区别分析

    大多数人系统学习过的程序设计语言,在这些语言的学习过程中最早学到的几个要点之一就是值类型和引用类型的区别.下面我们来看一下在 JavaScript 中基本数据类型(Primitive Types)和引 ...

  8. JS中let和var的区别

    js中let和var定义变量的区别   let变量之前没见过,刚遇到,探探究竟. 以下转自:http://blog.csdn.net/nfer_zhuang/article/details/48781 ...

  9. JavaScript 中表达式和语句的区别

    1.语句和表达式 JavaScript中的表达式和语句是有区别的.一个表达式会产生一个值,它可以放在任何需要一个值的地方,比如,作为一个函数调用的参数.下面的每行代码都是一个表达式: myvar3 + ...

随机推荐

  1. virsh命令和虚拟机克隆

    virsh 命令 virsh list  //列出正在运行虚拟机 virsh list --all     //列出所有虚拟机 virsh  console sunhao-1  //进入名字为sunh ...

  2. noj二分查找

    二分查找: 要么左边,要么右边,哈哈哈哈 描述 给定一个单调递增的整数序列,问某个整数是否在序列中.   输入 第一行为一个整数n,表示序列中整数的个数:第二行为n(n不超过10000)个整数:第三行 ...

  3. phpMyAdmin 尝试连接到 MySQL 服务器,但服务器拒绝连接 解决办法

    phpMyAdmin 尝试连接到 MySQL 服务器,但服务器拒绝连接.您应该检查配置文件中的主机.用户名和密码,并确认这些信息与 MySQL 服务器管理员所给出的信息一致. 原因有可能是因为修改了m ...

  4. 产品经理面试题——浅谈O2O

    分析:O2O也要分种类.      现在的O2O 已经是线上线下相互融合的阶段了,无论是线上体验,线下消费还是线下体验,线上下单.都已有比较成熟的模式.我对O2O的理解就是以消费者为中心,整合线上和线 ...

  5. Unable to resolve module crypto

    Add rn-nodeify to your devDependencies in package.json: "devDependencies": { "rn-node ...

  6. echarts移除百度地图logo方法

    移除百度地图LOGO和版权信息 在jsp头上加上如下代码即可: <style type="text/css"> .anchorBL{ display:none } &l ...

  7. spring jpa 动态查询(Specification)

    //dao层 继承 扩展仓库接口JpaSpecificationExecutor (JPA 2引入了一个标准的API)public interface CreditsEventDao extends ...

  8. top命令详解---待完善

    Top可以看到的cpu信息有: Tasks: 29 total, 1 running, 28 sleeping, 0 stopped, 0 zombie Cpu(s): 0.3% us, 1.0% s ...

  9. Netty权威指南(笔记一)

    转载:http://blog.csdn.net/clarkkentyang/article/details/52529785 第一章(略) 第二章 NIO入门 2.1传统的BIO编程(同步阻塞I/O服 ...

  10. RabbitMQ 死信队列 延时

    package com.hs.services.config; import java.util.HashMap; import java.util.Map; import org.springfra ...