js面试题

1、js数据类型


基本数据类型
Number、String、Boolean、Null、Undefined、Symbol、bigInt
引用数据类型
object、Array、Date、Function、RegExp

2、js变量和函数声明的提升


在js中变量和函数的声明会提升到最顶部执行
函数的提升高于变量的提升
函数内部如果用 var 声明了相同名称的外部变量,函数将不再向上寻找。
匿名函数不会提升。

3、闭包


闭包就是能够读取其他函数内部变量的函数
闭包基本上就是一个函数内部返回一个函数
好处
可以读取函数内部的变量
将变量始终保持在内存中
可以封装对象的私有属性和私有方法
坏处
比较耗费内存、使用不当会造成内存溢出的问题

4、== 和 ===的区别


==是非严格意义上的相等
值相等就相等
===是严格意义上的相等,会比较两边的数据类型和值大小
值和引用地址都相等才相等

5、this


this总是指向函数的直接调用者
如果有new关键字,this指向new出来的对象
在事件中,this指向触发这个事件的对象

6、js数组和对象的遍历方式


for in
for
forEach
for-of

7、map与forEach的区别


forEach 方法,是最基本的方法,就是遍历与循环,默认有 3 个传参:分别是遍历的数组内
容 item、数组索引 index、和当前遍历数组 Array
map 方法,基本用法与 forEach 一致,但是不同的,它会返回一个新的数组,所以 callback
需要有 return 值,如果没有,会返回 undefined

8、箭头函数与普通函数的区别


函数体内的 this 对象,就是定义时所在的对象,而不是使用时所在的对象
不可以当作构造函数,也就是说,不可以使用 new 命令,否则会抛出一个错误
不可以使用 arguments 对象,该对象在函数体内不存在。如果要用,可以用 Rest 参数代替
不可以使用 yield 命令,因此箭头函数不能用作 Generator 函数

9、同源策略

同源指的是域名、协议、端口号相同

10、如何解决跨域

document.domain + iframe 跨域

nodejs中间件代理跨域
后端在头部信息里面设置安全域名

11、严格模式的限制


变量必须声明后再使用
函数的参数不能有同名属性,否则报错
不能使用 with 语句
禁止 this 指向全局对象

12、es6新增


新增模板字符串
箭头函数
for-of(用来遍历数据—例如数组中的值。)
ES6 将 Promise 对象纳入规范,提供了原生的 Promise 对象。
增加了 let 和 const 命令,用来声明变量。
还有就是引入 module 模块的概念

13、attribute 和 property 的区别是什么


attribute 是 dom 元素在文档中作为 html 标签拥有的属性
property 就是 dom 元素在 js 中作为对象拥有的属性。
对于 html 的标准属性来说,attribute 和 property 是同步的,是会自动更新的
但是对于自定义的属性来说,他们是不同步的

14、let和const 的区别是什么


let 命令不存在变量提升,如果在 let 前使用,会导致报错
如果块区中存在 let 和 const 命令,就会形成封闭作用域
不允许重复声明
const定义的是常量,不能修改,但是如果定义的是对象,可以修改对象内部的数据

15、内存泄漏


定义:程序中己动态分配的堆内存由于某种原因程序未释放或无法释放引发的各种问题。
js中可能出现的内存泄漏情况:结果:变慢,崩溃,延迟大等
js中可能出现的内存泄漏原因
全局变量
dom 清空时,还存在引用
定时器未清除
子元素存在引起的内存泄***r />

16、script 引入方式


html 静态 <script> 引入
js 动态插入 <script>
<script defer> : 异步加载,元素解析完成后执行
<script async> : 异步加载,但执行时会阻塞元素渲染

17、数组(array)方法


map : 遍历数组,返回回调返回值组成的新数组
forEach : 无法 break ,可以用 try/catch 中 throw new Error 来停止
filter : 过滤
some : 有一项返回 true ,则整体为 true
every : 有一项返回 false ,则整体为 false
join : 通过指定连接符生成字符串
push / pop : 末尾推入和弹出,改变原数组, 返回推入/弹出项
unshift / shift : 头部推入和弹出,改变原数组,返回操作项
sort(fn) / reverse : 排序与反转,改变原数组
concat : 连接数组,不影响原数组, 浅拷贝
slice(start, end) : 返回截断后的新数组,不改变原数组
splice(start,number,value…): 返回删除元素组成的数组,value 为插入项,改变原数组
indexOf / lastIndexOf(value, fromIndex) : 查找数组项,返回对应的下标
reduce / reduceRight(fn(prev, cur) ,defaultPrev) : 两两执行,prev 为上次化简函数的return 值,cur 为当前值(从第二项开始)

18、JavaScript 深浅拷贝


浅拷贝
Object.assign
深拷贝
可以通过 JSON.parse(JSON.stringify(object)) 来解决

19、说说异步编程的实现方式


回调函数
优点:简单、容易理解
缺点:不利于维护、代码耦合高
事件监听
优点:容易理解,可以绑定多个事件,每个事件可以指定多个回调函数
缺点:事件驱动型,流程不够清晰
发布/订阅(观察者模式)
类似于事件监听,但是可以通过‘消息中心’,了解现在有多少发布者,多少订阅者
Promise 对象
优点:可以利用 then 方法,进行链式写法;可以书写错误时的回调函数
缺点:编写和理解,相对比较难
Generator 函数
优点:函数体内外的数据交换、错误处理机制
缺点:流程管理不方便
async 函数
优点:内置执行器、更好的语义、更广的适用性、返回的是 Promise、结构清晰
缺点:错误处理机制

20、说说面向对象编程思想


基本思想是使用对象,类,继承,封装等基本概念来进行程序设计
优点
易维护
易扩展
开发工作的重用性、继承性高,降低重复工作量。
缩短了开发周期

21、项目性能优化


减少 HTTP 请求数
减少 DNS 查询
使用 CDN
避免重定向
图片懒加载
减少 DOM 元素数量
减少 DOM 操作
使用外部 JavaScript 和 CSS
压缩 JavaScript、CSS、字体、图片等
优化 CSS Sprite
使用 iconfont
多域名分发划分内容到不同域名
尽量减少 iframe 使用
避免图片 src 为空
把样式表放在 link 中
把 JavaScript 放在页面底部

22、什么是单线程,和异步的关系?


单线程 :只有一个线程,只能做一件事
原因 : 避免 DOM 渲染的冲突
浏览器需要渲染 DOM
JS 可以修改 DOM 结构
JS 执行的时候,浏览器 DOM 渲染会暂停
两段 JS 也不能同时执行(都修改 DOM 就冲突了)
webworker 支持多线程,但是不能访问 DOM
解决方案 :异步

23、说说负载均衡?


单台服务器共同协作,不让其中某一台或几台超额工作,发挥服务器的最大作用
http 重定向负载均衡:调度者根据策略选择服务器以 302 响应请求,缺点只有第一次有效果,后续操作维持在该服务器 dns 负载均衡:解析域名时,访问多个 ip 服务器中的一个(可监控性较弱)原因 - 避免 DOM 渲染的冲突
反向代理负载均衡:访问统一的服务器,由服务器进行调度访问实际的某个服务器,对统一的服务器要求大,性能受到 服务器群的数量

24、作用域链?


作用域链可以理解为一组对象列表,包含 父级和自身的变量对象,因此我们便能通过作用域链访问到父级里声明的变量或者函数

25、什么是原型、原型链、继承?


所有的函数都有prototype属性(原型)
所有的对象都有__proto__属性
在Javascript中,每个函数都有一个原型属性prototype指向自身的原型,而由这个函数创建的对象也有一个proto属性指向这个原型,而函数的原型是一个对象,所以这个对象也会有一个proto指向自己的原型,这样逐层深入直到Object对象的原型,这样就形成了原型链。

26、JS垃圾回收机制是怎样的?

1.概述

js的垃圾回收机制是为了防止内存泄漏(已经不需要的某一块内存还一直存在着),垃圾回收机制就是不停歇的寻找这些不再使用的变量,并且释放掉它所指向的内存。
在JS中,JS的执行环境会负责管理代码执行过程中使用的内存。

2.变量的生命周期

当一个变量的生命周期结束之后,它所指向的内存就会被释放。js有两种变量,局部变量和全局变量,局部变量是在他当前的函数中产生作用,当该函数结束之后,该变量内存会被释放,全局变量的话会一直存在,直到浏览器关闭为止。

3.js垃圾回收方式
有两种方式: 标记清除、引用计数

标记清除:大部分浏览器使用这种垃圾回收,当变量进入执行环境(声明变量)的时候,垃圾回收器将该变量进行了标记,当该变量离开环境的时候,将其再度标记,随之进行删除。

引用计数:这种方式常常会引起内存的泄露,主要存在于低版本的浏览器。它的机制就是跟踪某一个值得引用次数,当声明一个变量并且将一个引用类型赋值给变量得时候引用次数加1,当这个变量指向其他一个时引用次数减1,当为0时出发回收机制进行回收。

27、逐进增强和优雅降级


逐进增强
针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高版本浏览器进行效果、交互等改进和追加功能达到更好的用户体验。
优雅降级
一开始就构建完整的功能,然后再针对低版本浏览器进行兼容

#js#
全部评论
希望面试能用大,感谢分享
1 回复 分享
发布于 2022-08-30 22:33 陕西

相关推荐

03-20 13:02
已编辑
华南师范大学 前端工程师
这个文章顺序和时间是相反的,是从时间最近的到时间最远的。淘天搜推首先给淘天的笔试跪了&nbsp;面试官人很好,氛围其实挺轻松,但是把每个项目、实习内容全都问了一遍,还让共享屏幕运行一下。让介绍印象深刻的点,但是细拷得不深。问了一些项目整体设计(架构?)的想法。1、原型和原型链,为什么要有原型2、闭包,为什么要有闭包3、说说内存泄漏,怎么排查内存泄漏4、想问react,但是我没用过,讲了一下自己了解过的react理念5、vue的性能优化。vue的工作原理。diff怎么工作的。响应式怎么实现的。6、盒子模型7、BFC8、垂直水平居中9、css怎么实现动画10、http,get和post的区别11、安全方面,防范xxs,csrf攻击手撕:数组转树反问:讲了一些toc动画方向的内容,视觉效果,小程序小游戏。可以巩固一下软件工程方面的知识,怎么去架构一个软件,怎么拆分组件,接口怎么互动。项目管理的知识?界面背后的业务和需求,可能也要去了解。ai对初级人员有挑战,但是还是要拥抱ai。腾讯4&nbsp;oc&nbsp;timeline3.10&nbsp;一面3.12&nbsp;二面3.17hr面3.19oc腾讯四进宫,第三个部门挂了之后秒被第四个捞了起来,而且进度推得很快,真的感恩,从今天开始本人会日行一善,每天学习。感恩,以后ai只用元宝,听歌只听qq音乐,在线文档只用腾讯文档,追剧只用腾讯视频,聊天只用微信腾讯4-3很正式略严肃地面了半个小时1、确认基础信息和未来规划,到岗时间,手头offer2、你了解我们部门是做什么的吗3、说说你的项目经历4、在这些项目过程中,主要的合作方是谁,是你一个人去独立完成的这些项目吗?5、在这些小组合作过程中,有没有遇到一件不一致或者冲突的场景6、有小组同学不配合的情况你是怎么处理的7、如果从开始的时间点再来一次,你作为小组的负责人再做一次你觉得会有什么不一样吗8、那你总结一下你刚才提到的项目里,未来对你来实习,你觉得有什么优势和不足9、在上一段实习中你的独立贡献是什么10、你怎么评价你这边实习的产出成果,十分给自己打几分11、包括这次的暑期实习以及未来工作的方向,你是怎么规划自己毕业之后的发展路径的12、tx和你之前实习公司的体量有一些gap,你觉得到时候来可能会碰到哪些挑战,你现在是怎么去准备应对的13、介绍一下自己和其他候选人相比,有什么优势,缺点也可以分享一下腾讯4-2小哥哥love,一直鼓励我,场景题说思路还会继续引导到最后说出来1、文档流是什么。常见的文档流2、块级元素、行内元素3、脱离文档流4、absolute和fixed5、重绘和重排6、怎么减少重排7、promise的api8、promise.all和allsettled9、箭头函数10、计算属性和watch11、vue2和vue3的区别12、响应式原理和diff算法13、浏览器本地缓存14、怎么实现懒加载和无限滚动的15、防抖和节流的区别16、虚拟列表。怎么做。不定高度的虚拟列表怎么做:拿到元素的宽高继续计算17、组件库select有没有了解到被父层级遮挡,antd。有个属性。把div挂载在body上。18、性能优化怎么做的。顺带问了defer和async。js依赖怎么顺序加载。19、大学里最有成就感的一件事20、为什么选择前端21、AI对前端学习有什么改变反问:用到的库可以去了解它的底层实现,遇到性能问题可以去看底层的实现,构建工具比如vite的热加载,各个底层的实现,拦截和实施。可以利用AI去学习。腾讯4-1运营管理小姐姐love,不会的会告诉我答案,还帮我分析了一下项目里我困惑的点1、变量声明。一般怎么选择let和const2、事件冒泡和事件捕获。举例子说一下。事件委托。3、promise的状态。之间有什么关系。有什么用4、async/await和promise的联系5、html5中的语义化标签6、canvas和svg。svg和普通的图片格式有什么不同,一般用svg来做什么7、img的属性8、图像的大小,响应式怎么设计。rem参考的是谁。%参考的是谁9、表单用到哪些组件,怎么进行表单验证。10、邮箱怎么验证,@后除了邮箱域名还可能有ip,端口11、说一下position常用的字段,默认的是什么,有什么区别12、css有哪些选择器,他们的优先级是什么13、想通过css选择器取选择一个类下面的子元素,通配符14、grid布局。15、flex布局,详细16、浏览器的渲染原理17、同源策略,有什么作用。怎么做跨域。怎样算同源18、数据结构:数组和链表,队列和栈19、最有成就感的项目拷打项目20、怎么看渲染时间,有什么指标去观测。图片优化策略。说到预加载,浏览器有空闲资源的时候去加载。21、封装了表单组件。22、批量导入用户显示在表格23、为什么要做组件库24、组件库的技术选型25、单元测试端到端测试26、crud项目遇到的问题。keep-alive不需要缓存导航栏。手撕:最长不重复字符反问:多总结虾皮先拷项目,然后拷场景,八股也拷,手写也拷,没问几道题但是一直往下问手写:两列布局、取对象的嵌套值1、什么时候接触前端的,什么机会基础的,怎么去学习前端的。知识框架怎么建立的什么形式,开源代码看过什么,公众号前沿的技术,有没有自己实现过2、项目中技术上比较有难度的地方。图片的预加载。用这个有作用吗3、修复过印象比较深刻的bug4、输入一个url的过程,解析文档时遇到css,js的问题5、this指向题反问:看别人写的一些文章,去了解主流技术,多写代码腾讯3金融,腾讯三进宫,已把腾讯捞面试当成面试训练手撕:url解析字符串、并行串行、promise.all1、问实习做了什么2、解决了哪些bug印象深刻,表现的是什么问题,具体是怎么解决,什么列顺序不存到后台3、首屏性能优化(组件懒加载是怎么实现的,动态优化,有没有了解过webpack是怎么分析文件依赖的,常用的webpack配置)4、表单的数据绑定,v-model,vue2怎么处理新增的属性响应式5、响应式原理6、diff算法7、表单的增减可以怎么实现8、diff算法,在v-for里使用v-if会有什么问题的过程9、http和https的差异,对称算法和非对称算法,交换密钥的过程10、实习中遇到的最困难的事情反问:要建立框架,知识方面的,要有一个知识路线去学习,而不止是实践经验,实践之后要往下深挖一点网易雷火面试官好好,小姐姐love,平易近人亲切温柔。1、叫自我介绍直接开始介绍项目2、性能优化怎么做的3、首屏优化有什么方案思路,讲讲能想到的问题,和解决问题的思路4、说说懒加载和虚拟列表的区别,会冲突吗,原理5、说说vue2和vue3的区别,diff算法更新了什么6、css画三角形7、怎么清除浮动8、介绍一下flex布局有没有用过figma9、说说webpack和vite10、怎么原生实现无限滚动11、说说重排和重绘12、组件库里说说对组件有没有自己的一些设计,和业界的实现有什么不同13、eslint做了什么,自己实践中感觉到它有什么帮助14、怎么学习前端的反问:介绍部门,介绍技术栈,基础不是很牢固,要建立自己的知识体系。附一则之前写的发疯文学:每次面完都好想似,整理完面经然后看着自己的玩具项目,简历上还要编成花,和面试官大眼瞪小眼,讲完面试官问我没了吗就这些吗,打哈哈尴尬地笑笑而过,面完自己哄自己找时间把项目的难点做了吧不要再自己乱编了。事实上一手抓八股一手抓手撕一手抓项目根本抓不住时间。也是清楚自己的能力的,这里做一点那里做一点然后就开始莫名其妙地祈祷。微微改动简历去一堆海投官网更新,结果看到红红的简历筛选不通过,就这样无力叹息然后去主页重新搜一个岗位。好想穿越到大一大二把不爱做算法不爱动脑的自己一拳锤似,以为背题真能背出来吗。面完还要哄自己还不赶紧做题练习,想想大不了全部都为秋招练手,再大不了还有春招呢,想到这感觉自己能有这种想法真是这辈子都有了。看着包过不了的大厂面试邀约就这样露出苦笑。面试完想着玩玩手机吧,刷到没见过的八股文不管了明天再看吧,刷到别人oc的timeline好强祝福接好运,再刷到一篇对前端的调侃啊哈哈哈哈真是天都塌了。寒假不急现在急了吧哈哈哈,,这都是我应得的呀哈哈哈。其实也没有,就这样发牢骚然后恨自己不争气,回去再慢慢慢慢慢慢慢慢慢慢慢慢慢慢慢慢地准备。#前端# #面试# #面经# #腾讯# #虾皮# #网易# #淘天# #前端面试#
点赞 评论 收藏
分享
查看21道真题和解析
点赞 评论 收藏
分享
评论
7
74
分享

创作者周榜

更多
牛客网
牛客企业服务