ES6-let,const解析
时间:2022-07-25
本文章向大家介绍ES6-let,const解析,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
ES6-let,const解析
我们先看看ES5中var变量的缺点
- var会使变量提升(即下面声明的上面也可以使用)
console.log(a);
var a = 10;
- 变量可重复定义,也不会报错
var a = 10;
var a = 20;
- var声明的变量会挂载到window上,会使window上的方法失效
var name = 20;
console.log(window.name);
- 方法内的变量未经声明立即使用,也会挂载到window上
function print(){
a = 30;
}
ES6-let 解析
- let的优点 1.没有变量提升(即变量必须声明了才能使用)
console.log(a);//这里会报错,显示a未定义
let a = 20;
- 不能重复定义(重复声明会报错)
let a = 20;
let a = 30;//a is already delcare!
- 不会挂载到window上(不会影响到window上的方法)
let name = 20;
console.log(window.name);//undefined;
- 可以解决闭包的问题
此处形成了闭包,所以导致function拿到的i是同一个,所以每次打印的都是10
var arr = [];
for(var i = 0; i < 10; i++){
arr.push(function(){
console.log(i);
})
}
arr[1]();//10
arr[2]();//10
解决方案:将var的变量i换成let声明的变量i
var arr = [];
for(let i = 0; i < 10; i++){
arr.push(function(){
console.log(i);
})
}
arr[1]();//1
arr[2]();//2
- let的缺点
- 会导致临时死区(即外面声明了变量a,里面也声明了变量a,{}里面的a会使外面的a失效,此处的{}可以是函数{}即作用域)
let a = 10;
{
console.log(a);
let a = 20;
}
ES6-const解析
- const的用处:
- 定义常量,如果定义的常量被修改会报错此处指的会报错是常量未原始值
const A = 20;
A = 30;
1.如果定义的是引用值,则可以修改
let obj = {
name: 'zhangsan'
}
const Role = obj;
Role.name = "lisi";
- const的其他特点和let相同,即不会变量提升,不会挂载到window, 不能重复声明,缺点也相同,也会造成临时死区
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- php+layui数据表格实现数据分页渲染代码
- thinkPHP框架乐观锁和悲观锁实例分析
- PHP+fiddler抓包采集微信文章阅读数点赞数的思路详解
- laravel框架数据库操作、查询构建器、Eloquent ORM操作实例分析
- Laravel框架实现即点即改功能的方法分析
- PHP使用PDO实现mysql防注入功能详解
- laravel接管Dingo-api和默认的错误处理方式
- PHP接入微信H5支付的方法示例
- PHP中用Trait封装单例模式的实现
- laravel 解决Validator使用中出现的问题
- php文件上传原理与实现方法详解
- PHP常见的序列化与反序列化操作实例分析
- Laravel jwt 多表(多用户端)验证隔离的实现
- Laravel实现通过blade模板引擎渲染视图
- Laravel 验证码认证学习记录小结