350页前端校招面试题直击大厂：前端基础、前端核心、计算机基础、项目、Hr面...

桃扇骨 2023-01-15 12:27 123阅读 0赞

## 前言 ##

考虑到关注的小伙伴们也会有在校生或应届生，要参加校招的同学，一直挺想总结一些关于校招面试题，赶在春招结束前终于写完了，除了写到前端方面的面试题外，项目、职业发展、H面等高频问题也会有，写的很详细，全方面做好准备，为同学们的校招保驾护航！

## 目录 ##

**1.HTML  
2.CSS  
3.前端基础  
4.前端核心  
5.前端进阶  
6.移动端开发  
7.计算机基础  
8.算法与数据结构  
9.设计模式  
10.项目  
11.职业发展  
12.Hr面**

## 正文 ##

### HTML ###

1.浏览器页面有哪三层构成，分别是什么，作用是什么?  
2.HTML5的优点与缺点？  
3.Doctype作用? 严格模式与混杂模式如何区分？它们有何意义?  
4.HTML5有哪些新特性、移除了哪些元素？  
5.你做的网页在哪些浏览器测试过,这些浏览器的内核分别是什么?  
6.每个HTML文件里开头都有个很重要的东西，Doctype，知道这是干什么的吗？  
7.说说你对HTML5认识?（是什么,为什么）  
8.对WEB标准以及W3C的理解与认识?  
9.HTML5行内元素有哪些,块级元素有哪些, 空元素有哪些?  
10.什么是WebGL,它有什么优点?  
11.请你描述一下 cookies，sessionStorage 和 localStorage 的区  
12.说说你对HTML语义化的理解?  
13.link和@import的区别?  
14.说说你对SVG理解?  
15.HTML全局属性(global attribute)有哪些?

![HTML][]

### CSS ###

1.解释一下CSS的盒子模型？  
2.请你说说CSS选择器的类型有哪些，并举几个例子说明其用法？  
3.请你说说CSS有什么特殊性?（优先级、计算特殊值）  
4.要动态改变层中内容可以使用的方法？  
5.常见浏览器兼容性问题与解决方案？  
6.列出display的值并说明他们的作用？  
7.如何居中div, 如何居中一个浮动元素?  
8.CSS中 link 和@import 的区别是？  
9.请列举几种清除浮动的方法(至少两种)?  
10.block，inline和inlinke-block细节对比？

![CSS][]

### 前端基础 ###

1.说一下http和https  
2.tcp三次握手，一句话概括  
3.TCP和UDP的区别  
4.WebSocket的实现和应用  
5.HTTP请求的方式，HEAD方式  
6.一个图片url访问后直接下载怎样实现？  
7.说一下web Quality（无障碍）  
8.几个很实用的BOM属性对象方法?  
9.说一下HTML5 drag api  
10.说一下http2.0

![前端基础][a22dbf6c6c80b5f387f5e839d0e314cd.png]

### 前端核心 ###

1.JSONP的缺点  
2.跨域（jsonp，ajax）  
3.如何实现跨域  
4.dom是什么，你的理解？  
5.关于dom的api有什么  
6.ajax返回的状态  
7.实现一个Ajax  
8.如何实现ajax请求，假如我有多个请求，我需要让这些ajax请求按照某种顺序一次执行，有什么办法

![前端核心][a820064912db7932066a585da30afdc4.png]

### 前端进阶 ###

1.前端测试  
2.接口文档  
3.webpack和gulp区别（模块化与流的区别）  
4.redux用处  
5.redux里常用方法  
6.redux里常用方法  
7.vue双向绑定原理  
8.说说vue react angularjs jquery的区别

![前端进阶][4f394412807e48e4910e3be99cdcb3da.png]

### 移动开发 ###

1.介绍一下react  
2.React单项数据流  
3.react生命周期函数和react组件的生命周期  
4.react和Vue的原理，区别，亮点，作用  
5.reactJs的组件交流  
6.有了解过react的虚拟DOM吗，虚拟DOM是怎么对比的呢  
7.项目里用到了react，为什么要选择react，react有哪些好处  
8.怎么获取真正的dom

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl81MjU0NjUyMg_size_16_color_FFFFFF_t_70][]

### 计算机基础 ###

1.TCP建立连接的三次握手过程  
2.cdn原理  
3.HTTP的头部包含哪些内容。常见的请求方法（我为什么要说后面的options，head，conn  
4.请求方法head特性  
5.HTTP状态码，301和302有什么具体区别，200和304 的区别  
6.OSI七层模型  
7.TCP和UDP的区别，为什么三次握手四次挥手  
8.HTTP缓存机制

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl81MjU0NjUyMg_size_16_color_FFFFFF_t_70 1][]

### 算法与数据结构 ###

1.二叉树层序遍历  
2.B树的特性，B树和B+树的区别  
3.尾递归  
4.如何写一个大数阶乘？递归的方法会出现什么问题？  
5.把多维数组变成一维数组的方法  
6.知道的排序算法 说一下冒泡快排的原理  
7.Heap排序方法的原理？复杂度？  
8.几种常见的排序算法，手写

![算法与数据结构.png][.png]

### 项目 ###

1.介绍一个做过的项目  
2.遇到的难题，怎么解决  
3.简单的自我介绍  
4.项目的同源处理，跨越相关  
5.遇到过什么安全问题，怎么解决的  
6.让你带领一个小团队完成一个项目，我会怎么做？  
7.前端的项目如何进行优化，移动端呢  
8.项目中使用了iframe，说说iframe的优缺点

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl81MjU0NjUyMg_size_16_color_FFFFFF_t_70 2][]

### 职业发展 ###

1.介绍一下前端的学习经历  
2.作为一个专业的前端，你觉得应该掌握哪些知识  
3.什么时候接触前端  
4.大学学过哪些编程的课  
5.对未来三年职业的规划  
6.你一般是通过什么方式学习前端的？  
7.你还有什么我没问到的优势吗  
8.看过什么书

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl81MjU0NjUyMg_size_16_color_FFFFFF_t_70 3][]

### HR面 ###

1.自我介绍  
2.为什么要学习前端  
3.到现在为止接触过几个项目，有在哪里实习过？  
4.让你收获最多的项目，你做了什么？

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl81MjU0NjUyMg_size_16_color_FFFFFF_t_70 4][]

**篇幅有限原因，题目和解析没有全部发出来，需要以上完整学习笔记PDF的，[请点击这里就可以领取啦][Link 1]**

面试题小编以文档形式整理出来了，前端的学习视频小编发到了b站，视频有前端入门到精通、零基础带你完成小程序实战项目等，小伙伴们搜“焖豆不闷”就可以关注和观看啦。感谢小伙伴们的支持！

[HTML]: /images/20221022/03a26ce442844384a99094000d86906b.png
[CSS]: /images/20221022/cd05380cebee46f381d322201d4df6e4.png
[a22dbf6c6c80b5f387f5e839d0e314cd.png]: /images/20221022/86ce9bc454384a4d80fb0dcf54ccf08c.png
[a820064912db7932066a585da30afdc4.png]: /images/20221022/a9793af0cc5c41b489297667769aa4cd.png
[4f394412807e48e4910e3be99cdcb3da.png]: /images/20221022/f7bd90cb60bc430196c680bb1aadeea0.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl81MjU0NjUyMg_size_16_color_FFFFFF_t_70]: /images/20221022/e2e1de4757df4c21b360ed0b3721d55a.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl81MjU0NjUyMg_size_16_color_FFFFFF_t_70 1]: /images/20221022/3b4dd39e2d5d4010b1228c0fd9da0234.png
[.png]: /images/20221022/2fd79c043167433985f0fe382602180b.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl81MjU0NjUyMg_size_16_color_FFFFFF_t_70 2]: /images/20221022/2c59a07e9c6a42d6a48cffeb3333646c.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl81MjU0NjUyMg_size_16_color_FFFFFF_t_70 3]: /images/20221022/5364ee024a014195831ed0d73990caf7.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl81MjU0NjUyMg_size_16_color_FFFFFF_t_70 4]: /images/20221022/61d4be9a470d46cfa6911493377123c3.png
[Link 1]: https://jq.qq.com/?_wv=1027&k=is9qe1g4