小编本身是前端出身,最近在做项目的时候,有一些前端功能实现起来越来越吃力,特别是在面对VUE的时候,一些新语法根本不认识。于是乎,就准备利用还有的一点空闲时间,认真学习一下JavaScript中的一些新特性,接下来小编将陆续更新文章,希望能从我的文章中有一些属于自己收获。大家也可以关注我的微信公众号,蜗牛全栈。
每一门语言都有自己变量声明,之前版本的js已经有变量声明的关键字var了,为什么还要更新,添加新关键字和特性呢?
关键字let
1、含义不同
var a = 5
console.log(a) // 变量
b = 6
console.log(b); // window下的属性
2、是否可以重复声明
// var 可以重复声明变量,后声明的替换先声明的值
var a = 5
var a = 6
console.log(a) // 6
// let 不允许重复声明变量,重复声明变量会报错
let a = 5
let a = 6
console.log(a) // 报错:Identifier 'a' has already been declared
3、块级作用域
for(var i=0;i<3;i++){
console.log(i,"---循环内"); // 0 1 2
}
console.log(i,"---循环外"); // 3
for(let i=0;i<3;i++){
console.log(i,"---循环内"); // 0 1 2
}
console.log(i,"---循环外"); // 报错:i is not defined
if(false){
var a = 5
}
console.log(a); // undefind
if(false){
let a = 5
}
console.log(a); //报错:a is not defined
4、if后只有一行语句的时候
if(true) var a = 6
if(true) let a = 6 // 报错
5、同步和异步
for(var i=0;i<3;i++){
setTimeout(function(){ // 异步操作
console.log(i) // 3 3 3
})
}
for(let i=0;i<3;i++){
setTimeout(function(){ // 异步操作
console.log(i) // 0 1 2
})
}
关键字const
1、基本数据类型声明之后不可改变(es5中基本数据类型有五种:string、number、null undefind、bool)
const a = 5
a = 6 //报错:Error: "a" is read-only
2、基本数据类型和引用数据类型存储关系
注:在es5中引用数据类型主要有Array和Object
const obj = {
name:"lilei",
age:34
}
console.log(obj) // {name: "lilei", age: 34}
obj.school = "imooc"
console.log(obj) //{name: "lilei", age: 34, school: "imooc"}
// 引用数据中的内存地址没变,只是在堆内存中内容产生变化
// 如果不希望对象内容变化,可采用Object.freeze()函数
const obj = {
name:"lilei",
age:34,
skill:{
name:"code",
year:12
}
}
Object.freeze(obj) // 冻结对象
console.log(obj) // {name: "lilei", age: 34}
obj.school = "imooc"
console.log(obj) // {name: "lilei", age: 34}
obj.skill.name = "skate" // {name:"lilei",age:34,skill:{name:"code",year:12}}
Object.freeze(obj,obj.skill) // 嵌套属性也需要冻结的时候,需要手动添加
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。