文章目录

一、JavaScriptJavaScript的数据类型判断变量的类型\== & === 和 数据类型转换原型和原型链闭包及优缺点call、apply、bindDOM事件流 和 事件委托数组和对象的常见方法new内部做了什么防抖&节流requestAnimationFramethis指向作用域链let/const/varPromise、async await箭头函数javaScript的运行机制实现继承的几种方法垃圾回收

一、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引擎中有一个后台进程称为垃圾回收器，他监视所有对象，并回收删除那些不可访问的对象。