了解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 相关文章推荐
让innerHTML的脚本也可以运行起来
Jul 01 Javascript
javascript据option的value值快速设定初始的selected选项
Aug 13 Javascript
使用jQuery清空file文件域的解决方案
Apr 12 Javascript
js重写alert控件(适合学习js的新手朋友)
Aug 24 Javascript
推荐一个自己用的封装好的javascript插件
Jan 29 Javascript
Javascript中使用parseInt函数需要注意的问题
Apr 02 Javascript
基于jQuery实现页面搜索功能
Mar 26 Javascript
AngularJS中指令的四种基本形式实例分析
Nov 22 Javascript
Bootstrap 3 按钮标签实例代码
Feb 21 Javascript
动态创建Angular组件实现popup弹窗功能
Sep 15 Javascript
vue 全选与反选的实现方法(无Bug 新手看过来)
Feb 09 Javascript
VUE 3D轮播图封装实现方法
Jul 03 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项目的方法
2006/10/09 PHP
PHP7 mongoDB扩展使用的方法分享
2019/05/02 PHP
关于Javascript模块化和命名空间管理的问题说明
2010/12/06 Javascript
javascript事件冒泡详解和捕获、阻止方法
2014/04/12 Javascript
javascript如何使用bind指定接收者
2014/05/04 Javascript
js实现跨域的方法实例详解
2015/06/24 Javascript
JS实现的自定义右键菜单实例二则
2015/09/01 Javascript
完美实现js选项卡切换效果(二)
2017/03/08 Javascript
vue2.0结合DataTable插件实现表格动态刷新的方法详解
2017/03/17 Javascript
详解Vue2.0里过滤器容易踩到的坑
2017/06/01 Javascript
vue-router实现tab标签页(单页面)详解
2017/10/17 Javascript
Express系列之multer上传的使用
2017/10/27 Javascript
react-router browserHistory刷新页面404问题解决方法
2017/12/29 Javascript
学习JS中的DOM节点以及操作
2018/04/30 Javascript
基于vue如何发布一个npm包的方法步骤
2019/05/15 Javascript
微信小程序实现消息框弹出动画
2020/04/18 Javascript
nodejs文件夹深层复制功能
2019/09/03 NodeJs
JavaScript实现单图片上传并预览功能
2019/09/30 Javascript
微信小程序如何实现精确的日期时间选择器
2020/01/21 Javascript
解决VUE 在IE下出现ReferenceError: Promise未定义的问题
2020/11/07 Javascript
vue祖孙组件之间的数据传递案例
2020/12/07 Vue.js
解读Python中degrees()方法的使用
2015/05/18 Python
sublime text 3配置使用python操作方法
2017/06/11 Python
在PyCharm中三步完成PyPy解释器的配置的方法
2018/10/29 Python
Python print不能立即打印的解决方式
2020/02/19 Python
解决jupyter notebook显示不全出现框框或者乱码问题
2020/04/09 Python
python查找特定名称文件并按序号、文件名分行打印输出的方法
2020/04/24 Python
python 5个顶级异步框架推荐
2020/09/09 Python
高二历史教学反思
2014/01/25 职场文书
优秀教师的感人事迹
2014/02/04 职场文书
党员干部2014全国两会学习心得体会
2014/03/10 职场文书
2015年市场部工作总结
2015/04/30 职场文书
预备党员群众意见
2015/06/01 职场文书
2015秋季幼儿园开学通知
2015/07/16 职场文书
JS一分钟在github+Jekyll的博客中添加访问量功能的实现
2021/04/03 Javascript
Python实现信息管理系统
2022/06/05 Python