当前位置:首页 » 网页前端 » 公司前端面试都问什么
扩展阅读
webinf下怎么引入js 2023-08-31 21:54:13
堡垒机怎么打开web 2023-08-31 21:54:11

公司前端面试都问什么

发布时间: 2023-05-15 22:25:31

前端hr面试常问的问题

面试其实就是一个不断选择与被选择的过程(不知道说的对不对)。不同公司的面试方式都有所不同,大多数人都有过多次面试的经历,前端面试也不外乎那么一些啦(好像有些废话的感觉)。

面试之前的小故事

HR会打电话过来我是××公司的,在××上看到你投到我们公司的简历,问你何时候有空约一个呗,然后说就星期*吧,既然都打电话请我面试了,好吧,那就约一个!

然后有些人会精心准备,不停刷面试题,整夜整夜的看着HTML/JS/CSS知识点,还有那些最新的、时髦的技术,看看到时候能不能唬住面试官;而有些人对自己胸有成竹,哥那么多年的前端经验了,啥项目没有经历过,不就一个面试,怕啥呢。

很快或者很慢的来到那天。你打扮的清清爽爽漂漂亮亮的,打扮的好会有加分不,没错,第一印象也是挺重要的。途中有些人可能会还一直想着面试官会问啥题目呢,那啥**属性是什么来着呢,再次拿出手机默默的看起资料;有些人可能就会想着公司不知道妹子多不多漂亮不呢,环境和福利不知道咋样,最好别碰到傻逼一样的面试官哎,不然这以后咋相处好呢。

来到公司,大小公司大家都见多了嘛,也是得看发展是吧,我们也不是肤浅的人,见到前台妹妹,哟,还不错哦。领你进会议室里,让你稍等一下,她去通知面试官,过了一会儿,不是面试官进来,那就是前台妹妹给您送来一杯水。面试官踱步向前,咦~,我是继续坐着呢,还是站着呢,还是站起来显礼貌一些嗯。

给面试的一般会是Team Leader或者非常资深的工程师。首先会让你自我介绍下,然后巴拉巴拉介绍自己,途中或者聊到面试官喜欢的`部分那就会中断问几个问题吧,介绍完自己,就进入正式的战斗了吧,一般会有2-3轮的回合。遇知战斗详情,请听下回分解。

哈哈, 开玩笑。以上瞎编胡造,如有雷同,纯属巧合。

这里就只谈谈前端技术的战斗回合吧,写的不好,请多见谅。

普通型

面试中问题会比较的零碎,html/js/css肯定都会有涉及。知识点不会有太大的规律,可能几个公司面试下来你遇到的问题一个都不带重复的。哎,前端的知识点就是乍一看深似海,仔细一看深似黑洞啊。问题好的话,一方面考察了面试人对前端接触的广度,深度的话也可以从中接触到一些。因为面试的时间有限,其实也非常考验面试官对一个人的洞察能力。

一般如果不是应届生的话,也就是会跟你交流你之前的项目,你担当的角色,你遇到的难题,怎么解决问题,用的框架,与其他工程师的交流沟通协作等等。 这些其实你心里肯定是有答案的(可能也有懵逼的),就看你的表达,能不能对上面试官的胃口。

进阶型

除了基本的问题,面试中会有一些明显设计过的题目。针对某几个知识点,或让你手写代码,或让你提供算法或思路。如果之前没有遇到过这类问题的话其实一下子真的挺难回答,或者直接懵逼了,或者回答不出面试官满意的答案。这其实对工程师的要求也是比较的高,不能只是单纯的切切页面,用用插件,需要对某一类问题或者模式或者算法有深入的了解,对问题的解决思路有很好的把握。

算法可能不是前端工程师的长项,但作为优秀的工程师,对算法的了解应该会只深不浅。

这种面试的题目既提现了公司对面试者的要求,也相对而言的会有所体现公司的水平。

出题型

题目比较的综合,会通过邮件发给你,或者有专门的页面提供,在面试之前让你2-3天的时间做完。题目可能是很有名的某一类交互,或游戏,或页面,或公司自己出的一类小东西。

因为非当场面试,所有有比较充足的时间来思考,来写一些代码。一般都会完成,所以其实比较的关注点就是对代码的质量,通过代码来考察面试者的思路以及代码**惯等等。

其未知性也比较多,可能因为有些东西可能没法通过代码来传递,沟通,其他的思路,或者题目的缺陷等等。所以这只是面试途中的一个小部分,大多数人其实都会能做的很好。

直接上机型

还有的就会直接给你某一个交互,或者一张静态页面,或者一个布局等等,直接给你台电脑让你当场写出来。写完之后再有所交流,说说自己的想法或者接着谈其他的。

当你写代码时候,其实暴露的东西也挺多的。你写的**惯,思路清晰不清晰,对代码的熟悉程度,可能你平时都是ctrl C + V的,这时候你咋办呢。

这个可能遇到的比较少,但也会是有的。

结束语

许多面试可能都会结合以上的几种类型,多方面的考察面试者,其实,大家都懂的。

㈡ hr如何面试web前端工程师,该问哪些技术问题

hr如何面试web前端工程师,该问哪些技术问题

一、基本知识
我们生活在网际网路时代,你想知道的任何事情几乎都能在15分钟内找到相关资讯。可是,能找到资讯并不等于你会使用它。我认为所有前端工程师至少都应 该掌握某些基本的知识,才能有效地完成自己的工作。如果一遇到问题,就停下工作上网四处搜寻解决方案,怎么可能保证按期完成工作呢?听听,还有谁在说“我 不知道,但我可以上网搜到。”请这些同学把手举起来,让大家认识一下(immediately raises a flag for me.)。下面我列出一些基本的知识点,这些都是我认为一名前端工程师(无论工作年头长短)在没有任何外来帮助的情况应该知道的。
[list][*]
DOM结构——两个节点之间可能存在哪些关系以及如何在节点之间任意移动。
[*]
DOM操作——怎样新增、移除、移动、复制、建立和查询节点。
[*]
事件——怎样使用事件以及IE和DOM事件模型之间存在哪些主要差别。
[*]
XMLHttpRequest——这是什么、怎样完整地执行一次GET请求、怎样检测错误。
[*]
严格模式与混杂模式——如何触发这两种模式,区分它们有何意义。
[*]
盒模型——外边距、内边距和边框之间的关系,IE 8以下版本的浏览器中的盒模型有什么不同。
[*]
块级元素与行内元素——怎么用CSS控制它们、它们怎样影响周围的元素以及你觉得应该如何定义它们的样式。
[*]
浮动元素——怎么使用它们、它们有什么问题以及怎么解决这些问题。
[*]
HTML与XHTML——二者有什么区别,你觉得应该使用哪一个并说出理由。
[*]
JSON——它是什么、为什么应该使用它、到底该怎么使用它,说出实现细节来。
[/list]
重申一下,上述这些知识点都应该是你应该“想都不用想”的东西。我一开始问的所有问题都是想摸清你对所有这些领域知识的掌握程度。虽然上面列出的这些知识点并没有面面俱到,但我觉得你至少应该掌握这些,才有可能跟我坐到一间办公室里来。
二、少量提问
我非常赞同面试者问的问题越少越好。反复问应聘者各种问题既不公平,也很无聊。我在任何一次面试中,通常只问三个大问题,但每个问题又会涉及我所能想到的多个方面。回答每个大问题一般要经过几个步骤,这样我就可以在每个步骤中穿插着问一些小问题。比如说:

现在有一个正显示着Yahoo!股票价格的页面。页面上有一个按钮,你可以单击它来重新整理价格,但不会重新载入页面。请你描述一下实现这个功能的过程,假设服务器会负责准备好正确的股票价格资料。
这个问题牵扯到一组我想要考察的基本知识点:DOM结构、DOM操作、事件处理、XHR和JSON。如果我要求你对换一种处理股票价格的方式,或者 让你在页面中显示其他资讯,就可以把更多的知识点包括进来。对于经验比较丰富应聘者,我也可以自如地扩充套件要考察的知识范围,最简单像JOSN与XML的区 别、安全问题、容量问题,等等。
我还希望应聘者给出的任何解决方案中都不要使用库。我想看到最原生态的程式码,你就当页面中没有包含任何库。你说你对哪个库了解多少多少,但我不能把 关于库的知识作为评判能力的因素,因为库是会随时间变化的。我需要的是真正理解库背后的机制,特别是能够徒手写出一个自己的库的人。
三、解决问题
做为一名前端工程师,最值得高兴的事莫过于解决同一个问题会有很多种不同的方法,而你要做的就是找出最合适的方法来。我在提问的时候,经常会在应聘 者解释完一种方法后问他们还有没有第二种方法。此时我会跟他们说,假设你的这个方法由于种种原因被否决了,那么你还能不能给出另一种方法。这样做可以达到 两个目的。
首先,可以测试出他们是否在毫无意义地复述书本中的东西。不能不承认,某些人确实有过目不忘的天赋,听他们在那里滔滔不绝地讲,你会觉得他们什么都 明白。可是,只要一跟这些人谈到怎么查询方案无效的原因,以及能否拿出一个新方案来,他们往往就傻眼了。这时候,如果我听到“我不明白这个方案为什么不够 好”之类的反问,心里立刻就明白我的问题已经超出了他们的能力范围,而他们只是想拿自己死记硬背的结论来蒙混过关。
其次,可以测试出他们已经掌握的(还是那句话,“想都不用想”)浏览器技术知识。如果他们对浏览器平台的核心知识有较好的理解,想出解决同一问题的不同方案根本没有那么难。
对一名前端工程师来说,这绝对是最重要的能力。前端工程师在工作中遇到本该如此却并未如此的难题(说你啦,IE6),应该说是一件很平常的事。一个方案无效就无计可施的人,做不了前端工程师。
考核应聘者解决问题能力的另一层原因,与我的个人喜好有关。在搞清楚应聘者知道什么不知道什么之后,我就会想着问一个他们知识领域之外的问题。这样 做的目的,就是想看看他们怎样运用已有的知识解决新问题。在解决问题的每一步,我也准备了一些提示,以防有人会卡壳打艮(在我面前15分钟一言不发,对我 评价这个人毫无帮助)。我真正感兴趣的,是他们能够从上一步前进到下一步。我希望看到一个人就在我眼前学到新知识。
注意:所有问题都与浏览器技术相关。我不相信出几道抽象的逻辑题,就能够考出某人解决Web技术问题的能力。在我看来,这无异于让素描大师画肖像(或者让刘翔跟博尔特同场竞技),没有意义,也得不到任何有价值的资讯。

HR一般不会面试太深的问题,主要是了解一下你之前的工作经历,更多的是你自己描述,中间可能会问一些初级的问题,比如,你为什么从上一家单位离职等类似问题。

一道web前端工程师面试题,求解答。

这样的布局用绝对定位实现最合适,ABC的外层用相对定位,里边各列用绝对定位就可以。至于CBA且B宽度自适应,还是用绝对定位,但只定位C,A分部到两侧,中间的列margin设成左右列的宽度就可以。

web前端工程师如何才能硬气的跳槽?

web前端开发工程师想要硬气的跳槽,起码应该达到以下几点:
1.掌握扎实的技术基础,
需要掌握技术包括:HTML、CSS、JavaScript;
HTML是Web程式设计的基础,HTML也是一种规范,一种标准,它通过标记符号来标记要显示的网页中的各个部分。网页档案本身是一种文字档案,通过在文字档案中新增标记符,可以告诉浏览器如何显示其中的内容。
维护大型的CSS程式码库并非易事,特别是那些随意散漫未经组织的CSS程式码极易变成一团乱麻,所以,应该掌握CSS命名规范,来帮助开发者编写优质的程式码。
2.深入理解前端工程化和元件开发;
需要熟悉web前端框架—— React、Vue.js等,
React为我们提供了直接易用的,以状态为核心的前端应用开发方式,前端工程师应该会分析React内部工作原理,讨论React中简单元件、类元件等渲染流程。
Vue.js单元测试是应用开发中不可或缺的部分,日常开发中会用到的Vue.js单元测试的例子,所以应该掌握。
3.熟练掌握Web开发相关知识
至少熟悉一门后端语言,例如Node.js、Java、Go等;
Node.js内部原理视非常重要的,应该明白Node.js的主程序是如何启动的、如何载入内建模组、os包如何实现等等。
4.对技术有热情,有一定前端架构能力或者技术深度;具备团队合作意识强,能够多团队协作开发;具备企业级大型前端应用开发经验更佳。

如何识别一个人是web前端工程师

前端工程师需要懂得设计类程式码和js,有需要了解一些后台语言,例如PHP等。

如何实现成为web前端工程师的梦想

1.入门阶段:能够解决一些问题的水平。有一定的基础(比如最常见的HTML标签及其属性、事件、方法;最常见的CSS属性;基础的JavaScript程式设计能力),能够完成一些简单的Web前端研发需求。
2.进阶阶段:将JavaScript、HTML、CSS之类的编码帮助手册里的每个方法/属性都通读几遍!只有将基础打好,以后的路才能走的顺畅。
3.入室:最强程式码,知道所有能够解决需求的各种方案,能够选择使用最优秀的方案满足需求。这个级别基本上产品开发程式设计中的程式码主力。程式设计师应该能够肯定的回答:对于这个需求而言,我的程式码就是最优秀的程式码。
4.注重细节,注意那些当前需求里没有明文给出的细节:程式码效能的差异、执行平台(浏览器)的差异、需求的隐性扩充套件、程式码的向后相容等等。

如何了解web前端工程师和UI设计师

web前端工程师是不参与任何的设计,直接将网站美工制作的网站效果图使用ps按照效果图进行切片并使用、css、js等程式码进行网页的制作,最终编写出符合w3c标准的相容各个主流浏览器的静态页面,同时还需要按照后台开发人员的要求留下一些后台资料的接口。所以说网站前端工程师更多的是程式设计而不是设计。
UI设计师一般是学美术或者设计出身,精通photoshop、AI、AE等平面设计工具,其在网站开发过程的中的职责就是按照客户或者公司的需求设计出符合客户需求和接口或者颜色符合大众视觉的网站效果,如根据不同行业的需求设计颜色、设计接口风格等,其工作的最后成果就是网站的效果图。

web前端工程师进阶学习路线如何走

less和sass什么时候学都行,1,2天就能学会。这个不着急,没有什么承上启下的作用,可以单独拿出来学。
bootstrap就是一个框架,把最主要的栅格系统看看就好。其他的大概了解能干啥就行,很多公司,是不让用bootstrap的,而是用原始码自己写。这个用一天的时间没啥问题。
node.js和angular比较重要,如果学会,算是上了一个台阶了。所以重点说说这个。
angular属于mvvm框架,一开始觉得angular挺复杂的,所以想学一个简单的,轻量级的,所以决定先学vue。但是在了解的过程中发现,很多的专业名词,没听过,或者理解不透。所以又开始从头学习node.js。在学习node.js的过程中又开始迷茫,发现了很多JS不懂的地方。
所以,又开始深入研究js的dom,函式,ajax,阵列等。总之用了很长的时间,浪费了很长时间。
最后总结一下啊。其实,没必要钻那么多牛角尖。
先做着vue的例子,不懂的地方,直接略过,很多时候,不理解的不懂的东西,用着用着,突然就能明白。照猫画虎先把VUE的例子跟着做一遍之后,同时梳理一下涉及到的JS知识点。能自己用vue做出几个小成品的时候,开始结合js研究node.js。之后再去涉及angular。
angular差不多有个大概了解的时候,反过头接着学vue,你会发现,又会发现很多新东西。
web前端这个东西特别有意思,当你达到一个高度,返回来再看以前的技术,会发现,哎呀,竟然又能发现新大陆。

厦门web前端工程师培训哪家好

培训学校很多,没有具体的衡量标准的。但是可以从几方面去选择:
1 有很多优秀导师的
2 培养出很多优秀学员的
3 只做培训的,没有做其他的
4 做的比较久的。

北京WEB前端工程师培训哪个好

建议找全程面授课程的地方学习,课程体系很重要,现在企业在用人方面讲究全栈的前端工程师人才,所在在课程选择上要慎重,学习内容要基于HTML5,要包含pc端+移动端+后端。这要才能学的系统,就业上才会有所保障。

㈢ 前端面试 问什么问题

web前端面试会问人事方面的内容和web前端技术的内容;

人事的面试

web前端人事面试方面,需要注意如何自我介绍、性格有哪些优劣势、职业规划方向是什么、你的特长是什么、对于加班之类你是怎么看待等人事面试内容;

web前端技术的面试

技术面试,需要注意HTML+CSS+JavaScript以及JS主流框架的使用,比如Vue、React等,前端相关技术,比如tcp握手协议、网络安全、后端技术等;

对于web前端面试准备,建议你去看“决胜前端”(min app),它里面包含了很多web前端技术面试、人事面试等面试真题,而且针对面试题做了详细的分析与解答。

我给你截图看一下例子吧

㈣ 假如让你进行Web前端的电话面试,你会问什么问题

如果我作为Web前端电话面试的面试官,那么我就要进行多方面的考量,不仅考量这个人的专业能力,也要考量这个人的综合素质等。


  • 第一个问题:自我介绍

这是面试中最常见的第一个问题,并且自我介绍十分重要,因为这短短的介绍将会在面试官的脑海里形成第一印象,也可能会成为被面试者的刻板印象。

  • 第四个问题:唠家常

前面的正题部分完成后,一般面试官不会很快结束对话,还会问面试者一些家常问题,比如“你是哪里人?”、“你是怎么学习的前端技术?”、“现在有没有女朋友/男朋友?”这些家常问题能让面试官快速的掌握到你在简历之外的东西,是否是本地人、打算何时结婚,都可能成为你能否稳定的完成这份工作的考量。

㈤ Web前端岗位面试题有哪些

前端面试题汇总,基本上会有四大类问题,具体如下:
一、HTML

1、Doctype作用?严格模式与混杂模式如何区分?它们有何意义?

2、HTML5 为什么只需要写 <!DOCTYPE HTML>?
3、行内元素有哪些?块级元素有哪些? 空(void)元素有那些?
4、页面导入样式时,使用link和@import有什么区别?
5、介绍一下你对浏览器内核的理解?
6、常见的浏览器内核有哪些?
7、html5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5?
8、简述一下你对HTML语义化的理解?
9、HTML5的离线储存怎么使用,工作原理能不能解释一下?
10、浏览器是怎么对HTML5的离线储存资源进行管理和加载的呢?
11、请描述一下 cookies,sessionStorage 和 localStorage 的区别?
12、iframe有那些缺点?
13、Label的作用是什么?是怎么用的?(加 for 或 包裹)
14、HTML5的form如何关闭自动完成功能?
15、如何实现浏览器内多个标签页之间的通信? (阿里)
16、webSocket如何兼容低浏览器?(阿里)
17、页面可见性(Page Visibility)API 可以有哪些用途?
18、如何在页面上实现一个圆形的可点击区域?
19、实现不使用 border 画出1px高的线,在不同浏览器的Quirksmode和CSSCompat模式下都能保持同一效果。
20、网页验证码是干嘛的,是为了解决什么安全问题?
21、tite与h1的区别、b与strong的区别、i与em的区别?

二、css

1、介绍一下标准的CSS的盒子模型?与低版本IE的盒子模型有什么不同的?

2、CSS选择符有哪些?哪些属性可以继承?
3、CSS优先级算法如何计算?
4、CSS3新增伪类有那些?
5、如何居中div?如何居中一个浮动元素?如何让绝对定位的div居中?
6、display有哪些值?说明他们的作用。
7、position的值relative和absolute定位原点是?
8、CSS3有哪些新特性?
9、请解释一下CSS3的Flexbox(弹性盒布局模型),以及适用场景?
10、用纯CSS创建一个三角形的原理是什么?

11、一个满屏 品 字布局 如何设计?

三、常见兼容性问题?


  1. 1、li与li之间有看不见的空白间隔是什么原因引起的?有什么解决办法?
    2、经常遇到的浏览器的兼容性有哪些?原因,解决方法是什么,常用hack的技巧 ?
    3、为什么要初始化CSS样式。
    4、absolute的containing block计算方式跟正常流有什么不同?
    5、CSS里的visibility属性有个collapse属性值是干嘛用的?在不同浏览器下以后什么区别?
    6、position跟display、margin collapse、overflow、float这些特性相互叠加后会怎么样?
    7、对BFC规范(块级格式化上下文:block formatting context)的理解?
    8、CSS权重优先级是如何计算的?
    9、请解释一下为什么会出现浮动和什么时候需要清除浮动?清除浮动的方式
    10、移动端的布局用过媒体查询吗?
    11、使用 CSS 预处理器吗?喜欢那个?
    12、CSS优化、提高性能的方法有哪些?
    13、浏览器是怎样解析CSS选择器的?
    14、在网页中的应该使用奇数还是偶数的字体?为什么呢?
    15、margin和padding分别适合什么场景使用?
    16、抽离样式模块怎么写,说出思路,有无实践经验?[阿里航旅的面试题]
    17、元素竖向的百分比设定是相对于容器的高度吗?
    18、全屏滚动的原理是什么?用到了CSS的那些属性?
    19、什么是响应式设计?响应式设计的基本原理是什么?如何兼容低版本的IE?
    20、视差滚动效果,如何给每页做不同的动画?(回到顶部,向下滑动要再次出现,和只出现一次分别怎么做?)
    21、::before 和 :after中双冒号和单冒号 有什么区别?解释一下这2个伪元素的作用。
    22、如何修改chrome记住密码后自动填充表单的黄色背景 ?
    23、你对line-height是如何理解的?
    24、设置元素浮动后,该元素的display值是多少?(自动变成display:block)
    25、怎么让Chrome支持小于12px 的文字?
    26、让页面里的字体变清晰,变细用CSS怎么做?(-webkit-font-smoothing: antialiased;)
    27、font-style属性可以让它赋值为“oblique” oblique是什么意思?
    28、position:fixed;在android下无效怎么处理?
    29、如果需要手动写动画,你认为最小时间间隔是多久,为什么?(阿里)
    30、display:inline-block 什么时候会显示间隙?(携程)
    31、overflow: scroll时不能平滑滚动的问题怎么处理?
    32、有一个高度自适应的div,里面有两个div,一个高度100px,希望另一个填满剩下的高度。
    33、png、jpg、gif 这些图片格式解释一下,分别什么时候用。有没有了解过webp?
    34、什么是Cookie 隔离?(或者说:请求资源的时候不要让它带cookie怎么做)
    35、style标签写在body后与body前有什么区别?

    四、JavaScript

    1、介绍JavaScript的基本数据类型。
    2、说说写JavaScript的基本规范?
    3、JavaScript原型,原型链 ? 有什么特点?
    4、JavaScript有几种类型的值?(堆:原始数据类型和 栈:引用数据类型),你能画一下他们的内存图吗?
    5、Javascript如何实现继承?
    6、Javascript创建对象的几种方式?
    7、Javascript作用链域?
    8、谈谈This对象的理解。
    9、eval是做什么的?
    10、什么是window对象? 什么是document对象?
    11、null,undefined的区别?
    12、写一个通用的事件侦听器函数(机试题)。
    13、[“1”, “2”, “3”].map(parseInt) 答案是多少?
    14、关于事件,IE与火狐的事件机制有什么区别? 如何阻止冒泡?
    15、什么是闭包(closure),为什么要用它?
    16、javascript 代码中的”use strict”;是什么意思 ? 使用它区别是什么?
    17、如何判断一个对象是否属于某个类?
    18、new操作符具体干了什么呢?
    19、用原生JavaScript的实现过什么功能吗?
    20、Javascript中,有一个函数,执行时对象查找时,永远不会去查找原型,这个函数是?
    21、对JSON的了解?
    22、[].forEach.call($$("*"),function(a){ a.style.outline="1px solid #"+(~~(Math.random()*(1<<24))).toString(16) }) 能解释一下这段代码的意思吗?
    23、js延迟加载的方式有哪些?
    24、Ajax 是什么? 如何创建一个Ajax?
    25、同步和异步的区别?
    26、如何解决跨域问题?
    27、页面编码和被请求的资源编码如果不一致如何处理?
    28、模块化开发怎么做?
    29、AMD(Moles/Asynchronous-Definition)、CMD(Common Mole

    Definition)规范区别?
    30、requireJS的核心原理是什么?(如何动态加载的?如何避免多次加载的?如何 缓存的?)
    31、让你自己设计实现一个requireJS,你会怎么做?
    32、谈一谈你对ECMAScript6的了解?
    33、ECMAScript6 怎么写class么,为什么会出现class这种东西?
    34、异步加载的方式有哪些?
    35、documen.write和 innerHTML的区别?
    36、DOM操作——怎样添加、移除、移动、复制、创建和查找节点?
    37、.call() 和 .apply() 的含义和区别?
    38、数组和对象有哪些原生方法,列举一下?
    39、JS 怎么实现一个类。怎么实例化这个类
    40、JavaScript中的作用域与变量声明提升?
    41、如何编写高性能的Javascript?
    42、那些操作会造成内存泄漏?
    43、JQuery的源码看过吗?能不能简单概况一下它的实现原理?
    44、jQuery.fn的init方法返回的this指的是什么对象?为什么要返回this?
    45、jquery中如何将数组转化为json字符串,然后再转化回来?
    46、jQuery 的属性拷贝(extend)的实现原理是什么,如何实现深拷贝?
    47、jquery.extend 与 jquery.fn.extend的区别?
    48、jQuery 的队列是如何实现的?队列可以用在哪些地方?
    49、谈一下Jquery中的bind(),live(),delegate(),on()的区别?
    50、JQuery一个对象可以同时绑定多个事件,这是如何实现的?
    51、是否知道自定义事件。jQuery里的fire函数是什么意思,什么时候用?
    52、jQuery 是通过哪个方法和 Sizzle 选择器结合的?(jQuery.fn.find()进入Sizzle)
    53、针对 jQuery性能的优化方法?
    54、Jquery与jQuery UI有啥区别?
    55、JQuery的源码看过吗?能不能简单说一下它的实现原理?
    56、jquery 中如何将数组转化为json字符串,然后再转化回来?
    57、jQuery和Zepto的区别?各自的使用场景?
    58、针对 jQuery 的优化方法?
    59、Zepto的点透问题如何解决?
    60、jQueryUI如何自定义组件?
    61、需求:实现一个页面操作不会整页刷新的网站,并且能在浏览器前进、后退时正确响应。给出你的技术实现方案?
    62、如何判断当前脚本运行在浏览器还是node环境中?(阿里)
    63、移动端最小触控区域是多大?
    64、jQuery 的 slideUp动画 ,如果目标元素是被外部事件驱动, 当鼠标快速地连续触发外部元素事件, 动画会滞后的反复执行,该如何处理呢?
    65、把 Script 标签 放在页面的最底部的body封闭之前 和封闭之后有什么区别?浏览器会如何解析它们?
    66、移动端的点击事件的有延迟,时间是多久,为什么会有? 怎么解决这个延时?(click 有 300ms 延迟,为了实现safari的双击事件的设计,浏览器要知道你是不是要双击操作。)
    67、知道各种JS框架(Angular, Backbone, Ember, React, Meteor, Knockout…)么? 能讲出他们各自的优点和缺点么?
    68、Underscore 对哪些 JS 原生对象进行了扩展以及提供了哪些好用的函数方法?
    69、解释JavaScript中的作用域与变量声明提升?
    70、那些操作会造成内存泄漏?
    71、JQuery一个对象可以同时绑定多个事件,这是如何实现的?
    72、Node.js的适用场景?
    (如果会用node)知道route, middleware, cluster, nodemon, pm2, server-side rendering么?
    73、解释一下 Backbone 的 MVC 实现方式?
    74、什么是“前端路由”?什么时候适合使用“前端路由”? “前端路由”有哪些优点和缺点?
    75、知道什么是webkit么? 知道怎么用浏览器的各种工具来调试和debug代码么?
    76、如何测试前端代码么? 知道BDD, TDD, Unit Test么? 知道怎么测试你的前端工程么(mocha, sinon, jasmin, qUnit..)?
    77、前端templating(Mustache, underscore, handlebars)是干嘛的, 怎么用?
    78、简述一下 Handlebars 的基本用法?
    79、简述一下 Handlerbars 的对模板的基本处理流程, 如何编译的?如何缓存的?
    80、用js实现千位分隔符?(来源:前端农民工,提示:正则+replace)
    检测浏览器版本版本有哪些方式?
    81、我们给一个dom同时绑定两个点击事件,一个用捕获,一个用冒泡,你来说下会执行几次事件,然后会先执行冒泡还是捕获

㈥ web前端面试经常问到的面试题有哪些

Web前端经常被问到的面试题及答案

一、HTML+CSS

1.对WEB标准以及W3C的理解与认识

标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外
链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件,容易维
护、改版方便,不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性;

2.xhtml和html有什么区别

HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言

最主要的不同:

XHTML 元素必须被正确地嵌套。

XHTML 元素必须被关闭。

标签名必须用小写字母。

XHTML 文档必须拥有根元素。

3.Doctype? 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义?

用于声明文档使用那种规范(html/Xhtml)一般为 严格 过度 基于框架的html文档

加入XMl声明可触发,解析方式更改为IE5.5 拥有IE5.5的bug

4.行内元素有哪些?块级元素有哪些?CSS的盒模型?

块级元素:div p h1 h2 h3 h4 form ul

行内元素: a b br i span input select

Css盒模型:内容,border ,margin,padding

5.CSS引入的方式有哪些? link和@import的区别是?

内联 内嵌 外链 导入

区别 :同时加载

前者无兼容性,后者CSS2.1以下浏览器不支持

Link 支持使用javascript改变样式,后者不可

6.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高?

标签选择符 类选择符 id选择符

继承不如指定 Id>class>标签选择

后者优先级高

7.前端页面有哪三层构成,分别是什么?作用是什么?

结构层 Html 表示层 CSS 行为层 js

8.css的基本语句构成是?

选择器{属性1:值1;属性2:值2;……}

9.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?

Ie(Ie内核) 火狐(Gecko) 谷歌(webkit) opear(Presto)

二、Javascript

1.javascript的typeof返回哪些数据类型

Object number function boolean underfind

2.例举3种强制类型转换和2种隐式类型转换?

强制(parseInt,parseFloat,number)

隐式(== – ===)

3.split() join() 的区别

前者是切割成数组的形式,后者是将数组转换成字符串

4.数组方法pop() push() unshift() shift()

Push()尾部添加 pop()尾部删除

Unshift()头部添加 shift()头部删除

5.事件绑定和普通事件有什么区别

6.IE和DOM事件流的区别

1.执行顺序不一样、

2.参数不一样

3.事件加不加on

4.this指向问题

7.IE和标准下有哪些兼容性的写法

Var ev = ev || window.event

document.documentElement.clientWidth || document.body.clientWidth

Var target = ev.srcElement||ev.target

8.ajax请求的时候get 和post方式的区别

一个在url后面 一个放在虚拟载体里面

有大小限制

安全问题

应用不同 一个是论坛等只需要请求的,一个是类似修改密码的

9.call和apply的区别

Object.call(this,obj1,obj2,obj3)

Object.apply(this,arguments)

10.ajax请求时,如何解释json数据

使用eval parse 鉴于安全性考虑 使用parse更靠谱

11.b继承a的方法

12.写一个获取非行间样式的函数

function getStyle(obj,attr,value)

{

if(!value)

{

if(obj.currentStyle)

{

return obj.currentStyle(attr)

}

else

{

obj.getComputedStyle(attr,false)

}

}

else

{

obj.style[attr]=value

}

}

㈦ 前端面试官常问的问题有哪些

1、重绘和重排的关系:

重绘不会引起重排,但重排一定会引起重绘,一个元素的重排通常会带来一系列的反应,甚至触发整个文档的重排和重绘,性能代价是高昂的。

2、重绘的概念:

重绘是一个元素外观的改变所触发的浏览器行为,例如改变visibility、outline、背景色等属性。浏览器会根据元素的新属性重新绘制,使元素呈现新的外观。由于浏览器的流布局,对渲染树的计算通常只需要遍历一次就可以完成。

但table及其内部元素除外,它可能需要多次计算才能确定好其在渲染树中节点的属性值,比同等元素要多花两倍时间,这就是我们尽量避免使用table布局页面的原因之一。

3、触发重排的情况:

页面渲染初始化时;浏览器窗口改变尺寸;元素尺寸改变时;元素位置改变时;元素内容改变时;添加或删除可见的DOM元素时。

4、rex的缺点:

(1)一个组件所需要的数据,必须_父组件传过来,而不能像flux中直接从store取。

(2)当一个组件相关数据更新_,即使父组件不需要用到这个组件,父组件还是会重新render,可能会有效率影响,或者需要写复杂的shouldComponentUpdate进行判断。

5、对MVC和MVVM的理解:

(1)mvc:View传送指令到Controller Controller完成业务逻辑后,要求Model改变状态Model将新的数据发送到View,用户得到反馈所有通信都是单向的。Angular它采用双向绑定(data-binding):View的变动,自动反映在ViewModel,反之亦然。组成部分Model、View、ViewModel

(2)View:UI界面ViewModel:它是View的抽象,负责View与Model之间信息转换,将View的Command传送到Model;Model:数据访问层。

㈧ 前端常见面试题

前端开发可能问到的问题:
自我介绍(一定要对项目很熟悉)
ui-app web前端技术体系?

响应式怎么做?

render跟状态的差异
类组件的生命周期?
阻止冒泡,阻止事件默认行为
文本垂直居中。 line-height设置为元素高度。

用rece讲数组中的对象进行合并
解释localstorage sessionstorage cookie
eventbus满足event.on('eventname', callback)

display有几个值?默认值?
position有几个值?默认值?
div水平垂直居中?
position有哪些值

react相关问题(概念理解、通讯组件等)、react常用内置
React-router
html+css

页面增删改查

position的值 absolute relative fixed static

工作中是怎么联调和上线的(现场想合适的前后端联调方式,能和webpack环境切换联系起来)
antd的Form shouldUpdate增量更新方式,性能优化。
对Hooks的理解

3:操作dom点击事件向服务器上传数据,在上传未完成之前不可重复操作事件
4:日期格式化,日期不足前两位补0(2021-06-06 06:06:00)

用css写一个布局,左侧固定宽度,右侧自适应

你看

㈨ 面试web前端的工作,会被问到什么问题

在实际的面试中,你可能需要使用 JavaScript、CSS 和 HTML 来编写代码。在你的面试期间,你可能需要实现 UI、构建窗口小部件或使用 Lodash 和 Underscore.js 这样的库编写常用的实用程序函数。例如:构建常见的 Web 应用程序的布局和交互,例如类似 Netflix 网站那样的。实现小部件,如日期选择器、轮播或电子商务网站购物车。写一个类似 debounce 或深度 clone 对象的函数。