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

4 篇文章 0 订阅

一、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
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
探索全栈前端技术的魅力:HTML+CSS+JS+JQ+Bootstrap网站源码深度解析 在这个数字化时代,构建一个既美观又功能强大的网站成为了许多开发者和企业追逐的目标。本份资源精心汇集了一套完整网站源码,融合了HTML的骨架搭建、CSS的视觉美化、JavaScript的交互逻辑、jQuery的高效操作以及Bootstrap的响应式设计,全方位揭秘了现代网页开发的精髓。 HTML,作为网页的基础,它构建了信息的框架;CSS则赋予网页生动的外观,让设计创意跃然屏上;JavaScript的加入,使网站拥有了灵动的交互体验;jQuery,作为JavaScript的强力辅助,简化了DOM操作与事件处理,让编码更为高效;而Bootstrap的融入,则确保了网站在不同设备上的完美呈现,响应式设计让访问无界限。 通过这份源码,你将: 学习如何高效组织HTML结构,提升页面加载速度与SEO友好度; 掌握CSS高级技巧,如Flexbox与Grid布局,打造适应各种屏幕的视觉盛宴; 理解JavaScript核心概念,动手实现动画、表单验证等动态效果; 利用jQuery插件快速增强用户体验,实现滑动效果、Ajax请求等; 深入Bootstrap框架,掌握移动优先的开发策略,响应式设计信手拈来。 无论是前端开发新手渴望系统学习,还是资深开发者寻求灵感与实用技巧,这份资源都是不可多得的宝藏。立即深入了解,开启你的全栈前端探索之旅,让每一个网页都成为技术与艺术的完美融合!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值