前言

文章分享前端面试题，主要内容包括HTML相关、CSS相关、JavaScript相关、JQuery相关，数据请求相关，Vue相关、ES6相关，React相关、微信小程序相关等等。

HTML相关

• Doctype 的作用？
• 标准模式和怪异模式的区别：
• 行内元素/块级元素/空元素有哪些？
• 介绍一下你对浏览器内核的理解?
• 常用浏览器的内核有哪些？
• 浏览器是怎么对HTML5 的离线储存资源进行管理和加载的？
• 描述一下 cookies/sessionStorage 和localStorage 的区别?
• HTML5 新特性有哪些？如何处理 HTML5 新标签的兼容性问题？如何区分HTML 和 HTML5？
• 简述一下你对HTML 语义化的理解?
• HTML5 离线缓存怎么使用，工作原理能不能解释一下？
• 页面导入样式时,使用 link 和@import 有什么区别?
• Iframe 有哪些缺点?
• Label 的作用是什么？怎么用？
• HTML5 的 form 如何关闭自动完成功能?
• 如何实现浏览器内多个标签之间的通信?
• 页面可见性有哪些用途?
• …

CSS相关

• 浏览器盒模型?
• 清除浮动的方式
• CSS 选择器有哪些?
• 伪类选择器和伪元素的区别:
• ::after/:after 与::before/:before 的区别?
• CSS 样式优先级计算法:
• CSS3 新特性和伪类有哪些?
• less 的一些优势。
• 如何居中 div?
• Display 有哪些哪些值？说明他们的作用
• Position 的值?
• flex 布局以及常用属性
• 请解释一下 CSS3 的flexbox(弹性盒布局模型),以及适用场景?
• CSS 打造三角形?
• 满屏品字布局?
• li 与 li 之间有看不见的空白间隙是什么原因引起来的?
• 为什么要初始化css 样式?
• CSS 中的 visibility 属性的 collapse 属性是干嘛的?
• 外边距合并是指的什么意思?
• 移动端的布局用过媒体查询吗?
• 响应式页面?
• CSS 媒体查询的原理是什么？
• 使用CSS 预处理的优缺点分别是什么？
• CSS 优化/提高性能的方法有哪些?
• 浏览器是怎么解析CSS 选择器的?
• Margin 与 padding 的区别?
• CSS 如何实现横向滚动与竖向滚动?
• …

JavaScript相关

• JS 是一种什么样的语言?
• JS 数据类型有哪些?
• 介绍JS 有哪些内置对象？
• 栈与堆的区别?
• js 中的作用域与变量声明提升
• console.log（a）何时会打印 1？
• 如何转化类型?
• 什么是面向对象编程及面向过程编程，他们的异同和优缺点
• 面向对象编程思想
• 如何解释 this 在js 中起的作用?
• js 中 this 的用法
• 说说JS 原型和原型链
• call 和 apply 的区别和作用?
• 继承的方法有哪些？
• 什么是闭包？闭包有什么作用？
• 事件代理（事件委托）:
• 事件的各个阶段
• new 操作符在创建实例的时候经历了哪几个阶段
• 异步编程的实现方式
• 对原生JS 了解程度
• js 延迟加载的方法有哪些？
• 数组从小到大排序？
• 如何实现数组的随机排序？
• 图片懒加载
• js 中常见的内存泄漏：
• 深拷贝和浅拷贝的问题：
• 显示转换与隐式转换
• …

JQuery相关

• jQuery 或 zepto 源码有哪些写的好的地方
• jQuery 的实现原理？
• jQuery.fn 的init 方法返回的这指的是什么对象？为什么要返回这个？
• jQuery.extend 与jQuery.fn.extend 的区别？
• jQuery 的属性拷贝（extend）的实现原理是什么，如何实现深拷贝？
• JQuery 的队列是如何实现的？队列可以用在哪些地方?
• …

数据请求相关

• http 请求方式有哪些？
• http 的状态码有哪些？分别说下它们的含义
• 请描述一下 get 与 post 的区别
• get 请求传参长度的误区
• get 和post 请求在缓存方面的区别
• http 和https 有何区别？如何灵活使用？
• 什么是AJax?为什么使用Ajax?
• 简述ajax 的过程
• Ajax 优缺点？
• XMLHttpRequest 通用属性和方法
• Ajax 请求跨域接口，发送了几次请求？
• web 应用从服务器端主动推送data 大客户端有哪些方式?
• 如何实现浏览器内多个标签页之间的通信?
• webSocket 如何兼容低浏览器？
• fetch、ajax、axios 之间的详细区别以及优缺点：
• …

ES6相关

• 列举常用的 ES6 特性：
• 箭头函数需要注意哪些地方？
• 箭头函数和普通函数之间的区别
• let、const、var
• var 方式定义的变量有什么样的 bug？
• Set 数据结构
• 数组去重的方法
• 箭头函数 this 的指向
• 手写ES6 class 继承
• ES5 的继承和 ES6 的继承有什么区别?
• ES6 class 的new 实例和ES5 的new 实例有什么区别?
• generator 生成器函数
• 什么是async/await 及其如何工作?
• Promise 和async await 以及它们之间的区别:
• async 函数的基本用法:
• async 与 generator 的区别?
• 简单实现 async/await 中的 async 函数
• …

Vue相关

• 什么是MVVM?
• mvvm 和mvc 的区别？它和其他框架（JQuery）的区别是什么？哪些场景适合？
• Vue 的优点是什么？
• Vue.js 的两个核心是什么?
• Vue 组件之间6. Vue-cli 中怎么使用自定义组件，又遇到过哪些问题吗?
• Vue-cli 中怎么使用自定义组件，又遇到过哪些问题吗?
• Vue 如何实现按需加载配合webpack 设置
• v-show 和v-if 指令的共同点和不同点
• 如何让CSS 只在当前组件中起作用
• <keep-alive></keep-alive> 的作用是什么？
• 聊聊Keep-alive 的实现原理和缓存策略
• Vue 中引入组件的步骤
• Vue 常用的修饰符？
• 什么是Vue 的计算属性?
• Vue 等单页面应用及其优缺点？
• 指令v-el 的作用是什么?
• 在Vue 中使用插件的步骤
• active-class 是哪个组件的属性？
• 说出至少 4 中 vue 当中的指令和它的用法？
• 生命周期相关
• Vue-router
• Vuex
• …

React相关

• react 的优势以及特点
• react 中的props 和 state 的用法
• react 组件之间如何通信？
• 为什么虚拟 DOM 会提高性能？
• react 生命周期函数：
• react 性能优化是哪个周期函数？
• 在生命周期中的哪一步你应该发起AJAX 请求？
• 概述一下 React 中的事件处理逻辑
• 如何告诉 React 它应该编译生产环境版本？
• 调用setState 之后发生了什么？
• react 的 setState 的原理及用法
• setState 为什么是异步的?
• 传入setState 函数的第二个参数的作用是什么?
• PureComponent（纯组件）的重要性和使用场景
• react-router:
• redux：
• React Native：
• …

微信小程序

• . 简单描述一下微信小程序的相关文件类型?
• . 你是怎么封装微信小程序的数据请求？
• . 有哪些参数传值的方法？
• . 你使用过哪些方法，来提高微信小程序的应用速度？
• . 小程序和原生App 哪个好？
• . 简述微信小程序原理？
• . 怎么解决小程序的异步请求问题？
• . 小程序的双向绑定和vue 哪里不一样
• . 小程序的 wxss 和css 有哪些不一样的地方?
• …

由于篇幅有限，文章部分内容展示截图，需要前端面试题大全PDF完整版（含答案解析）可以【点击此处】免费领取！

更多