前  言

JavaScript

 大家都知道声明一个变量时,通常会用'var'来声明,但是在ES6中,定义了另一个关键字'let'。今天我就为大家带来'var'与'let'这两个关键字声明有何异同。

1.1
未赋值声明

    <script type="text/javascript">
//试验代码
var a;
let b; console.log("这是var声明:"+a);
console.log("这是let声明:"+a);
</script>

结果:

  从上面的代码就可以看出,在声明变量时,不赋值情况下let和var是一样的,都显示为:undefined。

1.2重复声明一个变量

    <script type="text/javascript">
//试验代码
var a = 1;
var a = 2; console.log("这是var声明:"+a);
</script>

运行结果:

      

    <script type="text/javascript">
//试验代码
let a = 1;
let a = 2; console.log("这是var声明:"+a);
</script>
    <script type="text/javascript">
//试验代码
var a = 1;
let a = 2; console.log("这是var声明:"+a);
</script> 

运行结果:

     

  从上面的代码看出,当定义一个变量后,var和let都可以再次为定义的变量赋值。但是,使用var声明的变量,可以重复声明这个变量n次,而使用let声明的变量只能声明一次,而且,就算是var或其他的关键字声明后的变量,再使用let声明时,也会出错。

1.3函数作用域

    <script type="text/javascript">
//试验代码
var a = 1;
let b = 2;
c = 3;
!function(){
var a = 4;
let b = 5;
c = 6;
console.log("这是自执行函数var声明a:"+a);
console.log("这是自执行函数let声明b:"+b);
}(); console.log("这是var声明a:"+a);
console.log("这是let声明b:"+b);
console.log("这是全局变量c:"+c );
</script>

运行结果:

    

  从上面的代码和结果可以看出,var和let在函数作用域中的表现是一样的。函数中定义的变量只能在函数中调用,除非全局变量。

1.5块作用域

    <script type="text/javascript">
//试验代码
for(var i=0;i<5;i++){
console.log(i);
}
console.log(i);
</script>

运行结果:

    

    <script type="text/javascript">
//试验代码
for(let i=0;i<5;i++){
console.log(i);
}
console.log(i);
</script>

运行结果:

    

    <script type="text/javascript">
//试验代码
let c = 3;
console.log('函数外let定义c:' + c);
!function(){
let c = 6;
console.log('函数内let定义c:' + c);
}();
console.log('函数调用后let定义c不受函数内部定义影响:' + c);
</script>

运行结果:

    

  从上面的代码看出,在for循环中使用var声明的变量,在循环结束后可以放在循环外输出,而使用let声明的,在循环外是不能调用,提示错误。上面提到过let声明的变量,不可以重复声明,但是在let的块作用域下,let可以再次声明这个变量,但在函数声明的变量,只能在函数中使用,也就是说用let声明的两个变量,是两个不同的变量。这也是let与var最大的区别。

JS中var和let的更多相关文章

  1. js中var的有或无--重复声明和以后的声明

    js中var的有或无--重复声明和以后的声明 使用var语句多次声明一个变量不仅是合法的,而且也不会造成任何错误. 如果重复使用的一个声明有一个初始值,那么它担当的不过是一个赋值语句的角色. 如果重复 ...

  2. 浅谈JS中 var let const 变量声明

    浅谈JS中 var let const 变量声明 用var来声明变量会出现的问题: 1. 允许重复的变量声明:导致数据被覆盖 2. 变量提升:怪异的数据访问.闭包问题 3. 全局变量挂载到全局对象:全 ...

  3. 【前端开发】】js中var写和不写的区别

    js中var用与不用的区别 Javascript声明变量的时候,虽然用var关键字声明和不用关键字声明,很多时候运行并没有问题,但是这两种方式还是有区别的.可以正常运行的代码并不代表是合适的代码. v ...

  4. js中,var 修饰变量名和不修饰的区别

    js中 允许在定义变量的时候 不加var 修饰符.js会在当前作用域下寻找上下文是否定义了此变量, 如果没有找到则会为这个变量分配内存.当且将其视为window的成员. 也就是全局变量. 如果加了va ...

  5. js中var 笔记

    js中声明变量会用到Var; 1,var a;声明一个变量a,此时输出a,会显示undefined:因为此时的a未定义: 2, var a=0;和b=0;有什么区别呢? 当声明一个全局变量时,实际是定 ...

  6. js 中var that=this

    js中经常出现var that=this,为什么这么做? http://stackoverflow.com/questions/4886632/what-does-var-that-this-mean ...

  7. JS中var声明与function声明两种函数声明方式的区别

    JS中常见的两种函数声明(statement)方式有这两种: // 函数表达式(function expression) var h = function() { // h } // 函数声明(fun ...

  8. js中var

    js中声明一个变量的时候,建议要加上var.如果不加,除非你知道自己在干什么,否则哪天会吃亏哈哈. 不加var,js会认为你声明的是全局变量. 举个小例子. function test1(){ a = ...

  9. JS中var声明与function声明以及构造函数声明方式的区别

    JS中常见的三种函数声明(statement)方式有这三种: // 函数表达式(function expression) var h = function () { // h } // 函数声明(fu ...

  10. 深度理解js中var let const 区别

    首先要理解js中作用域的概念 作用域:指的是一个变量的作用范围 1.全局作用域 直接写在script中的js代码,在js中,万物皆对象,都在全局作用域,全局作用域在页面打开时创建,在全局作用域中有一个 ...

随机推荐

  1. 最近见到的JS返回函数的一些题

    JS返回值题一直都是考察重点,面试和笔试之中也经常涉及到,说一说我最近遇到的一些有意思的JS返回函数问题. 之前见到过一道有意思的问题,说有一个sum函数,用户可以通过sum(2,3)来取到2+3 = ...

  2. 前端开发【第4篇:JavaScript基础】

    JavaScript简述 上一篇文章已经聊过JavaScript的历史了这里不再复述了直接切入正题,JavaScript是一门解释型.动态类型.弱类型语言. 解释型语言和编译型语言就类似看一本书,编译 ...

  3. Maven(二)Maven项目的创建(命令、myeclipse)及生命周期

    上一篇给大家介绍了Maven的概念和仓库的一些信息,接下来给大家分享一下使用命令和MyEclipse创建Maven项目 一.使用命令管理Maven项目 1.1.创建Maven java项目 1)创建一 ...

  4. Maven(四)之Maven在IntelliJ IDEA的配置与使用

    前面介绍了Maven的一些基本知识,这一篇讲一下在IntelliJ IDEA配置和使用Maven 一.配置Maven 在File->Settings->Build,Execution,De ...

  5. python--用户登录验证

    目标要求: 1.最多输入3次用户名密码, 2.如果是被锁用户,则一次即退出程序, 3.如果输入正确的用户名密码,则提示登陆成功,程序结束, 4.3次输入不对,会将用户写入被锁用户列表,当然,该用户名需 ...

  6. 结对编程1-四则运算(基于GUI)

    林晓芳201421123092.陈惠201421123096 coding 地址:https://git.coding.net/lianlian/92.96.1.git 一.题目描述 我们在个人作业1 ...

  7. GUI(国际象棋棋盘)

    package com.niit.javagui; import java.awt.BorderLayout; import java.awt.Color; import java.awt.GridB ...

  8. 【Alpha】Daily Scrum Meeting——Day6

    站立式会议照片 1.本次会议为第五次Meeting会议: 2.本次会议在上午大课间09:40,在禹州楼召开,本次会议为30分钟讨论昨天的任务完成情况以及接下来的任务安排. 燃尽图 每个人的工作分配 成 ...

  9. 团队作业4---第一次项目冲刺(ALpha版本)第一天

    一.Daily Scrum Meeting照片 二.燃尽图 三.项目进展 1.界面 完成登录界面 2.功能 完成数据结构设计及数据交互模块代码 完成爬虫博客页面数据采集模块 四.困难与问题 1.因为要 ...

  10. 201521123112《Java程序设计》第7周学习总结

    1. 本周学习总结 2. 书面作业 1.ArrayList代码分析 1.1 解释ArrayList的contains源代码 下面先贴出contains的源代码: public boolean cont ...