常见面试题总结归纳(五)

tech2022-09-26  99

文章目录

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

最新回复(0)