文章目录
一、JavaScript
JavaScript的数据类型
基本类型:String、Number、Boolean、null、undefined、Object、Symbol、BigInt
引用类型:Object 包涵Array 、function 、Data
判断变量的类型
typeof - null和Object均返回object
Object.prototype.toString.call() - 默认返回当前对象的内置属性[[Class]]
instanceof - 可以判断A是否为B的实例,可以用来检测数组
== & === 和 数据类型转换
两个等号 是会先进行数据类型的隐式转换,在比较值
三个等号先比较数据类型,在比较值
原型和原型链
每一个构造函数都会有对应的原型,通过构造函数创建的实例对象的__proto__指向构造函数的prototype,原型链的顶级是Object,在往上就是null
闭包及优缺点
作用域应用的特殊情况,有两种表现:
1.函数作为参数被传递。
2.函数作为返回值被返回。
所以,闭包中自由变量的查找,是在函数定义的地方开始向上级作用域查找,不是在函数执行的地方查找。
闭包的优点:
希望一个变量长期存储在内存中。
避免全局变量的污染。
私有成员的存在。
闭包的缺点:
常驻内存,增加内存使用量。
使用不当会很容易造成内存泄露。
call、apply、bind
都是改变this指向,第一个参数都是this,call和apply区别在于是参数的传入,call是一个个传入,apply是传入一个数组,bind的区别在于返回的是一个方法。
DOM事件流 和 事件委托
事件捕获阶段: 触发事件 - document发出一个事件流 - dom节点 - 目标元素target(默认是不会执行处理的函数的)
事件目标阶段:执行事件处理函数
事件冒泡阶段: 目标 - dom节点 - document/window
事件委托:通过事件冒泡机制在父元素上绑定对应的处理函数,使用event事件对象获取target目标元素进行相应处理。
cookie/storage
cookie:4kb,兼容好,每次都会与后台交互,可以设置过期时间。
localStorage:5mb,h5新特性,不兼容低版本浏览器,本地储存,不会每次都和后台交互,除非手动删除,不然一直存在。
sessionStorage:会话关闭,缓存就失效
数组和对象的常见方法
数组:map、filter、some、every、reduce、splice、push、pop、shift、unsfhit
对象:toString、assign、definedProoperty、keys、hasOwnProperty等等
new内部做了什么
1.创建一个新对象。
2.将构造函数的作用域赋给新对象(因此this就指向了这个新对象)
3.执行构造函数中的代码(也就是为新对象添加属性)
4.返回新对象
new操作符,它创建的实例的__proto__是自动指向构造函数的prototype的
防抖&节流
利用setTimeOut,使事件处理函数触发时候一直产生新的定时器,直到一个设置的时间间隔达到以后,才执行一次。
防抖一般是输入框,停止输入一定时间后才执行一次处理。
节流是一定时间内 只执行一次。
requestAnimationFrame
html5 提供一个专门用于请求动画的api:requestAnimationFrame,就是请求动画帧。
这个api可以保证不会丢帧,不会卡顿,每到设置的间隔时间,就会执行一次回调函数,变相的函数节流。
this指向
this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象(个别情况除外)
作用域链
如果一个变量在当前作用域没有被定义,那么就会向父级作用域寻找,如果父级也没有,则一层层向上寻找,这种层级关系就是作用域链。
let/const/var
var 会导致变量提升,典型的例子就是for循环中的i,如果用var,就可以在外部访问到。
let 不会导致变量提升,仅能在当前作用域访问。
const 设置定值,如果是引用类型,则固定引用地址。
Promise、async await
三者均属于微任务,主线程结束以后才会执行。
promise有三个状态pendding,resolve,reject
常用方法有race,all
async await实际上是genaretor函数的语法糖,可以控制异步流程。
箭头函数
this指向永远是看上下文。
javaScript的运行机制
js是单线程,现在主线程上排队执行同步任务,异步任务则直接进入任务队列,只有任务队列通知主线程可以执行某个异步任务,该任务才会进入主线程执行。
异步任务会分为宏任务和微任务,主线程执行完成之后开始执行微任务,再执行宏任务,如初循环形成event loop
实现继承的几种方法
ES5:
1.原型链继承:
将构造函数的原型设置为另一个构造函数的实例,这样继承了另一个原型的所有属性和方法。
2.构造函数继承:
将父类在子类构造函数中调用,这样每个子类实例都会执行产生一个父类中属性方法的副本,实现继承父类。
3.组合继承:
上面两种方式相加
4.原型式继承:
通过临时创建一个构造函数,借助已有对象作为临时构造函数的原型,然后实例化并返回,来实现继承。
5.寄生式继承:
在原型式继承的基础上,在返回实例之前,可以在函数内部增强对象。
6.寄生组合式继承:
融合组合继承和寄生继承,并弥补了他们的缺点。
ES6(typeScript也是如此):
通过class的extends关键字和super方法实现继承。
垃圾回收
js引擎中有一个后台进程称为垃圾回收器,他监视所有对象,并回收删除那些不可访问的对象。