一,const/let/var
let var const function import class 声明变量
优先使用const(变量),性能好,安全,其次const(常量),最好不用var
const声明的是常量:无法修改,但是声明的常量是引用数据类型,该数据内部数据可以修改,只是不能重新赋值
let声明的是变量
const和let声明的变量没有副作用,他们声明的数据没有变量提升
使用let和const声明变量可能会出现暂时性死区,
暂时性死区:在函数作用域或块级作用域里在使用let或者const声明变量之前是无法使用该变量
let msg3 = "hello world"
function fn() {
console.log(msg3);
let msg3 = "你好世界"
}
fn()
报错 如果外边声明了一个变量,函数里边先打印这个变量,下边又声明一个一样的变量,他不会使用函数外边的变量,也不会使用他下边的变量,如果要正确结果,可以吧函数里边的变量放在log之前
使用var可以重复声明变量,使用const和let不能重复声明变量
let和const声明的数据在当前作用域有效,拥有块级作用域,块级作用域以花括号为标识
const一旦声明必须初始化,初始化后不能修改,所以const声明的是常量
二,变量的结构赋值
数组的结构赋值:按照数组的索引顺序解构赋值
对象的解构赋值:按照对象的属性名进行解构赋值,如果要对解构出来的数据取一个别名来避免命名冲突的问题,可以在解构出来的变量后面加上:新的名字
字符串的解构赋值:字符串是一种类数组的数据形式,所有他的解构和数组一样
函数参数的解构赋值:可以当作把数组,对象的解构赋值应用在函数当中了
三,字符串的扩展
模板字符串,模板引擎:就是在js中写html代码更方便
四,字符串的新增方法
includes:是否包含某字符串,返回布尔值
五,数字的扩展
bigint:面试会问
六,函数的扩展
函数参数的默认值
rest参数(剩余参数),解决了argument不方便的问题
箭头函数:很大程度上解决了this指向的问题
七,数组的扩展
扩展运算符(...),很重要!!!!!!!
findindex方法,includes方法,at方法 arr[arr.length - 1]=>arr.at-1
数组的空位 const [ , ,a]=[1,2,3,4,5]
八,对象的扩展
属性的简写 对象的属性名和属性值如果是一样的可以用简写的方式
属性名表达式,对象的属性名可以使用表达式
什么是表达式:能够返回一个结果的代码块就是表达式
数学运算,正则,三元表达式,函数
对象的扩展运算符
九,对象的新增方法
object.keys()方法,object.value()方法
十,运算符的扩展
可选链:为了避免连续读取对象属性会报错的问题
空值合并:为了排除null和undefined在布尔判断的场景
十一,symbol
面试会问,他是一个新的数据类型,是全世界独一无二的值
十二,set和map数据类型
set:用来实现去重,只能实现基本去重,场景不多
map:是一种完善的键值对的数据结构,可以当作一种增强版的对象
weakse,weakmapt:是set和map的一种补充,内部的数据是一个若引用关系
十三,proxy
工作中很少问,面试大概率问,因为vue3的响应式原理就是proxy
中文为代理,其实就是中间商,和es5的defineproxy,后端的中间件,axios的拦截器,路由的导航守卫概念差的不多。
十四,reflect
工作中不会用,面试几乎不会问
中文译为反射。把别人的一些方法拿过来自己用
十五,promise
满星,重中之重
中文译为承诺,答应的事情一定要有结果
promise有三种状态 默认等待状态(pedding) 状态一定要变为成功或者失败
使用resolve方法变为成功 使用reject方法变为失败
promise是一个构造函数,使用关键字创建一个proimise对象,构造函数的参数是一个回调函数,该回函数有两个方法作为参数,一个是reslove一个是reject这两个方法是把状态该为成功或者失败
promise一旦执行就无法停止,解决方案:在构造函数中返回一个空的proimise可以终端执行
实例方法:then方法接收成功的数据,catch方法接受失败的数据,(then方法可以接收两个回调函数,一个是成功,一个是失败)
静态方法:promise.all()解决并发的场景,promise.resolve()改为成功的方法promise.reject()改为失败的方法
十六,lterator和for of循环
因为数组太好用了,有很多方法可以对数组里的数据进行操作,特别是循环
所以es6就推出了lterator接口,可以堆一些数据部署该接口,就可以使用for of进行循环遍历操作了
十七,generator遍历器/生成器
es6之前的函数执行只能是一次性的,也就是说只要执行,里面的代码会一次性执行完,但是js'是一个异步的语言,所以在执行异步代码很多时候需要等待结果的返回才能执行后面的代码
es6推出了generator可以执行函数的懒执行
十八,async函数
满星!!!!!
异步代码同步化
他就是generator的语法糖,但是他返回的是promise对象
async关键字标识后面的函数里有异步代码啊,await关键字标识要的等待后面promise对象的执行有结果了
async和await是一对好cp,中间不能插入其他的函数,必须写在一起
在全局作用域里不能直接使用await,如果要使用的话就写一个函数,函数前面加上async,然后在该函数里使用await
十九,class基本语法
class声明出来的对象和其他的方式不一样,传统的声明对象的方式只能是空对象,class声明的东西是天生就具备一些特质(属性)行为和(方法),这种形式更符合显示社会的认知
构造函数:模具 实例化的时候会自动调用构造函数,给实例对象赋值属性和方法
修饰符,在类中有一些访问(权限)修饰符。一些不希望外面访问属性方法可以使用修饰符
class语法
class 类名 {
属性名
构造函数
方法名
}
二十,class的继承
代码世界的继承和现实社会中的继承很像,但是代码世界的继承更加的彻底,子类会继承父类所有的属性和方法
子类继承父类的时候,如果子类要使用父类的属性和方法,需要在子类的构造函数constructor中使用super()方法,super方法调用后本质上就是执行的父类的构造函数
class 子类名 extends 父类 {
属性名
构造函数
方法名
}
二十一,模块化
背景:es6之前,js官方不支持模块化,这样对于代码的引入(link,script)的执行顺序有很严格的要求,非常不利于维护
es6之前推出了一些模块化的概念 cmd amd 也是为了让js具备模块化的功能,典型的实现及时seajs和requirejs
es6就推出了模块化,遵循的是esmodule规范,这样js就天生具备模块化,更利于大项目的开发和维护
export导出 通过import导入
export default导出 通过import变量名导入
如果使用export导出的数据有多个,在引入的时候需要直接引用,此时可以使用import * as变量
export const name ="张三"
export default{
age:11
}
import {name} from 'a.js'
import info from 'a.js'
import* from 'a.js'