前端面试每日3+1（周汇总2019.07.28）
2019-07-28 本文已影响5人
浪子神剑
《论语》，曾子曰：“吾日三省吾身”（我每天多次反省自己）。
前端面试每日3+1题，以面试题来驱动学习，每天进步一点！
让努力成为一种习惯，让奋斗成为一种享受！
相信 坚持 的力量！！！
项目地址： 前端面试每日3+1
【推荐】欢迎跟 jsliang 一起折腾前端，系统整理前端知识，目前正在折腾 LeetCode，打算打通算法与数据结构的任督二脉。GitHub 地址
- 学习不打烊，充电加油只为遇到更好的自己，365天无节假日，每天早上5点纯手工发布面试题（死磕自己，愉悦大家）。
- 希望大家在这浮夸的前端圈里，保持冷静，坚持每天花20分钟来学习与思考。
- 在这千变万化，类库层出不穷的前端，建议大家不要等到找工作时，才狂刷题，提倡每日学习！（不忘初心，html、css、javascript才是基石！）
- 欢迎大家到Issues交流，鼓励PR，感谢Star，大家有啥好的建议可以加我微信一起交流讨论！
希望大家每日去学习与思考，这才达到来这里的目的！！！（不要为了谁而来，要为自己而来！）
html
- 请描述一下cookies、sessionStorage和localStorage 的区别？
- 行内元素、块级元素、空(void)元素分别有有那些？
- 说说你对accesskey的理解，举例说明它有什么运用场景？
- HTML5怎么为输入框添加语音输入的功能呢？
- HTML5的页面可见性（Page Visibility）有哪些应用场景？
- 列举出你最常用的meta标签的写法和作用
- Doctype有什么作用？你知道有多少种Doctype文档类型吗？
- 写出以下几个HTML标签：字体、居中、文字加粗、下标
- HTML5标准提供了哪些新的API？你有用过哪些？
- 使用HTML5需要遵守哪些设计原则？
- 有使用过svg吗？请用svg画一个圆
- 请说说你对ISISO8859-2字符集的认识
- 请描述下元素的href和src有什么区别？
- 举例说明你对ol和ul标签的区别？它们的运用场景分别是什么呢？
- a标签的href和onclick属性同时存在时哪个先触发？
- 怎么使用HTML5来获取定位？定位不准怎么解决？
- 举例说明如何原样输出HTML代码，不被浏览器解析？
- 举例说明你对HTML5的ruby标签的理解，都有哪些应用场景？
- iframe的使用场景有哪些？
- a标签下的href="javascript:void(0)"起到了什么作用？说说你对javascript:void(0)的理解？
- 在新窗口打开链接的方法是什么？那怎么设置全站链接都在新窗口打开？
- 用HTML5实现手机摇一摇功能你有做过吗？你知道它的原理吗？
- 你有用过HTML5的Device API吗？说说它都有哪些应用场景？
- 简述下HTML的快捷键属性是哪个？并举例说明有什么用？
- HTML5的应用程序缓存与浏览器缓存有什么不同？
- 你有用过HTML5中的datalist标签吗？说说你对它的理解
- 说说你对HTML5的img标签属性srcset和sizes的理解？都有哪些应用场景？
- HTML5如何识别语音读出的内容和朗读指定的内容？
- 移动web页面如何自动探测电话号码？
- 在a标签上的四个伪类执行顺序是什么？
- favicon.ico有什么作用？怎么在页面中引用？常用尺寸有哪些？可以修改后缀名吗？
- video和audio分别支持哪些格式？
- 怎么在IE8及以下实现HTML5的兼容？
- html的a标签属性rel='nofollow'有什么作用？
- 怎样禁止表单记住密码自动填充？
- 写个例子说明HTML5在移动端如何打开APP？
- 请写出唤醒拔打电话、发送邮件、发送短信的例子
- HTML5如果不写
<! DOCTYPE html>，页面还会正常工作么？ - html直接输入多个空格为什么只能显示一个空格？
- 写出html提供的几种空格实体（5种以上）
- 什么是html的字符实体？版权符号代码怎么写？
- 有使用过HTML5的拖放API吗？说说你对它的理解
- 有用过HTML5的webSQL和IndexedDB吗？说说你对它们的理解
- src、href、link的区别是什么？
- 有用过WebGL吗？说说你对它的理解
- HTML5相对于HTML4有哪些优势？
- 你了解HTML5的download属性吗？
- 渐进式渲染是什么？
- HTML5中新添加的表单属性有哪些？
- 你有了解HTML5的地理定位吗？怎么使用？
- web workers有用过吗？能帮我们解决哪些问题？
- From表单提交时为什么会刷新页面？怎么预防刷新？
- Form表单是怎么上传文件的？你了解它的原理吗？
- Ajax与Flash的优缺点分别是什么？
- 说说你对target="_blank"的理解？有啥安全性问题？如何防范？
- 说说你对WEB标准和W3C的理解与认识？
- HTML5如何使用音频和视频？
- 页面中怎么嵌入Flash？有哪些方法？写出来
- xml与html有什么区别？
- 说说video标签中预加载视频用到的属性是什么？
- 如何让元素固定在页面底部？有哪些比较好的实践？
- 解释下什么是ISISO8859-2字符集？
- webSocket怎么做兼容处理？
- html5都有哪些新的特性？移除了哪些元素？
- title与h1、b与strong、i与em的区别分别是什么？
- 说说你对cookie和session的理解
- html5哪些标签可以优化SEO?
- HTML与XHTML二者有不同?
- 用一个div模拟textarea的实现
- Standards模式和Quirks模式有什么区别？
- html和html5有什么区别呢？
- 说说你对HTML元素的显示优先级的理解
- DOM和BOM有什么区别？
- 网页上的验证码是为了解决什么问题？说说你了解的验证码种类有哪些
- 说说你对
<meta>标签的理解 - 说说你对影子(Shadow)DOM的了解
- 解释下你对GBK和UTF-8的理解？并说说页面上产生乱码的可能原因
- 请说说
<script>、<script async>和<script defer>的区别 - 说说你对属性data-的理解
- 关于
<form>标签的enctype属性你有哪些了解？ - js放在html的
<body>和<head>有什么区别？ - 谈谈你对input元素中readonly和disabled属性的理解
- 请描述HTML元素的显示优先级
- 说说你对html中的置换元素和非置换元素的理解
- 怎样在页面上实现一个圆形的可点击区域？
- 你认为table的作用和优缺点是什么呢？
- 元素的alt和title有什么区别？
- title与h1的区别、b与strong的区别、i与em的区别？
- 为什么HTML5只需要写
<!DOCTYPE HTML>就可以？ - html5中的form怎么关闭自动完成？
- 常见的浏览器内核都有哪些？并介绍下你对内核的理解
- 你对标签语义化的理解是什么？
- viewport常见设置都有哪些？
- 浏览器内多个标签页之间的通信方式有哪些？
- 简述下html5的离线储存原理，同时说明如何使用？
- iframe框架都有哪些优缺点？
- label都有哪些作用？并举相应的例子说明
- 简述超链接target属性的取值和作用
- HTML5的文件离线储存怎么使用，工作原理是什么？
- HTML全局属性(global attribute)有哪些（包含H5）？
- html的元素有哪些（包含H5）？
- 页面导入样式时，使用link和@import有什么区别？
css
- 说说你对低版本IE的盒子模型的理解
- 你是如何规划响应式布局的？
- 说说你对前端二倍图的理解？移动端使用二倍图比一倍图有什么好处？
- 如何让大小不同的图片等比缩放不变形显示在固定大小的div里？写出来
- 你对视网膜(Retina)分辨率有了解吗？有没有在实际中使用过？
- 移动端微信页面有哪些兼容性问题及解决方案是什么？
- 如何更改placeholder的字体颜色和大小？
- 行内css和important哪个优先级高？
- 当一个元素被设置为浮动后，它的display值变为什么呢？
- 为什么会出现浮动？在什么时候需要清除浮动呢？
- 写出div在不固定高度的情况下水平垂直居中的方法？
- 移动端的布局用过媒体查询吗？写出例子看看
- CSS的伪类和伪对象有什么不同？
- CSS的overflow属性定义溢出元素内容区的内容会如何处理呢?
- 外层有一个自适应高度的div，里面有两个div，一个高度固定300px，另一个怎么填满剩余的高度？
- 说说你对CSS样式覆盖规则的理解
- 写出几个初始化CSS的样式，并解释说明为什么要这样写
- display有哪些值？分别说明他们的作用是什么？
- 怎么让body高度自适应屏幕？为什么？
- font-style的属性有Italic和oblique，两者有什么区别呢?
- IE(6/7/8/9/10/11/Edge)下的hack写法分别有哪些？
- 写出你遇到过IE6/7/8/9的BUG及解决方法
- 举例说明css的基本语句构成是什么呢？
- 写例子说明如何强制（自动）中、英文换行与不换行
- 说说你对BEM规范的理解，同时举例说明常见的CSS规范有哪些？
- 遇到overflow: scroll不能平滑滚动怎么解决？
- 请问display:inline-block在什么时候会显示间隙？
- 用CSS画出一个任意角度的扇形，可以写多种实现的方法
- 请你解释下什么是浮动和它的工作原理是什么？同时浮动会引起什么问题？
- 说说你对!important的理解，一般在哪些场景使用？
- 在实际编写css中你有遇到过哪些浏览器兼容性的问题？怎么解决的？
- 怎么改变选中文本的文字颜色和背景色？
- 你对响应式设计的理解是什么？知道它基本的原理是吗？要想兼容低版本的IE怎么做呢？
- 你有使用过哪些栅格系统？都有什么区别呢？
- 请说说
*{box-sizing: border-box;}的作用及好处有哪些 - 说说你对jpg、png、gif的理解，分别在什么场景下使用？有使用过webp吗？
- 如何消除transition闪屏？
- 元素竖向的百分比设置是相对容器的高度吗？
- 用CSS绘制一个红色的爱心
- 举例说明css中颜色的表示方法有几种
- 说说position的absolute和fixed共同与不同点分别是什么？
- 手动写动画最小时间间隔是多少，为什么？
- 怎样把一个div居中？怎样把一个浮动元素居中？怎样把绝对定位的div居中？
- 用css画一个太阳
- 你有用过哪些css框架？说说它们的特点
- box-sizing常用的属性有哪些？分别有什么作用？
- inline、block、inline-block这三个属性值有什么区别？
- margin和padding使用的场景有哪些？
- 什么是视差滚动？如何实现视差滚动的效果？
- css3的:nth-child和:nth-of-type的区别是什么？
- 怎么使用自定义字体？有什么注意事项？
- 要是position跟display、overflow、float这些特性相互叠加后会怎么样？
- 有用过Flex吗？简要说下你对它的了解
- 列举CSS优化、提高性能的方法
- 假如设计稿使用了非标准的字体，你该如何去实现它？
- 你知道全屏滚动的原理是什么吗？它用到了CSS的哪些属性？
- 你是怎样抽离样式模块的？
- 说说你对媒体查询的理解
- 你知道的等高布局有多少种？写出来
- 手写一个满屏品字布局的方案
- span与span之间有看不见的空白间隔是什么原因引起的？有什么解决办法？
- 重置（初始化）css的作用是什么？
- 怎么让英文单词的首字母大写？
- 怎么才能让图文不可复制？
- 写出你知道的CSS水平和垂直居中的方法
- 实现单行文本居中和多行文本左对齐并超出显示"..."
- 不使用border画出1px高的线，在不同浏览器的标准和怪异模式下都能保持效果一样
- 写出主流浏览器内核私有属性的css前缀
- 使用flex实现三栏布局，两边固定，中间自适应
- 浏览器是怎样判断元素是否和某个CSS选择器匹配？
- 用CSS绘制一个三角形
- 说下line-height三种赋值方式有何区别？
- 让网页的字体变得清晰，变细用CSS怎么做？
- 描述下你所了解的图片格式及使用场景
- rgba()和opacity这两个的透明效果有什么区别呢？
- 怎样修改chrome记住密码后自动填充表单的黄色背景？
- 说说你对z-index的理解
- 在页面中的应该使用奇数还是偶数的字体？为什么呢？
- 你有用过CSS预处理器吗？喜欢用哪个？原理是什么？
- 说说CSS的优先级是如何计算的？
- 说说浏览器解析CSS选择器的过程？
- 说说你对line-height是如何理解的？
- 要让Chrome支持小于12px的文字怎么做？
- css的属性content有什么作用呢？有哪些场景可以用到？
- 什么是FOUC？你是如何避免FOUC的？
- 解释下 CSS sprites的原理和优缺点分别是什么？
- 请描述margin边界叠加是什么及解决方案
- style标签写在body前和body后的区别是什么？
- position:fixed;在ios下无效该怎么办？
- ::before和:after中单冒号和双冒号的区别是什么，这两个伪元素有什么作用？
- 说说你对css盒子模型的理解
- css常用的布局方式有哪些？
- 对比下px、em、rem有什么不同？
- 简述下你理解的优雅降级和渐进增强
- 清除浮动的方式有哪些及优缺点？
- 简述你对BFC规范的理解
- 用css创建一个三角形，并简述原理
- CSS3新增伪类有哪些并简要描述
- CSS选择器有哪些？哪些属性可以继承？
- 在页面上隐藏元素的方法有哪些？
- CSS3有哪些新增的特性？
- 圣杯布局和双飞翼布局的理解和区别，并用代码实现
js
- 你是如何更好地处理Async/Await的异常呢的？
- 准确说出
'1,2,3,4'.split()的结果是什么（包括类型和值）？ - 不依赖第三方库，说下如何使用js读取pdf？
- 分别封装精确运算的加减乘除四个方法
- 不用第三方库，说说纯js怎么实现读取和导出excel？
- 说说你理解的同步和异步的区别是什么？
- 写例子说明如何给li绑定事件（ul下有1000+个li）？
- 要实现一个js的持续动画，你有什么比较好的方法？
- 分别写出数组的交集、并集、差集、补集这四个方法
- 用js写出死循环的方法有哪些？
- js的函数有哪几种调用形式？
- 解释下为什么
{} + [] === 0为true？ - 请描述下null和undefined的区别是什么？这两者分别运用在什么场景？
- 写个方法随机打乱一个数组
- js异步加载有哪些方案？
- 判断instanceof的结果并解释原因 [代码]
function test(){
return test;
}
new test() instanceof test;
- 请写一个sleep（暂停）函数
- 把Script标签放在页面最底部的
</body>之前和之后有什么区别？浏览器会如何解析它们？ - js延迟加载的方式有哪些？
- 请描述你对浏览器同源策略的理解
- 举例说明js如何实现继承？
- 用js实现一个九九乘法口诀表
- 在js中怎么捕获异常？写出来看看？应该在哪些场景下采用呢？
- 举例说明什么是decodeURI()和encodeURI()是什么？
- 举例说明什么是IIFEs？它有什么好处？
- 举例说明数组和对象的迭代方法分别有哪些？
- 请快速答出此题的答案并解释：var x, y = 1; x + y = ?
- 说说instanceof和typeof的实现原理并自己模拟实现一个instanceof
- js中=、==、===三个的区别是什么？并说明它们各自的工作过程
- 写一个方法随机生成指定位数的字符串
- 移动端点击事件为什么会有延迟？有哪些方法可以解决？
- 写一个字符串重复的repeat函数
- 说说你对深浅拷贝的理解？并实现一个对数组和对象深拷贝的方法
- Ajax请求中get和post方式有什么区别呢？分别在哪些场景下使用？
- 说说你对base64的理解，它的使用场景有哪些？
- formData主要是用来做什么的？它的操作方法有哪些？
- 举例子说说你对js隐式类型转换的理解
- 请解释下什么是cookie隔离？为什么要隔离？如何隔离？
- 说说你对数据类型转换的理解是什么？类型转换的方法有哪些？
- 如何让(a==1 && a==2 && a==3)的值为true，把"=="换成"==="后还能为true吗？
- 举例子说明javascript的变量声明提升和函数声明提升
- 有用过HTML5的WebWork吗？它主要解决了什么问题？
- 写一个方法获取图片的原始宽高
- 请实现一个flattenDeep函数，把多维数组扁平化
- 写一个格式化金额的方法
- 请说下你对proto和prototype的理解
- 写一个方法，使得sum(x)(y)和sum(x,y)返回的结果相同
- JSONP的原理是什么？解决什么问题？
- 写出4个使用this的典型例子
- 写一个函数找出给定数组中的最大差值
- document的load 和ready有什么区别？
- 什么是事件委托？它有什么好处？能简单的写一个例子吗？
- 字符串相连有哪些方式？哪种最好？为什么？
- 请写出一个函数求出N的阶乘（即N!）
- 写个还剩下多少天过年的倒计时
- 你对事件循环有了解吗？说说看！
- 请说说你对事件冒泡机制的理解？
- 写一个使两个整数进行交换的方法（不能使用临时变量）
- 写出几种创建对象的方式，并说说他们的区别是什么？
- 深度克隆对象的方法有哪些，并把你认为最好的写出来
- JQuery的源码看过吗？能不能简单概括一下它的实现原理？
- window对象和document对象有什么区别？
- 说说你对IIFE的理解
- 为什么会有跨域问题？怎么解决跨域？
- 说说你对模块化的理解
- 说说你对eval的理解
- 找到字符串中最长的单词，并返回它的长度
- 请手写一个幻灯片的效果
- 请你解释一个为什么10.toFixed(10)会报错？
- 请用canvas写一个关于520浪漫表白的代码
- 说说你对this的理解
- 造成内存泄漏的操作有哪些？
- 写一个方法把0和1互转（0置1，1置0）
- 写一个方法判断字符串是否为回文字符串
- 写一个获取数组的最大值、最小值的方法
- 解释下这段代码的意思！
- 说说你对arguments的理解，它是数组吗？
- 说说bind、call、apply的区别？并手写实现一个bind的方法
- 写一个判断设备来源的方法
- 如何快速让一个数组乱序，写出来
- 0.1 + 0.2、0.1 + 0.3和0.1 * 0.2分别等于多少？并解释下为什么？
- 你对new操作符的理解是什么？手动实现一个new方法
- 写一个方法验证是否为中文
- 写一个验证身份证号的方法
- "attribute"和"property"有什么不同？
- 你理解的"use strict";是什么?使用它有什么优缺点？
- typeof('abc')和typeof 'abc'都是string, 那么typeof是操作符还是函数？
- 返回到顶部的方法有哪些？把其中一个方法出来
- 写一个数组去重的方法（支持多维数组）
- 什么是闭包？优缺点分别是什么？
- 说说你对javascript的作用域的理解
- 写一个获取当前url查询字符串中的参数的方法
- 简要描述下JS有哪些内置的对象
- 简要描述下什么是回调函数并写一个例子出来
- 写一个加密字符串的方法
- 统计某一字符或字符串在另一个字符串中出现的次数
- 写一个去除制表符和换行符的方法
- 写一个把字符串大小写切换的方法
- 写一个方法把下划线命名转成大驼峰命名
- 去除字符串中最后一个指定的字符
- 写一个方法去掉字符串中的空格
- 用递归算法实现，数组长度为5且元素的随机数在2-32间不重复的值
软技能
- 请列举出多种减少页面加载时间的方法
- 进程与线程有什么区别？JS的单线程带来哪些好处？
- 你有自己买过服务器和域名用来搭建博客或者网站吗？
- 你有画过流程图吗？开始和判定分别用什么图形表示？
- 你有用过单例模式吗？主要运用场景有哪些？
- 不查资料，你会手写正则吗？
- 你认为前端工程师应该分为哪些级别呢？说说你的看法
- 说说你对Git的branch, diff, merge的理解？
- 你知道什么是图片防盗链吗？防盗链怎么实现呢？说说你的方法
- 说说你对emojig表情的理解，前端如何处理emoji表情？它的运用场景有哪些？
- 简要描述下什么是DNS？它有什么用？
- 浏览器在什么情况下会出现“已拦截弹窗式窗口”？怎么解决？
- 你所在的团队有规范吗？举例说明都定义了哪些规范？
- 当项目准备上线前，你有做过哪些性能优化吗？
- 说说你对robots文件的理解，它有什么作用？
- 说说你对hosts文件的理解，它都有哪些作用？
- 你平常都看哪些方面的书？你看书的方法是怎样的？
- Git的reset和revert有什么区别？它们分别适用于什么场景？
- 你平时开发是用mac还是windows系统？至少举三个例子说明两者的区别？
- 刷新和强制刷新有什么区别？说说你对两者的理解
- 你会抓https和移动端的包吗？分别描述下这两种包要怎么抓？
- 说下你平时是怎么自学的？怎么安排时间的？
- 你申请的这个职位，你觉得你还欠缺什么呢？
- 你知道什么是websocket吗？它有什么应用场景？
- 一个项目写很多的纯静态页面，有公共的部分（例如头和尾）你是怎么提取公用的？
- 你有使用过JWT吗？说说你对它的理解
- 你会抓包吗？都有用过哪些抓包工具？
- 你对web服务器软件有了解吗？都使用过哪些？各有哪些优缺点呢？
- 说说你做过让你觉得最满意的项目是什么？为什么？
- 说下你对互联网行业及前端技术发展趋势的看法
- 说说你对RESTful的理解
- 你知道二维码的原理是什么吗？要把android和ios的下载地址合成一个二维码怎么做呢？
- 做了这么多年开发，说说你最大的感悟是什么？
- 本地git与远程仓库连接的方式有哪些？
- 为什么浏览器会有兼容的问题呢？
- js动画和css动画有什么区别？
- 你觉得你自己最大的优点和缺点分别是什么？能否举例说明一下？
- 如果面试官让你说说下你的家庭？你会从哪些方面说呢？
- 最后如果技术面和HR面问你：你还有什么问题吗？你分别会问些什么？
- 如果面试官让你先自我介绍下，然后说下你的工作经历，你该怎么说？
- 说说什么是设计模式，你最常用的设计模式有哪些？
- 说说你对同构和SSR的理解
- 知道IPV6是什么吗？说说它和IPV4的区别是什么？
- 如何预防掉头发？
- 对于让你接手一个你觉得很烂的老项目，你该怎么办？
- 对于5G的到来，你是怎么看的？说说你的想法
- 说说你对浏览器的关键渲染路径的理解
- 说说你对域名收敛和域名发散的理解？分别在什么场景下使用？
- 网站被劫持植入广告该怎么办？如何防止？
- 和你的上级领导意见不一致时你该怎么办？
- 有用过本地存储吗？有什么限制？有没有考虑过超出了限制怎么办？
- 说说你对CDN的理解，使用过程中有没有遇到过问题？
- 你写文档一般用什么工具？Markdown有用过吗？
- 说说你对http、https的理解
- 你有遇到过字体侵权的事吗？如何解决？
- 最近996一词很火，谈谈你对996的看法
- 如果HR说要做背调，还要你给出近三个月的银行流水，你该怎么办？
- 说说你对本项目的看法及建议
- 从你的角度上来讲，你觉得如何管理前端团队？
- 说说你对http、https、http2的理解
- 最近在学什么？能谈谈你未来3，5年给自己的规划吗？
- 你现在在团队是什么角色，有起到了什么显著的作用吗？
- 你有自己的博客吗？平时自己有写一些技术文章吗？
- 说说你对NodeJs的理解及用途
- 公钥加密和私钥加密是什么？
- 你知道网页三剑客指的是什么吗？你有用过Dreamwear吗？
- 如果让你快速使用一门你不熟悉的新技术，你该怎么办？
- 对于前端安全，你了解多少？说说你对XSS和CSRF的理解
- 谈一谈你知道的前端性能优化方案有哪些？
- 你了解什么是技术债务吗？
- 你对全栈工程师的理解是什么？
- 你在上一家公司工作流程是怎么样的，如何与其他人协作的？是怎样跨部门合作的？
- 对于有压力时，你是怎么抗压的？
- 解释下CRLF是什么？
- 在浏览器中输入url到页面显示出来的过程发生了什么？
- 你为什么离职呢？
- 你对Git的branch及工作流的理解是什么？
- 说说你工作中遇到过比较难的技术问题是什么？是如何解决的？
- 你经历过老板要求兼容IE吗？IE几？有什么感悟？
- 说说一件或几件（介绍下除了工作外）你觉得能为你面试加分的事
- 前端工程师这个职位你是怎么样理解的？聊聊它的前景？
- 来说说你对重绘和重排的理解，以及如何优化？
- 你会手写原生js代码吗？
- 最近都流行些什么？你经常会浏览哪些网站？
- 你如何看待团建的？你们团建一般都怎么实施？
- 说说你对SVN和GIT的理解和区别
- 你在的公司有没有做代码审查（CodeReview）？如果有是怎么做的？如果没有你觉得应该怎么做才更好？
- 对于加班你是怎么看的？
- 你最喜欢用哪些编辑器？喜欢它的理由是什么？
- http都有哪些状态码？
交流讨论
项目地址： 前端面试每日3+1
