八股(自己整理版)ES6篇1

4 阅读2分钟

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}`}