1.变量提升
指var声明的变量在编译阶段会被提升到当前作用域的顶部
只提升声明,不提升赋值
而函数声明会被完整提升到作用域顶部,包括函数体
let和const可以解决变量提升导致的混乱
声明的变量不会提升,会创建暂时性死区
从变量声明的块作用域开始,到该变量被赋值之前的区域,访问该变量会抛出错误
2.箭头函数
箭头函数更简洁 ()=>{ }
箭头函数没有自己的this 在自己作用域的上一层继承this
继承来的this指向不会改变
不可以作为构造函数使用
没有自己的arguments
3.扩展运算符
①对象
如果用户自定义的属性放在扩展运算符后面,扩展运算符内部的同名属性会被覆盖掉
let bar={a:1,b:2}
let baz={...bar,...{a:2,b:4}} //{a:2,b:4}
扩展运算符对对象实例的拷贝属于浅拷贝
②数组
可以将一个数组转为用逗号分隔的参数序列,
且每次只能展开一层数组
扩展运算符被用在函数形参上时,可以把一个分离的参数序列整合成一个数组
function mutiple(...arg){}
mutiple(1,2,3,4); //arg:[1,2,3,4]
4.数据解构
提取数据的方式,以元素的位置为匹配条件来获得想要的数据
①数组的解构
const [a,b,c]=[1,2,3];
可以设置空占位如:
const [a,,c]=[1,2,3];
②对象的解构
以属性名称为匹配条件
const stu={
name:
age:
}
const {name,age}=stu;
提取高度嵌套的对象里的指定属性:
const { classes : { stu : { name } } } = school
5.模板语法
允许用${}的方式嵌入变量
在模板字符串中,空格、换行、缩进都会被保留
支持运算式的表达式,可以在${}里完成一些计算
var name='css'
var hobby=['coding','writing']
var finalString=`my name is ${name},I love ${hobby[0]} and ${hobby[1]} `
function add(a,b){
const finalString=`${a} +${b} = ${a+b}`}
6.var let const
三者的区别:
①作用域不同
var作用域是函数级 在函数外声明则为全局变量
let const作用域是块级,仅在声明它的代码块内有效(如if for {}等)
②变量提升和重复声明
var存在变量提升,变量声明被提升到作用域的顶部,赋值不会
可能导致未声明先使用时出现undefined
允许重复声明,后声明的会覆盖前一个
let和const不存在变量提升,必须先声明后使用否则报错
不允许重复声明
③可修改性
const声明的是常量,必须在声明时赋值,且赋值后不能重新赋值
var为什么会存在变量提升:
本质上是js引擎编译阶段处理变量声明的机制导致的
js先编译后执行
先对代码进行词法分析语法分析生成执行上下文,此时var声明的变量被提升
执行阶段再逐行执行代码,处理赋值运算等逻辑
变量提升的好处/坏处:
好处:
简化了早期的开发门槛
函数可以在声明前调用
坏处:
变量覆盖和重复声明隐患
作用域混淆
可读性下降