乐趣区

Web前端面试技术点

常规问题:
一般来说会问如下几方面的问题:

做过最满意的项目是什么?
项目背景
为什么要做这件事情?
最终达到什么效果?
你处于什么样的角色,起到了什么方面的作用?
在项目中遇到什么技术问题?具体是如何解决的?
如果再做这个项目,你会在哪些方面进行改善?

技术二面主要判断技术深度及广度

你最擅长的技术是什么?
你觉得你在这个技术上的水平到什么程度了?你觉得最高级别应该是怎样的?
浏览器及性能
一个页面从输入 URL 到页面加载完的过程中都发生了什么事情?越详细越好(这个问既考察技术深度又考察技术广度,其实要答好是相当难的,注意越详细越好)
谈一下你所知道的页面性能优化方法?
这些优化方法背后的原理是什么?
除了这些常规的,你还了解什么最新的方法么?
如何分析页面性能?
其它
除了前端以外还了解什么其它技术么?
对计算机基础的了解情况,比如常见数据结构、编译原理等

技术点沟通:
HTML+CSS
1、盒子模型,块级元素和行内元素特性与区别。2、行内块的使用,兼容性解决。3、清除浮动的方式以及各自的优劣。4、文档流的概念、定位的理解以及 z -index 计算规则 & 浏览器差异性。5、CSS 选择器以及优先级计算。6、常用的 CSS hack。7、遇到的兼容性问题与解决方法。8、垂直水平居中的实现方式。9、常用布局的实现(两列布局、三列适应布局,两列等高适应布局等)。

Javascript
1、犀牛书封面的犀牛属于神马品种?(蛋逼活跃气氛用。。。)2、常用的浏览器内核。3、常用的 DOM 操作,新建、添加、删除、移动、查找等。4、String 于 Array 常用方法。5、设备与平台监测。6、DOM 的默认事件、事件模型、事件委托、阻止默认事件、冒泡事件的方式等。7、jQuery 的 bind、live、on、delegate 的区别(考察点与上一条重叠,切入点不同)。8、JS 变量提升、匿名函数、原型继承、作用域、闭包机制等。9、对 HTTP 协议的理解。10、Ajax 的常用操作,JS 跨域的实现原理。

HTML:

语义标签
语义化

CSS:

动态居中
动画
Bootstrap 样式类
Preprocessor
兼容性 Hack 与特征检测
CSS3 属性与性能

JS:

Name hoisting
Prototype
Closure
Main loop
Promise
Delegation
Cross domain

Mobile:

渐进增强
移动端交互
兼容性问题
Debug 工具 方法

主体是看简历发挥,对方写什么就问什么为主:框架、库、浏览器工作原理、NLP、算法、HTTP… 
辅助问题几乎是我个人必备的问题:为什么做前端,学习前端过程。

1、跟什么人在一起工作 2、过去项目的挑战 3、自学的途径
3 个问题基本上就知道这个人的能力水平和瓶颈了,人的很多局限都是被环境限制的,通过闲聊中夹杂的不经意的问题,候选人的画像就已经很鲜明了。处于当前的环境多长时间,有没有突破环境限制的行动,就能评估出潜力和眼界。
什么浏览器兼容、作用域、框架等等的东西不会,不记得都可以学,要不了多长时间,关键还是有没有潜力、有没有好的习惯。

在能力方面:

对 HTML / CSS / JavaScript 具有专家级别的知识;
有较熟练使用 AngularJS / Ember.js / jQuery 或者其它类库的经验;
较熟悉第三方组件(插件)生态环境及具体案例;
有较熟练使用 Jade / Swig / Handlebars / Mustache 或者其它模板引擎的经验;
有较熟练使用 SASS 或者其它 CSS 预处理器的经验;
有较熟练使用 CoffeeScript 的经验;
对 CSS / JavaScript 设计模式有很好的认识及应用;
对常用数据结构和算法熟悉;
有使用 GruntJS / GulpJS 任务运行器的经验;
有使用 Yeoman 生成器的经验;
有诸如 Bower / Volo / JSPM 等前端静态资源包管理器使用经验;
熟悉本地及远程(甄姬)调试操作;
有 Git 的使用经验;

Q:简单介绍下 React / Vue 的生命周期
A:几个钩子函数基本能报出来(如果不讲究按顺序、按挂载 / 更新区分、能把单词用英文念出来并且念对的话),稍微深入一点问下各个阶段都做了什么,一半以上就“不太清楚”了。更有甚者我问 React,对方回答 created、mounted,提醒之后还觉得自己没错的。
Q:【React】定义一个组件时候,如何决定要用 Functional 还是 Class?
A:简单的用 Function,复杂的用 Class。(不能算错吧……但也不能算答到点子上)追问怎么界定“复杂”,答不上来。
Q:【React】HOC、(非)受控组件、shouldComponentUpdate、React 16 的变化
A:不清楚、没接触过。
Q:【Vue】介绍一下计算属性,和 data、methods、watch 的异同
A:基本都能巴拉一些,说的大部分都对,但就是说不到最关键的“当且仅当计算属性依赖的 data 改变时才会自动计算”。
Q:【Vue】为什么 SFC 里的 data 必须是一个函数返回的对象,而不能就只是一个对象?
A:我承认这个问题有点小难,有一定的区分度,不是每个人都有关注过,但是官方文档有说明这一点,但凡看过的肯定有印象。即便没完整看过文档,在初次学习的过程中难道就不觉得奇怪吗?“学而不思”的人和“学而思”的人,区别还是挺大的。
Q:CSS 选择器的权重
A:经典问题了吧?背都能背出来吧?伪类、伪元素分不清楚,只知道内联、!important、ID、Class 之间的顺序,加上其它的就懵了,而且只说谁大于谁,讲不出具体的计算方法。单层选择器比较还行,几个叠加起来就迷糊了。
Q:JS 有哪几种原始类型
A:基础题,能说上来几个,答不全,主要问题集中在 null 和 undefined 没考虑进去、对象和数组算不算原始类型、以及 Symbol 很多人不知道。
Q:ES 2015+ 有哪些新特性
A:这题可以说的很多,根据应聘者的回答去展开,可以很容易地看出应聘者有没有系统地学习过这方面的东西,以及有没有持续地去跟进语言标准的发展。但这一题能回答的比较好的,寥寥无几,大部分是遇到问题然后零零散散现学的,不够全面、也不够深入,简单用过,但稍微问点细节就只有“尴尬而不失礼仪的微笑”了。
Q:工程化工具的使用(Webpack、ESLint、Yarn、Git、……)
A:基本都有所接触,但只是“用过”,算不上“会用”,一切顺利还好,真遇到问题了,立马就懵。
Q:Node.js
A:写过 Demo 的水平。(比较初级)
Q:未来 1~2 年的职业规划、下一步最想学的技术、最希望往什么方向发展、怎么看待 XXX 技术
A:大部分人对自己没有一个明确的态度和规划。说白了就是还没从学校里出来,什么都等着别人来安排。
通用技能有哪些(请看如下图)?

退出移动版