共计 7703 个字符，预计需要花费 20 分钟才能阅读完成。
本文是关注微信小程序的开发和面试问题，
由基础到困难循序渐进，
适合面试和开发小程序。
并总结 vue React html css js 经典面试题 集各种算法和插件、前端视频源码资源于一身的文档，优化项目，在浏览器端的层面上提升速度，帮助初中级前端工程师快速搭建项目。
参考答案https://www.kancloud.cn/lemon-m/js-html-css
Vue 面试题
| 生命周期函数面试题 | |
| 1. 什么是 vue 生命周期 | |
| 2.vue 生命周期的作用是什么 | |
| 3. 第一次页面加载会触发哪几个钩子 | |
| 4. 简述每个周期具体适合哪些场景 | |
| 5.created 和 mounted 的区别 | |
| 6.vue 获取数据在哪个周期函数 | |
| 7. 请详细说下你对 vue 生命周期的理解？vue 路由面试题 | |
| 1.mvvm 框架是什么？2.vue-router 是什么? 它有哪些组件 | |
| 3.active-class 是哪个组件的属性？4. 怎么定义 vue-router 的动态路由? 怎么获取传过来的值 | |
| 5.vue-router 有哪几种导航钩子? | |
| 6.$route 和 $router 的区别 | |
| 7.vue-router 响应路由参数的变化 | |
| 8.vue-router 传参 | |
| 9.vue-router 的两种模式 | |
| 10.vue-router 实现路由懒加载（动态加载路由）vue 常见面试题 | |
| 1.vue 优点 | |
| 2.vue 父组件向子组件传递数据？3. 子组件像父组件传递事件 | |
| 4.v-show 和 v -if 指令的共同点和不同点 | |
| 5. 如何让 CSS 只在当前组件中起作用 | |
| 6.<keep-alive></keep-alive> 的作用是什么? | |
| 7. 如何获取 dom | |
| 8. 说出几种 vue 当中的指令和它的用法？9. vue-loader 是什么？使用它的用途有哪些？10. 为什么使用 key | |
| 11.axios 及安装 | |
| 12.axios 解决跨域 | |
| 13.v-modal 的使用 | |
| 14.scss 的安装以及使用 | |
| 15. 请说出 vue.cli 项目中 src 目录每个文件夹和文件的用法？16. 分别简述 computed 和 watch 的使用场景 | |
| 17.v-on 可以监听多个方法吗 | |
| 18.$nextTick 的使用 | |
| 19.vue 组件中 data 为什么必须是一个函数 | |
| 20.vue 事件对象的使用 | |
| 21 组件间的通信 | |
| 22. 渐进式框架的理解 | |
| 23.Vue 中双向数据绑定是如何实现的 | |
| 24. 单页面应用和多页面应用区别及优缺点 | |
| 25.vue 中过滤器有什么作用及详解 | |
| 26.v-if 和 v -for 的优先级 | |
| 27.assets 和 static 的区别 | |
| 28. 列举常用的指令 | |
| 29.vue 常用的修饰符 | |
| 30. 数组更新检测 | |
| 31.Vue.set 视图更新 | |
| 32. 自定义指令详解 | |
| 33.vue 的两个核心点 | |
| 34.vue 和 jQuery 的区别 | |
| 35 引进组件的步骤 | |
| 36.Vue-cli 打包命令是什么？打包后悔导致路径问题，应该在哪里修改 | |
| 37. 三大框架的对比 | |
| 38. 跨组件双向数据绑定 | |
| 39.delete 和 Vue.delete 删除数组的区别 | |
| 40.SPA 首屏加载慢如何解决 | |
| 41.Vue-router 跳转和 location.href 有什么区别 | |
| 42. vue slot | |
| 43. 你们 vue 项目是打包了一个 js 文件，一个 css 文件，还是有多个文件？44.vue 遇到的坑，如何解决的？45.Vue 里面 router-link 在电脑上有用，在安卓上没反应怎么解决？46.Vue2 中注册在 router-link 上事件无效解决方法 | |
| 47.RouterLink 在 IE 和 Firefox 中不起作用（路由不跳转）的问题 | |
| 48.axios 的特点有哪些 | |
| 49. 请说下封装 vue 组件的过程？vuex 常见面试题 | |
| 1.vuex 是什么？怎么使用？哪种功能场景使用它？2.vuex 有哪几种属性 | |
| 3. 不使用 Vuex 会带来什么问题 | |
| 4.Vue.js 中 ajax 请求代码应该写在组件的 methods 中还是 vuex 的 actions 中？5.vuex 一个例子方法 | |
| 6.Vuex 中如何异步修改状态 | |
| 7.Vuex 中 actions 和 mutations 的区别 |
ES6 面试题
| ES6 新增方法面试题 | |
| 1.let const var 比较 | |
| 2. 反引号（`）标识 | |
| 3. 函数默认参数 | |
| 4. 箭头函数 | |
| 5. 属性简写 | |
| 6. 方法简写 | |
| 7.Object.keys()方法，获取对象的所有属性名或方法名 | |
| 8.Object.assign ()原对象的属性和方法都合并到了目标对象 | |
| 9.for...of 循环 | |
| 10.import 和 export | |
| 11.Promise 对象 | |
| 12. 解构赋值 | |
| 13.set 数据结构（可用于快速去重）14.Spread Operator 展开运算符(...) | |
| 15. 字符串新增方法 | |
| ES6 数组面试题 | |
| 1.forEach() | |
| 2.map() | |
| 3.filter() | |
| 4.reduce() | |
| 5.some() | |
| 6.every() | |
| 7.all()方法 | |
| ES6 编程题 | |
| 1. 使用解构，实现两个变量的值的交换 | |
| 2. 利用数组推导，计算出数组 [1,2,3,4] 每一个元素的平方并组成新的数组。3. 使用 ES6 改下面的模板 | |
| 4. 把以下代码使用两种方法，来依次输出 0 到 9？ |
react 面试题
| react 生命周期面试题 | |
| 1.react 生命周期函数 | |
| 2.react 生命周期中，最适合与服务端进行数据交互的是哪个函数 | |
| 3. 运行阶段生命周期调用顺序 | |
| 4.shouldComponentUpdate 是做什么的，（react 性能优化是哪个周期函数？）5. 指出 (组件) 生命周期方法的不同 | |
| react 基础面试题 | |
| 1.React 中 keys 的作用是什么？2.React 中 refs 的作用是什么？3.React 中有三种构建组件的方式 | |
| 4. 调用 setState 之后发生了什么？5.react diff 原理（常考，大厂必考）6. 为什么建议传递给 setState 的参数是一个 callback 而不是一个对象 | |
| 7. 除了在构造函数中绑定 this，还有其它方式吗 | |
| 8.setState 第二个参数的作用 | |
| 9.(在构造函数中)调用 super(props) 的目的是什么 | |
| 10. 简述 flux 思想 | |
| 11. 在 React 当中 Element 和 Component 有何区别？12. 描述事件在 React 中的处理方式。13.createElement 和 cloneElement 有什么区别？14. 如何告诉 React 它应该编译生产环境版本？15.Controlled Component 与 Uncontrolled Component 之间的区别是什么？react 组件面试题 | |
| 1. 展示组件 (Presentational component) 和容器组件 (Container component) 之间有何不同 | |
| 2. 类组件 (Class component) 和函数式组件 (Functional component) 之间有何不同 | |
| 3.(组件的)状态 (state) 和属性 (props) 之间有何不同 | |
| 4. 何为受控组件(controlled component) | |
| 5. 何为高阶组件(higher order component) | |
| 6. 应该在 React 组件的何处发起 Ajax 请求 | |
| 7.react 中组件传值 | |
| 8. 什么时候在功能组件 (Class Component) 上使用类组件(Functional Component)？9. 受控组件 (controlled component) 与不受控制的组件 (uncontrolled component) 有什么区别？10.react 组件的划分业务组件技术组件？redux 面试题 | |
| 1.redux 中间件 | |
| 2.redux 有什么缺点 | |
| 3. 了解 redux 么，说一下 redux 把 | |
| react 性能比较面试题 | |
| 1.vue 和 react 的区别 | |
| 2.react 性能优化的方案 | |
| 3.React 项目用过什么脚手架 | |
| 4. 介绍一下 webpack webpack | |
| 5. 如果你创建了类似于下面的 Twitter 元素，那么它相关的类定义是啥样子的？6. 为什么我们需要使用 React 提供的 Children API 而不是 JavaScript 的 map？ |
js 面试题
| 1. 简述同步和异步的区别 | |
| 2. 怎么添加、移除、复制、创建、和查找节点 | |
| 3. 实现一个函数 clone 可以对 Javascript 中的五种主要数据类型（Number、string、Object、Array、Boolean）进行复制 | |
| 4. 如何消除一个数组里面重复的元素 | |
| 5. 写一个返回闭包的函数 | |
| 6. 使用递归完成 1 到 100 的累加 | |
| 7.Javascript 有哪几种数据类型 | |
| 8. 如何判断数据类型 | |
| 9.console.log(1+'2')和 console.log(1-'2')的打印结果 | |
| 10.Js 的事件委托是什么，原理是什么 | |
| 11. 如何改变函数内部的 this 指针的指向 | |
| 12. 列举几种解决跨域问题的方式，且说明原理 | |
| 13. 谈谈垃圾回收机制的方式及内存管理 | |
| 14. 写一个 function，清除字符串前后的空格 | |
| 15.js 实现继承的方法有哪些 | |
| 16. 判断一个变量是否是数组，有哪些办法 | |
| 17.let，const，var 有什么区别 | |
| 18. 箭头函数与普通函数有什么区别 | |
| 19. 随机取 1 -10 之间的整数 | |
| 20.new 操作符具体干了什么 | |
| 21.Ajax 原理 | |
| 22. 模块化开发怎么做 | |
| 23. 异步加载 Js 的方式有哪些 | |
| 24.xml 和 json 的区别 | |
| 25.webpack 如何实现打包的 | |
| 26. 常见 web 安全及防护原理 | |
| 27. 用过哪些设计模式 | |
| 28. 为什么要同源限制 | |
| 29.offsetWidth/offsetHeight,clientWidth/clientHeight 与 scrollWidth/scrollHeight 的区别 | |
| 30.javascript 有哪些方法定义对象 | |
| 31. 说说你对 promise 的了解 | |
| 32. 谈谈你对 AMD、CMD 的理解 | |
| 33.web 开发中会话跟踪的方法有哪些 | |
| 34. 介绍 js 有哪些内置对象？35. 说几条写 JavaScript 的基本规范？36.javascript 创建对象的几种方式？37.eval 是做什么的？38.null，undefined 的区别？39.[“1”,“2”,“3”].map(parseInt) 答案是多少？40.javascript 代码中的”use strict”; 是什么意思 ? 使用它区别是什么？41.js 延迟加载的方式有哪些？42.defer 和 async | |
| 43. 说说严格模式的限制 | |
| 44.attribute 和 property 的区别是什么？45.ECMAScript6 怎么写 class 么，为什么会出现 class 这种东西? | |
| 46. 常见兼容性问题 | |
| 47. 函数防抖节流的原理 | |
| 48. 原始类型有哪几种？null 是对象吗？49. 为什么 console.log(0.2+0.1==0.3) //false | |
| 50. 说一下 JS 中类型转换的规则？51. 深拷贝和浅拷贝的区别？如何实现 | |
| 52. 如何判断 this？箭头函数的 this 是什么 | |
| 53.== 和 === 的区别 | |
| 54. 什么是闭包 | |
| 55.JavaScript 原型，原型链 ? 有什么特点？56.typeof()和 instanceof()的用法区别 | |
| 57. 什么是变量提升 | |
| 58.all、apply 以及 bind 函数内部实现是怎么样的 | |
| 59. 为什么会出现 setTimeout 倒计时误差？如何减少 | |
| 60. 谈谈你对 JS 执行上下文栈和作用域链的理解 | |
| 61.new 的原理是什么？通过 new 的方式创建对象和通过字面量创建有什么区别？62.prototype 和 proto 区别是什么？63. 使用 ES5 实现一个继承？64. 取数组的最大值（ES5、ES6）65.ES6 新的特性有哪些？66.promise 有几种状态, Promise 有什么优缺点 ? | |
| 67.Promise 构造函数是同步还是异步执行，then 呢 ?promise 如何实现 then 处理 ? | |
| 68.Promise 和 setTimeout 的区别 ? | |
| 69. 如何实现 Promise.all ? | |
| 70. 如何实现 Promise.finally ? | |
| 71. 如何判断 img 加载完成 | |
| 72. 如何阻止冒泡？73. 如何阻止默认事件？74.ajax 请求时，如何解释 json 数据 | |
| 75.json 和 jsonp 的区别? | |
| 76. 如何用原生 js 给一个按钮绑定两个 onclick 事件？77. 拖拽会用到哪些事件 | |
| 78.document.write 和 innerHTML 的区别 | |
| 79.jQuery 的事件委托方法 bind、live、delegate、on 之间有什么区别？80. 浏览器是如何渲染页面的？81.$(document).ready()方法和 window.onload 有什么区别？82. jquery 中 $.get()提交和 $.post()提交有区别吗？83. 对前端路由的理解？前后端路由的区别？84. 手写一个类的继承 | |
| 85.XMLHttpRequest：XMLHttpRequest.readyState; 状态码的意思 |
浏览器 /html/css 面试题
| 1. 什么是盒模型 | |
| 2. 行内元素有哪些？块级元素有哪些？空 (void) 元素有那些？行内元素和块级元素有什么区别？3. 简述 src 和 href 的区别 | |
| 4. 什么是 css Hack | |
| 5. 什么叫优雅降级和渐进增强 | |
| 6.px 和 em 的区别 | |
| 7.HTML5 为什么只写 <!DOCTYPE HTML> | |
| 8.Http 的状态码有哪些 | |
| 9. 一次完整的 HTTP 事务是怎么一个过程 | |
| 10.HTTPS 是如何实现加密 | |
| 11. 浏览器是如何渲染页面的 | |
| 12. 浏览器的内核有哪些？分别有什么代表的浏览器 | |
| 13. 页面导入时，使用 link 和 @import 有什么区别 | |
| 14. 如何优化图像，图像格式的区别 | |
| 15. 列举你了解 Html5. Css3 新特性 | |
| 16. 可以通过哪些方法优化 css3 animation 渲染 | |
| 17. 列举几个前端性能方面的优化 | |
| 18. 如何实现同一个浏览器多个标签页之间的通信 | |
| 19. 浏览器的存储技术有哪些 | |
| 20.css 定位方式 | |
| 21. 尽可能多的写出浏览器兼容性问题 | |
| 22. 垂直上下居中的方法 | |
| 23. 响应式布局原理 | |
| 25. 清除浮动的方法 | |
| 26.http 协议和 tcp 协议 | |
| 27. 刷新页面，js 请求一般会有哪些地方有缓存处理 | |
| 28. 如何对网站的文件和资源进行优化 | |
| 29. 你对网页标准和 W3C 重要性的理解 | |
| 30.Http 和 https 的区别 | |
| 31.data- 属性的作用 | |
| 32. 如何让 Chrome 浏览器显示小于 12px 的文字 | |
| 33. 哪些操作会引起页面回流（Reflow）34.CSS 预处理器的比较 less sass | |
| 35. 如何实现页面每次打开时清除本页缓存 | |
| 36. 什么是 Virtual DOM, 为何要用 Virtual DOM | |
| 37. 伪元素和伪类的区别 | |
| 38.http 的几种请求方法和区别 | |
| 39. 前端需要注意哪些 SEO | |
| 40.<img> 的 title 和 alt 有什么区别 | |
| 41. 从浏览器地址栏输入 url 到显示页面的步骤 | |
| 42. 如何进行网站性能优化 | |
| 43. 语义化的理解 | |
| 44.HTML5 的离线储存怎么使用，工作原理能不能解释一下？45. 浏览器是怎么对 HTML5 的离线储存资源进行管理和加载的呢 | |
| 46.iframe 有那些缺点？47.WEB 标准以及 W3C 标准是什么? | |
| 48.Doctype 作用? 严格模式与混杂模式如何区分？它们有何意义? | |
| 49.HTML 全局属性 (global attribute) 有哪些 | |
| 50.Canvas 和 SVG 有什么区别？51. 如何在页面上实现一个圆形的可点击区域？52. 网页验证码是干嘛的，是为了解决什么安全问题 | |
| 53. 请描述一下 cookies，sessionStorage 和 localStorage 的区别？ |
微信小程序开发（持续更新）
| 初识小程序 | |
| 1. 注册小程序 | |
| 2. 微信开发者工具 | |
| 3. 小程序与普通网页开发的区别 | |
| 4. 小程序尺寸单位 rpx | |
| 5. 样式导入（WeUI for）6. 选择器 | |
| 7. 小程序 image 高度自适应及裁剪问题 | |
| 8. 微信小程序长按识别二维码 | |
| 9. 给页面加背景色 | |
| 10. 微信小程序获取用户信息 | |
| 11. 代码审核和发布 | |
| 12. 小程序微信认证 | |
| 13. 小程序申请微信支付 | |
| 14. 小程序的目录解构及四种文件类型 | |
| 15. 小程序文件的作用域 | |
| 16. 小程序常用组件 | |
| 1.view | |
| 2.scroll-view | |
| 3.swiper 组件 | |
| 4.movable-view | |
| 5.cover-view | |
| 6.cover-image | |
| 小程序基础 | |
| 17. 授权得到用户信息 | |
| 18. 数据绑定 | |
| 19. 列表渲染 | |
| 20. 条件渲染 | |
| 21. 公共模板建立 | |
| 22. 事件及事件绑定 | |
| 23. 引用 | |
| 24. 页面跳转 | |
| 1.wx.switchTab | |
| 2.wx.reLaunch | |
| 3.wx.redirectTo | |
| 4.wx.navigateTo | |
| 5.wx.navigateBack | |
| 25. 设置 tabBar | |
| 26. 页面生命周期 | |
| 27. 转发分享 | |
| 小程序高级 | |
| 28.request 请求后台接口 | |
| 29.http-promise 封装 | |
| 30.webview | |
| 31. 获取用户收货地址 | |
| 32. 获取地里位置 | |
| 33. 自定义组件 | |
| 34. 微信小程序支付问题 | |
| 小程序项目实战 | |
| 35. 微信小程序本地数据缓存 | |
| 36. 下拉刷新和下拉加载 | |
| 37. 列表页向详情页跳转（动态修改 title）38. 客服电话 | |
| 39. 星级评分组件 | |
| 40. 小程序插槽的使用 slot | |
| 41. 模糊查询 | |
| 42.wxs 过滤 | |
| 43. 小程序动画 | |
| 44. 列表根据索引值渲染 | |
| 45. 小程序动态修改 class | |
| 46. 小程序常用框架 | |
| 47. 参数传值的方法 | |
| 48. 提高小程序的应用速度 | |
| 49. 微信小程序的优劣势 | |
| 50. 小程序的双向绑定和 vue 的区别 | |
| 51. 微信小程序给按钮添加动画 | |
| 52. 微信小程序的 tab 按钮的转换 | |
| 53. 微信小程序引进 echarts | |
| 54.APP 打开小程序流程 | |
| 55. 小程序解析富文本编辑器 | |
前端资源
| 1.vue 教学视频 | |
| 01.Vue 电商 实战 | |
| 02.Vue 实战 | |
| 03.vue.js 音乐播放器实战 | |
| 04.vue 新闻客户端实战 | |
| 05. vue 实战 团购网 | |
| 06.vue 实战 移动端音乐 App | |
| 07. vue+Node.js+MongoDB 全栈打造商城系统 | |
| 08.Vue+Node+MongoDB 高级全栈 | |
| 09.vue.js 外卖实战 | |
| 10. 其他培训机构 vue 教学视频 | |
| 2. 微信小程序开发视频 | |
| 01. 2018 最新小程序开发教程 | |
| 02.Java 仿抖音项目实战 | |
| 03.mpvue 小程序开发实战 | |
| 04. 微信小游戏入门开发与实战 | |
| 05. 最新豆瓣电影 + 贪吃蛇项目 | |
| 06. 服务器部署 +SSL 证书安装教程 | |
| 07. 后台讲解单独 | |
| 08. 小程序 APi 教程 | |
| 09. 零基础开始搭建微信小程序 CMS 后台教程 | |
| 10. 企业类小程序开发实战视频教程 | |
| 11. 微信小程序组价化开发视频教程 | |
| 12.ThinkPHP5.0+ 小程序商城构建全栈应用 | |
| 13.Vue.js 后台接口微信小程序入门与项目实战教程 | |
| 14.Node.js 快速开发微信公众号视频教程 | |
| 3.Linux 教学视频 |
| 4.349 套自适应模板 | |
| 5. 黑马 python 全课程讲解 |
6. 你不知道的 js 电子书
7.PHP 课程全讲解
8. 珠峰培训视频
9. 小甲鱼零基础入门 python
10. 机器学习
11.React 视频学习资源
前端算法
| js 算法（基础）数组去重 | |
| 冒泡排序 | |
| 快速排序 | |
| 递归 | |
| 算法进阶（趣味）数组输出 A[i]*i | |
| 二进制求 1 有多少个 | |
| 快速求最大值最小值 | |
| reduce 累加器 | |
| 快速反转 | |
| 数组旋转 | |
| 二分查找 | |
| 高阶函数接收 | |
| 冒泡排序（高级）保留前三后四位字符（手机号 * 格式） |
工作中常用插件
| 轮播图插件 swiper | |
| 二级城市插件 | |
| 三级城市插件 | |
| SuperSlide（文字滑动效果）手风琴效果（纯 js）视频播放插件 | |
| 弹层插件 | |
| 百度编辑器（大型）ACE 编辑器（轻巧）上传图片（裁剪功能）页面加载效果插件（初次加载）全选、反全选各种效果 | |
| 京东楼层效果 | |
| 懒加载 |
正文完
发表至： javascript
2019-04-29
