面试题 - 技术基础

Sokeer
239 阅读14分钟

技术基础：各个知识点的储备、掌握程度。
关键词：作用、api、语法、最佳实践 ==> 原理、手写、源码。
自检：概念是否清晰？是否理解、记住？是否熟练使用？

1. 三大基础

html

  • <img>的title和alt有什么区别？
  • 语义化的理解
  • html5有哪些新特性、移除了那些元素？
  • HTML和HTML5有什么区别？
  • HTML5 为什么只需要写 < !DOCTYPE HTML >？
  • 简述一下src与href的区别。
  • title与h1的区别、b与strong的区别、i与em的区别
  • HTML5离线储存 manifest 怎么使用？工作原理能不能解释一下？
  • 浏览器是怎么对HTML5的离线储存资源进行管理和加载的呢?
  • iframe有那些缺点？
  • WEB标准以及W3C标准是什么?
  • Doctype作用? 严格模式与混杂模式如何区分？它们有何意义?
  • 行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？行内元素和块级元素有什么区别？
  • HTML全局属性(global attribute)有哪些？
  • Canvas和SVG有什么区别？
  • viewport
  • 知道的网页制作会用到的图片格式有哪些？
  • defer和async

css

  • 怎样处理 移动端 1px 被 渲染成 2px问题?
  • div+css的布局较table布局有什么优点？
  • css sprite是什么?有什么优缺点?
  • display: none;、visibility: hidden;、opacity: 0的区别
  • link与@import的区别
  • 什么是FOUC?如何避免
  • 如何创建块级格式化上下文(block formatting context),BFC有什么用?
  • display、float、position的关系
  • 清除浮动的几种方式，各自的优缺点?
  • 为什么要初始化CSS样式?
  • css3有哪些新特性?
  • display有哪些值？说明他们的作用
  • 介绍一下标准的CSS的盒子模型？低版本IE的盒子模型有什么不同的？
  • CSS选择符有哪些？哪些属性可以继承
  • CSS优先级算法如何计算？
  • css样式（选择器）的优先级
  • 对BFC规范的理解？
  • 谈谈浮动和清除浮动
  • display:inline-block 什么时候不会显示间隙？
  • display:inline-block 什么时候会显示间隙?
  • PNG\GIF\JPG的区别及如何选？
  • 行内元素float:left后是否变为块级元素？
  • ::before 和 :after中双冒号和单冒号 有什么区别？解释一下这2个伪元素的作用
  • 伪元素和伪类的区别和作用？
  • ::before 和 :after 中双冒号和单冒号有什么区别？
  • css 属性 content 有什么作用？
  • 如果需要手动写动画，你认为最小时间间隔是多久，为什么？
  • CSS合并方法 @import
  • CSS不同选择器的权重(CSS层叠的规则)
  • 列出你所知道可以改变页面布局的属性
  • CSS在性能优化方面的实践
  • CSS优化、提高性能的方法有哪些？
  • CSS3动画（简单动画的实现，如旋转等） 说一说css3的animation
  • base64的原理及优缺点
  • 几种常见的CSS布局
  • stylus/sass/less区别?
  • postcss的作用
  • 自定义字体的使用场景
  • 如何美化CheckBox?
  • 自适应布局
  • 请用CSS写一个简单的幻灯片效果页面
  • 什么是外边距重叠？重叠的结果是什么？
  • rgba()和opacity的透明效果有什么不同？
  • css中可以让文字在垂直和水平方向上重叠的两个属性是什么？
  • 如何垂直居中一个浮动元素？
  • px和em的区别
  • Sass、LESS是什么？大家为什么要使用他们？
  • 知道css有个content属性吗？有什么作用？有什么应用？
  • 水平、垂直居中的方法
  • 如何使用CSS实现硬件加速？
  • 重绘和回流（重排）是什么，如何避免？
  • 左边宽度固定，右边自适应
  • 如何实现小于12px的字体效果
  • css hack原理及常用hack
  • CSS有哪些继承属性？
  • 外边距折叠
  • CSS3新增伪类有那些?
  • 如何居中div？如何居中一个浮动元素？如何让绝对定位的div居中?
  • 用纯CSS创建一个三角形的原理是什么?
  • 一个满屏 品 字布局 如何设计?
  • li与li之间有看不见的空白间隔是什么原因引起的？有什么解决办法?
  • 为什么要初始化CSS样式?
  • 请列举几种隐藏元素的方法。
  • 请解释一下 CSS3 的 Flexbox（弹性盒布局模型）以及适用场景
  • 请写出多种等高布局。
  • 浮动元素引起的问题
  • 浏览器是怎样解析CSS选择器的？
  • 在网页中的应该使用奇数还是偶数的字体?
  • margin和padding分别适合什么场景使用?
  • 抽离样式模块怎么写，说出思路。
  • 元素竖向的百分比设定是相对于容器的高度吗？
  • 全屏滚动的原理是什么？ 用到了CSS的那些属性？
  • 什么是响应式设计？响应式设计的基本原理是什么？如何兼容低版本的IE？
  • 什么是视差滚动效果，如何给每页做不同的动画？
  • a标签上四个伪类的执行顺序是怎么样的？
  • 如何修改Chrome记住密码后自动填充表单的黄色背景？
  • 网站图片文件，如何点击下载？而非点击预览？
  • iOS safari 如何阻止“橡皮筋效果”？
  • 你对 line-height 是如何理解的?
  • line-height 三种赋值方式有何区别？（带单位、纯数字、百分比）
  • 设置元素浮动后，该元素的 display 值会如何变化?
  • 让页面里的字体变清晰，变细用CSS怎么做？（IOS手机浏览器字体齿轮设置）
  • 一个高度自适应的div，里面有两个div，一个高度100px，希望另一个填满剩下的高度?
  • offsetWidth/offsetHeight,clientWidth/clientHeight与scrollWidth/scrollHeight的区别?

javascript

  • 闭包
  • 说说你对作用域链的理解
  • JavaScript原型，原型链 ? 有什么特点？
  • Javascript如何实现继承？
  • 谈谈This对象的理解
  • 谈一谈函数中this的指向
  • 事件模型
  • 事件的各个阶段
  • 说说事件流
  • new操作符具体干了什么呢?
  • 模块化开发怎么做？
  • 异步加载JS的方式有哪些？
  • js延迟加载的方式有哪些？
  • 那些操作会造成内存泄漏？
  • XML和JSON的区别？
  • 说说你对AMD和Commonjs的理解
  • 谈谈你对AMD、CMD的理解
  • javascript有哪些方法定义对象?
  • JS的基本数据类型和引用数据类型
    类型及检测方式
    数据类型转换
  • 介绍js有哪些内置对象?
  • 说几条写JavaScript的基本规范
  • eval是做什么的？
  • null，undefined 的区别？
  • javascript 代码中的"use strict";是什么意思？
  • JSON 的了解
  • 同步和异步的区别
  • attribute和property的区别是什么？
  • 谈谈你对ES6的理解
  • 什么是面向对象编程及面向过程编程，它们的异同和优缺点
  • 面向对象编程思想
  • 谈一谈let与var的区别
  • 如何通过JS判断一个数组
  • map与forEach的区别
  • 谈一谈你理解的函数式编程
  • 谈一谈箭头函数与普通函数的区别？
  • 异步编程的实现方式
  • 对原生Javascript了解程度
  • 说几条写JavaScript的基本规范
  • 如何编写高性能的JavaScript
  • js动画与CSS动画区别及相应实现
  • 数组和对象的遍历方式，以及几种方式的比较
  • 希望获取到页面中所有的checkbox怎么做？
  • 正则表达式
  • 正则表达式构造函数var reg=new RegExp(“xxx”)与正则表达字面量var reg=//有什么不同？
  • 匹配邮箱的正则表达式？
  • Javascript中callee和caller的作用？
  • 数组去重方法总结
  • Javascript全局函数和全局变量
  • 怎么判断两个对象相等？
  • 深浅拷贝
  • 防抖/节流
  • 谈谈变量提升？
  • 什么是单线程，和异步的关系
  • 什么是 Web App？Hybrid App？Native App？
  • 请简单实现数据双向绑定mvvm
  • 说说event loop
  • JavaScript 对象生命周期的理解
  • 请手写实现一个promise
  • 描述一下this
  • ajax、axios、fetch区别
  • JavaScript的组成
  • 检测浏览器版本版本有哪些方式？
  • 介绍JS有哪些内置对象
  • script 的位置是否会影响首屏显示时间
  • JavaScript如何实现一个类，怎么实例化这个类
  • 介绍 DOM 的发展
  • 介绍DOM0，DOM2，DOM3事件处理方式区别
  • 介绍事件“捕获”和“冒泡”执行顺序和事件的执行次数
  • 事件的代理/委托
  • W3C事件的 target 与 currentTarget 的区别？
  • 如何派发事件(dispatchEvent)？(如何进行事件广播？)
  • 什么是函数节流？介绍一下应用场景和原理？
  • 区分什么是“客户区坐标”、“页面坐标”、“屏幕坐标”
  • Javascript 垃圾回收机制
  • 如何删除一个cookie
  • 页面编码和被请求的资源编码如果不一致如何处理
  • 把<script>放在</body>之前和之后有什么区别？浏览器会如何解析它们？
  • JavaScript 中，调用函数有哪几种方式?
  • 简单实现 Function.bind 函数
  • 列举一下JavaScript数组和对象有哪些原生方法？
  • Array.slice() 与 Array.splice() 的区别？
  • MVVM
  • Proxy 与 Obeject.defineProperty 对比
  • 图片的懒加载、预加载
  • 哪四个操作会忽略enumerable为false的属性？
  • 属性的遍历

参考：

2. 框架、库

aixos

文档：

promise

  • 说说你对promise的了解

bootstrap

  • 什么是Bootstrap？以及为什么要使用Bootstrap？
  • 使用Bootstrap时，要声明的文档类型是什么？以及为什么要这样声明？
  • 什么是Bootstrap网格系统
  • Bootstrap 网格系统（Grid System）的工作原理
  • 对于各类尺寸的设备，Bootstrap设置的class前缀分别是什么
  • Bootstrap 网格系统列与列之间的间隙宽度是多少
  • 如果需要在一个标题的旁边创建副标题，可以怎样操作
  • 用Bootstrap，如何设置文字的对齐方式？
  • bootstrap如何设置响应式表格？
  • 使用Bootstrap创建垂直表单的基本步骤？
  • 使用Bootstrap创建水平表单的基本步骤？
  • 使用Bootstrap如何创建表单控件的帮助文本？
  • 使用Bootstrap激活或禁用按钮要如何操作？
  • Bootstrap有哪些关于的class？
  • Bootstrap中有关元素浮动及清除浮动的class？
  • 除了屏幕阅读器外，其他设备上隐藏元素的class？
  • Bootstrap如何制作下拉菜单？
  • Bootstrap如何制作按钮组？以及水平按钮组和垂直按钮组的优先级？
  • Bootstrap如何设置按钮的下拉菜单？
  • Bootstrap中的输入框组如何制作？
  • Bootstrap中的导航都有哪些？
  • Bootstrap中设置分页的class？
  • Bootstrap中显示标签的class？
  • Bootstrap中如何制作徽章？
  • Bootstrap中超大屏幕的作用是什么？

jquery

  • 你觉得jQuery源码有哪些写的好的地方？
  • 是否用过 jQuery 的 Deferred
  • jQuery 的实现原理
  • jQuery.fn 的 init 方法返回的 this 指的是什么对象
  • jQuery.extend 与 jQuery.fn.extend 的区别
  • jQuery 的队列是如何实现的
  • jQuery 中的 bind(), live(), delegate(), on()的区别
  • 是否知道自定义事件
  • jQuery 通过哪个方法和 Sizzle 选择器结合的
  • jQuery 中如何将数组转化为 JSON 字符串，然后再转化回来
  • jQuery 一个对象可以同时绑定多个事件，这是如何实现的
  • 针对 jQuery 的优化方法
  • jQuery 的 slideUp 动画，当鼠标快速连续触发, 动画会滞后反复执行，该如何处理呢
  • jQuery UI 如何自定义组件
  • jQuery 与 jQuery UI、jQuery Mobile 区别
  • jQuery 和 Zepto 的区别？ 各自的使用场景

elementui

vuejs

  • vue、react、angular

  • 说一下Vue的双向绑定数据的原理

  • 生命周期钩子函数

  • 虚拟dom

  • diff

  • 说说你对 SPA 单页面的理解，它的优缺点分别是什么？

  • v-show 与 v-if 有什么区别？

  • v-if 与 v-for 为什么不建议一起使用?

  • Class 与 Style 如何动态绑定？

  • 怎样理解 Vue 的单向数据流？

  • computed 和 watch 的区别和运用的场景？
    深入理解computed 、watch 、 methods的使用场景及其区别

  • 直接给一个数组项赋值，Vue 能检测到变化吗？

  • 谈谈你对 Vue 生命周期的理解？
    Vue 的生命周期方法有哪些? 一般在哪一步发请求

  • Vue 的父组件和子组件生命周期钩子函数执行顺序？

  • 在哪个生命周期内调用异步请求？

  • 在什么阶段才能访问操作DOM？

  • 父组件可以监听到子组件的生命周期吗？

  • 谈谈你对 keep-alive 的了解？

  • 组件中 data 为什么是一个函数？

  • v-model 的原理？

  • 组件间通信有哪几种方式？

  • 你使用过 Vuex 吗？

  • 什么是Vuex？
  • Vuex解决了什么问题？
  • 什么时候用Vuex？
  • 怎么使用Vuex？
  • Vuex的5个核心属性是什么？
  • Vuex中状态储存在哪里，怎么改变它？
  • Vuex中状态是对象时，使用时要注意什么？
  • 怎么在组件中批量使用Vuex的state状态？
  • Vuex中要从state派生一些状态出来，且多个组件使用它，该怎么做呢？
  • 如何给getters传递参数？
  • 怎么在组件中批量使用Vuex的getters属性？
  • 怎么在组件中批量给Vuex的getter属性取别名并使用?
  • 在Vuex的state中有个状态number表示货物数量，在组件怎么改变它。
  • 在Vuex中使用mutations要注意什么。
  • 在组件中多次提交同一个mutation，怎么写使用更方便。
  • Vuex中action和mutation有什么区别？
  • Vuex中action和mutation有什么相同点？
  • 在组件中多次提交同一个action，怎么写使用更方便。
  • Vuex中action通常是异步的，那么如何知道action什么时候结束呢？
  • Vuex中有两个action，分别是actionA和actionB，其内都是异步操作，在actionB要提交actionA，需在actionA处理结束再处理其它操作，怎么实现？
  • 有用过Vuex模块吗，为什么要使用，怎么使用。
  • 在模块中，getter和mutation接收的第一个参数state，是全局的还是模块的？
  • 在模块中，getter和mutation和action中怎么访问全局的state和getter？
  • 在组件中怎么访问Vuex模块中的getter和state,怎么提交mutation和action？
  • 用过Vuex模块的命名空间吗？为什么使用，怎么使用。
  • 怎么在带命名空间的模块内提交全局的mutation和action？
  • 怎么在带命名空间的模块内注册全局的action？
  • 组件中怎么提交modules中的带命名空间的moduleA中的mutationA？
  • 怎么使用mapState，mapGetters，mapActions和mapMutations这些函数来绑定带命名空间的模块？
  • Vuex插件有用过吗？怎么用简单介绍一下？
  • 在Vuex插件中怎么监听组件中提交mutation和action？
  • 在v-model上怎么用Vuex中state的值？
  • Vuex的严格模式是什么,有什么作用,怎么开启？

  • 使用过 Vue SSR 吗？说说 SSR？
  • vue-router 路由模式有几种？
  • 能说下 vue-router 中常用的 hash 和 history 路由模式实现原理吗？
  • 什么是 MVVM？
    MVC 和 MVVM 区别
  • Vue 是如何实现数据双向绑定的？
  • Vue 框架怎么实现对象和数组的监听？
    Vue 如何检测数组变化
  • Proxy 与 Object.defineProperty 优劣对比
  • Vue 怎么用 vm.$set() 解决对象新增属性不能响应的问题 ？
  • 虚拟 DOM 的优缺点？
  • 虚拟 DOM 实现原理？
  • Vue 中的 key 有什么作用？
  • 你有对 Vue 项目进行哪些优化？
  • 对于即将到来的 vue3.0 特性你有什么了解的吗？
    vue3.0 用过吗 了解多少?
  • 说说你使用 Vue 框架踩过最大的坑是什么？怎么解决的？
  • 说说 vue 内置指令
  • Vue 事件绑定原理
  • vue-router 路由钩子函数是什么? 执行顺序是什么?

官方文档

参考

weixin小程序

  • 微信小程序有几个文件
  • 微信小程序怎样跟事件传值
  • 小程序的 wxss 和 css 有哪些不一样的地方？
  • 小程序关联微信公众号如何确定用户的唯一性
  • 微信小程序与vue区别

uni-app

nodejs

  • Node的应用场景

3. 工具

webpack

  • 谈谈你对webpack的看法
  • webpack有哪些常用的loader、plugin？分别有什么作用？如何使用？
    html-webpack-plugin
    clean-webpack-plugin
    style-loader、css-loader
    less、less-loader
    postcss-loader、postcss、autoprefixer
    mini-css-extract-plugin
    extract-text-webpack-plugin@next
    file-loader、url-loader
    babel-loader、@babel/preset-env、@babel/core、@babel/polyfill
  • 打包体积 优化思路
  • 打包效率
  • Loader
  • 说一下webpack的一些plugin，怎么使用webpack对项目进行优化

git

4. 通识

http

  • HTTP的几种请求方法用途？
  • HTTP状态码及其含义
  • HTTP request报文结构是怎样的？
  • HTTP response报文结构是怎样的？

浏览器

  • 从浏览器地址栏输入url到显示页面的步骤
  • 介绍一下你对浏览器内核的理解？
  • 常见的浏览器内核有哪些？
  • 请描述一下 cookies，sessionStorage 和 localStorage 的区别？
  • 彻底理解cookie，session，token
  • 请你谈谈Cookie的弊端。
  • 常见兼容性问题？
  • web开发中会话跟踪的方法有哪些?
  • 浏览器缓存
  • WebSocket
  • 说说从输入URL到看到页面发生的全过程，越详细越好
  • 描述浏览器的渲染过程，DOM树和渲染树的区别
  • 请解释一下 JavaScript 的同源策略
  • 垃圾回收机制

ajax

  • Ajax原理
  • ajax 有那些优缺点?
  • 跨域请求
  • 如何解决跨域问题?

设计模式

  • 工厂模式
  • 构造函数模式

dom相关

  • 怎样添加、移除、移动、复制、创建和查找节点？
  • window.onload和$(document).ready
  • 原生JS的window.onload与Jquery的$(document).ready(function(){})有什么不同？
  • 如何用原生JS实现Jq的ready方法？
  • addEventListener()和attachEvent()的区别
  • 使用js实现一个持续的动画效果

编程题

  • 如何判断一个对象是否为数组
  • 冒泡排序
  • 快速排序
  • 编写一个方法 求一个字符串的字节长度

综合

  • 谈谈你对重构的理解
  • 什么样的前端代码是好的
  • 对前端工程师这个职位是怎么样理解的？它的前景会怎么样
  • 你觉得前端工程的价值体现在哪
  • 平时如何管理你的项目
  • 组件封装
  • Web 前端开发的注意事项
  • 在设计 Web APP 时，应当遵循以下几点
  • 你怎么看待 Web App/hybrid App/Native App？（移动端前端 和 Web 前端区别？）
  • 页面重构怎么操作

其它

  • 负载均衡
  • CDN
  • babel原理
  • js自定义事件
  • 前后端路由差别

一些常见问题

  • 自我介绍
  • 面试完你还有什么问题要问的吗
  • 你有什么爱好?
  • 你最大的优点和缺点是什么?
  • 你为什么会选择这个行业，职位?
  • 你觉得你适合从事这个岗位吗?
  • 你有什么职业规划?
  • 你对工资有什么要求?
  • 如何看待前端开发？
  • 未来三到五年的规划是怎样的？
  • 你的项目中技术难点是什么？遇到了什么问题？你是怎么解决的？
  • 你们部门的开发流程是怎样的
  • 你认为哪个项目做得最好？
  • 说下工作中你做过的一些性能优化处理
  • 最近在看哪些前端方面的书？
  • 平时是如何学习前端开发的？
  • 你最有成就感的一件事
  • 你为什么要离开前一家公司？
  • 你对加班的看法
  • 你希望通过这份工作获得什么？
avatar
文章
阅读
粉丝