了解javascript中let和var及const关键字的区别


Posted in Javascript onMay 24, 2019

1.声明后未赋值,表现相同

//一个例子
'use strict';

(function() {
 var varTest;
 let letTest;
 console.log(varTest); //输出undefined
 console.log(letTest); //输出undefined
}());

2.使用未声明的变量,表现不同

//一个例子
(function() {
 console.log(varTest); //输出undefined(注意要注释掉下面一行才能运行)
 console.log(letTest); //直接报错:ReferenceError: letTest is not defined

 var varTest = 'test var OK.';
 let letTest = 'test let OK.';
}());

3.重复声明同一个变量时,表现不同

//一个例子
'use strict';
(function() {
 var varTest = 'test var OK.';
 let letTest = 'test let OK.';
var varTest = 'varTest changed.';
 let letTest = 'letTest changed.'; //直接报错:SyntaxError: Identifier 'letTest' has already been declared
 console.log(varTest); //输出varTest changed.(注意要注释掉上面letTest变量的重复声明才能运行)
 console.log(letTest);
}());

4.变量作用范围,表现不同

//一个例子
'use strict';
(function() {
 var varTest = 'test var OK.';
 let letTest = 'test let OK.';
 {
 var varTest = 'varTest changed.';
 let letTest = 'letTest changed.';
 }
 console.log(varTest); //输出"varTest changed.",内部"{}"中声明的varTest变量覆盖外部的letTest声明
 console.log(letTest); //输出"test let OK.",内部"{}"中声明的letTest和外部的letTest不是同一个变量
}());

5.const定义的变量不可以修改,而且必须初始化

//一个例子
const b = 2;//正确
// const b;//错误,必须初始化 
console.log('函数外const定义b:' + b);//有输出值
// b = 5;
// console.log('函数外修改const定义b:' + b);//无法输出

6.var定义的变量可以修改,如果不初始化会输出undefined,不会报错

var a = 1;
// var a;//不会报错
console.log('函数外var定义a:' + a);//可以输出a=1
function change(){
a = 4;
console.log('函数内var定义a:' + a);//可以输出a=4
} 
change();
console.log('函数调用后var定义a为函数内部修改值:' + a);//可以输出a=4

7.let是块级作用域,函数内部使用let定义后,对函数外部无影响

let c = 3;
console.log('函数外let定义c:' + c);//输出c=3
function change(){
let c = 6;
console.log('函数内let定义c:' + c);//输出c=6
} 
change();
console.log('函数调用后let定义c不受函数内部定义影响:' + c);//输出c=3

学习到此结束!

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Js 获取当前日期时间及其它操作实现代码
Mar 04 Javascript
Jquery跨域获得Json时invalid label错误的解决办法
Jan 11 Javascript
Knockoutjs的环境搭建教程
Nov 26 Javascript
javascript HTML5 canvas实现打砖块游戏
Jun 18 Javascript
从0开始学Vue
Oct 27 Javascript
jQuery实现字符串全部替换的方法【推荐】
Mar 09 Javascript
Webpack打包慢问题的完美解决方法
Mar 16 Javascript
Angularjs为ng-click事件传递参数
Jun 15 Javascript
vue Render中slots的使用的实例代码
Jul 19 Javascript
bing Map 在vue项目中的使用详解
Apr 09 Javascript
React 路由懒加载的几种实现方案
Oct 23 Javascript
微信小程序实现传递多个参数与事件处理
Aug 12 Javascript
如何用原生js写一个弹窗消息提醒插件
May 24 #Javascript
小程序登录/注册页面设计的实现代码
May 24 #Javascript
微信小程序+云开发实现欢迎登录注册
May 24 #Javascript
30分钟用Node.js构建一个API服务器的步骤详解
May 24 #Javascript
Electron-vue开发的客户端支付收款工具的实现
May 24 #Javascript
JS实现判断数组是否包含某个元素示例
May 24 #Javascript
JS实现查找数组中对象的属性值是否存在示例
May 24 #Javascript
You might like
PHP foreach循环使用详解与实例代码
2010/05/08 PHP
PHP 并发场景的几种解决方案
2019/06/14 PHP
PHP7原生MySQL数据库操作实现代码
2020/07/03 PHP
javascript判断单选框或复选框是否选中方法集锦
2007/04/04 Javascript
Tab页界面,用jQuery及Ajax技术实现
2009/09/21 Javascript
javascript是怎么继承的介绍
2012/01/05 Javascript
ExtJs默认的字体大小改变的几种方法(自己整理)
2013/04/18 Javascript
JavaScript中Number.MAX_VALUE属性的使用方法
2015/06/04 Javascript
jquery实现通用的内容渐显Tab选项卡效果
2015/09/07 Javascript
关于微信jssdk实现多图片上传的一点心得分享
2016/12/13 Javascript
JavaScript面向对象的程序设计(犯迷糊的小羊)
2018/05/27 Javascript
详解vue在项目中使用百度地图
2019/03/26 Javascript
Vue Echarts实现可视化世界地图代码实例
2019/05/07 Javascript
Moment.js实现多个同时倒计时
2019/08/26 Javascript
[01:02:38]DOTA2-DPC中国联赛定级赛 LBZS vs Phoenix BO3第二场 1月10日
2021/03/11 DOTA
Python运行的17个时新手常见错误小结
2012/08/07 Python
python使用装饰器和线程限制函数执行时间的方法
2015/04/18 Python
Python 专题二 条件语句和循环语句的基础知识
2017/03/19 Python
Pyspider中给爬虫伪造随机请求头的实例
2018/05/07 Python
在cmd中运行.py文件: python的操作步骤
2018/05/12 Python
python正则表达式匹配IP代码实例
2019/12/28 Python
解决python gdal投影坐标系转换的问题
2020/01/17 Python
python unichr函数知识点总结
2020/12/16 Python
美国眼镜网:GlassesUSA
2017/09/07 全球购物
英国最大的自有市场,比亚马逊便宜:Flubit
2019/03/19 全球购物
什么是数组名
2012/05/10 面试题
某公司C#程序员面试题笔试题
2014/05/26 面试题
应届大学生的推荐信
2013/11/20 职场文书
毕业生自我鉴定实例
2014/01/21 职场文书
银行类自荐信
2014/02/04 职场文书
《青海高原一株柳》教学反思
2014/04/25 职场文书
读书活动总结
2014/04/28 职场文书
环境监测与治理技术专业求职信
2014/07/06 职场文书
2015年出纳年终工作总结
2015/05/14 职场文书
公司考勤管理制度
2015/08/04 职场文书
青少年法制教育心得体会
2016/01/14 职场文书