前端工程师职位理解:
a. 前端是最贴近用户的程序员,前端的能力就是能让产品从 90分进化到 100 分,甚至更好
b. 参与项目,快速高质量完成实现效果图,精确到1px;
c. 与团队成员,UI设计,产品经理的沟通;
d. 做好的页面结构,页面重构和用户体验;
e. 处理hack,兼容、写出优美的代码格式;
f. 针对服务器的优化、拥抱最新前端技术
每个面试都需要做充分的准备,面试建议从以下几个方面准备:
1、技术,这个是硬性要求。我们这边的技术栈 主要是react,可以重点准备react。当然 js、css等前端的基础 是最基本的东西。除此之外,要做一定的深度拓展,比如了解其实现原理。
2、沟通,要准备 自己所做过项目的的 项目背景、自己负责的模块、遇到的难题、自己解决了哪些问题。在沟通时 最好 1,2,3,4,。。这样逻辑清晰的表述【这点非常重要】
3、 自己的学习能力,技术的迭代很快,作为一名技术同学,对技术的追求必不可少。面试中最好体现自己有一定的学习能力。
F&Q: 面试过程中不必紧张,沟通时候逻辑要清晰,最好分条陈述,不懂的虚心问一下
以下面试题目必准备【只是部分,还需自己多准备】:
一、 js 、 css 基础,这一块自行准备
1、什么是盒子模型?
2、行内元素有哪些?块级元素有哪些? 空(void)元素有那些?
3、简述一下src与href的区别
4、什么是CSS Hack?
5、简述同步和异步的区别
6、px和em的区别
7、什么叫优雅降级和渐进增强
8、浏览器的内核分别是什么?
9、http 状态码,以及常见的状态码
10、怎样添加、移除、移动、复制、创建和查找节点?
createDocumentFragment() //创建一个DOM片段
createElement() //创建一个具体的元素
createTextNode() //创建一个文本节点
2)添加、移除、替换、插入
appendChild() //添加
removeChild() //移除
replaceChild() //替换
insertBefore() //插入
3)查找
getElementsByTagName() //通过标签名称
getElementsByName() //通过元素的Name属性的值
getElementById() //通过元素Id,唯一性
11、想实现一个对页面某个节点的拖曳?如何做?---使用原生JS
12、Javascript中callee和caller的作用?
13、请描述一下cookies,sessionStorage和localStorage的区别
14、数组快速排序
15、一次完整的HTTP事务是怎样的一个过程?
二、 react:
1、区分Real DOM和Virtual DOM
2、React有什么特点
3、列出React的一些主要优点
4、React有哪些限制
5、什么是JSX
6、你了解 Virtual DOM 吗?解释一下它的工作原理
7、与 ES5 相比,React 的 ES6 语法有何不同
8、你理解“在React中,一切都是组件”这句话
9、解释 React 中 render() 的目的
10、什么是 Props?
11、React中的状态是什么?它是如何使用的?
12、如何更新组件的状态?React 中的箭头函数是什么?怎么用?
13、React组件生命周期的阶段是什么,详细解释 React 组件的生命周期方法
14、React中的事件是什么
15、你对 React 的 refs 有什么了解,列出一些应该使用 Refs 的情况
16、什么是高阶组件(HOC)?你能用HOC做什么?你对受控组件和非受控组件了解多少?什么是纯组件?
17、React 中 key 的重要性是什么?
React Redux:
18、解释一下 Flux
19、什么是Redux?Redux遵循的三个原则是什么?
20、你对“单一事实来源”有什么理解?
21、列出 Redux 的组件
22、数据如何通过 Redux 流动
23、如何在 Redux 中定义 Action,解释 Reducer 的作用。Store 在 Redux 中的意义是什么?
24、Redux与Flux有何不同?
25、Redux 有哪些优点?
React 路由
26、什么是React 路由?
27、为什么React Router v4中使用 switch 关键字 ?
28、为什么需要 React 中的路由?
29、列出 React Router 的优点。
30、React Router与常规路由有何不同?
hooks
1、简单介绍下什么是hooks,hooks产生的背景?hooks的优点?
2、知道hoc和render props吗,它们有什么作用?有什么弊端?
3、Render Props
4、a. 什么是属性代理?b. 属性代理的用途
5、反向继承
6、你的项目中怎么使用的高阶组件
7、hooks和hoc和render props有什么不同?
8、介绍下常用的hooks
9、描述下hooks下怎么模拟生命周期函数,模拟的生命周期和class中的生命周期有什么区别吗
10、hooks中的坑,以及为什么
11、useState中的第二个参数更新状态和class中的this.setState区别
12、useEffect和useLayoutEffect区别
13、使用hooks实现自定义hooks, 一个计算组件从挂载到卸载的时间?