# 目录
# $HTML， HTTP，web综合问题
- 1、前端需要注意哪些
SEO - 2、
<img>的title和alt有什么区别 - 3、
HTTP的几种请求方法用途 - 4、从浏览器地址栏输入
url到显示页面的步骤 - 5、如何进行网站性能优化
- 6、HTTP状态码及其含义
- 7、语义化的理解
- 8、介绍一下你对浏览器内核的理解
- 9、
html5有哪些新特性、移除了那些元素？ - 10、
HTML5的离线储存怎么使用，工作原理能不能解释一下？ - 11、浏览器是怎么对
HTML5的离线储存资源进行管理和加载的呢 - 12、请描述一下
cookies，sessionStorage和localStorage的区别 - 13、
iframe有那些缺点？ - 14、
WEB标准以及W3C标准是什么? - 15、
xhtml和html有什么区别? - 16、
Doctype作用? 严格模式与混杂模式如何区分？它们有何意义? - 17、行内元素有哪些？块级元素有哪些？ 空(
void)元素有那些？行内元素和块级元素有什么区别？ - 18、
HTML全局属性(global attribute)有哪些 - 19、
Canvas和SVG有什么区别？ - 20、
HTML5为什么只需要写<!DOCTYPE HTML>？ - 21、如何在页面上实现一个圆形的可点击区域？
- 22、网页验证码是干嘛的，是为了解决什么安全问题
# $CSS部分
- 1、
css sprite是什么,有什么优缺点 - 2、
display: none;与visibility: hidden;的区别 - 3、
link与@import的区别 - 4、什么是
FOUC?如何避免 - 5、如何创建块级格式化上下文(
block formatting context),BFC有什么用 - 7、清除浮动的几种方式，各自的优缺点
- 8、为什么要初始化
CSS样式? - 9、
css3有哪些新特性 - 10、
display有哪些值？说明他们的作用 - 11、介绍一下标准的CSS的盒子模型？低版本IE的盒子模型有什么不同的？
- 12、
CSS优先级算法如何计算？ - 13、对
BFC规范的理解？ - 14、谈谈浮动和清除浮动
- 15、
position的值，relative和absolute`定位原点是 - 16、
display:inline-block什么时候不会显示间隙？(携程) - 17、
PNG,GIF,JPG的区别及如何选 - 18、行内元素
float:left后是否变为块级元素？ - 19、在网页中的应该使用奇数还是偶数的字体？为什么呢？
- 20、
::before和:after中双冒号和单冒号有什么区别？解释一下这2个伪元素的作用 - 21、如果需要手动写动画，你认为最小时间间隔是多久，为什么？（阿里）
- 22、
CSS合并方法 - 23、
CSS不同选择器的权重(CSS层叠的规则) - 24、列出你所知道可以改变页面布局的属性
- 25、
CSS在性能优化方面的实践 - 26、
CSS3动画（简单动画的实现，如旋转等） - 27、
base64的原理及优缺点
# $JavaScript
- 1、闭包
- 2、说说你对作用域链的理解
- 3、
JavaScript原型，原型链 ? 有什么特点？ - 4、请解释什么是事件代理
- 5、
Javascript如何实现继承？ - 6、谈谈
This对象的理解 - 7、事件模型
- 8、
new操作符具体干了什么呢? - 9、
Ajax原理 - 11、模块化开发怎么做？
- 12、异步加载
JS的方式有哪些？ - 13、那些操作会造成内存泄漏？
- 14、
XML和JSON的区别？ - 15、谈谈你对
webpack的看法 - 17、常见
web安全及防护原理 - 18、用过哪些设计模式？
- 19、为什么要有同源限制？
- 20、
offsetWidth/offsetHeight,clientWidth/clientHeight与scrollWidth/scrollHeight的区别 - 21、
javascript有哪些方法定义对象 - 22、常见兼容性问题？
- 22、说说你对
promise的了解 - 23、你觉得
jQuery源码有哪些写的好的地方 - 25、
Node的应用场景 - 26、谈谈你对
AMD、CMD的理解 - 27、那些操作会造成内存泄漏？
- 28、
web开发中会话跟踪的方法有哪些 - 29、介绍
js的基本数据类型 - 30、介绍
js有哪些内置对象？ - 31、说几条写
JavaScript的基本规范？ - 32、
JavaScript有几种类型的值？，你能画一下他们的内存图吗？ - 33、
javascript创建对象的几种方式？ - 34、
eval是做什么的？ - 35、
null，undefined的区别？ - 36、
[“1”, “2”, “3”].map(parseInt)答案是多少？ - 37、
javascript代码中的”use strict”;是什么意思 ? 使用它区别是什么？ - 38、
JSON的了解？ - 39、js延迟加载的方式有哪些？
- 40、同步和异步的区别?
- 41、渐进增强和优雅降级
- 42、
defer和async - 43、说说严格模式的限制
- 44、
attribute和property的区别是什么？ - 45、谈谈你对
ES6的理解 - 46、
ECMAScript6怎么写class么，为什么会出现class这种东西? - 47、什么是面向对象编程及面向过程编程，它们的异同和优缺点
- 48、从你自己的理解来看，你是如何理解面向对象编程的，它解决了什么问题，有什么作用
- 49、对web标准、可用性、可访问性的理解
# $编程题
- 1、写一个通用的事件侦听器函数
- 2、如何判断一个对象是否为数组
- 3、冒泡排序
- 4、快速排序
- 5、编写一个方法 求一个字符串的字节长度
# $其他
- 1、谈谈你对重构的理解
- 2、什么样的前端代码是好的
- 3、对前端工程师这个职位是怎么样理解的？它的前景会怎么样？
- 4、你觉得前端工程的价值体现在哪
- 5、平时如何管理你的项目？
# 人事面
- 面试完你还有什么问题要问的吗
- 你有什么爱好?
- 你最大的优点和缺点是什么?
- 你为什么会选择这个行业，职位?
- 你觉得你适合从事这个岗位吗?
- 你有什么职业规划?
- 你对工资有什么要求?
- 如何看待前端开发？
- 未来三到五年的规划是怎样的？
# 常问
- 自我介绍
- 你的项目中技术难点是什么？遇到了什么问题？你是怎么解决的？
- 你认为哪个项目做得最好？
- 最近在看哪些前端方面的书？
- 平时是如何学习前端开发的？
- 你最有成就感的一件事
- 你是怎么学习前端的
# $HTML， HTTP，web综合问题
# 1、前端需要注意哪些SEO
- 合理的
title、description、keywords：搜索对着三项的权重逐个减小，title值强调重点即可，重要关键词出现不要超过2次，而且要靠前，不同页面title要有所不同；description把页面内容高度概括，长度合适，不可过分堆砌关键词，不同页面description有所不同；keywords列举出重要关键词即可 - 语义化的
HTML代码，符合W3C规范：语义化代码让搜索引擎容易理解网页 - 重要内容
HTML代码放在最前：搜索引擎抓取HTML顺序是从上到下，有的搜索引擎对抓取长度有限制，保证重要内容一定会被抓取 - 重要内容不要用
js输出：爬虫不会执行js获取内容 - 少用
iframe：搜索引擎不会抓取iframe中的内容 - 非装饰性图片必须加
alt - 提高网站速度：网站速度是搜索引擎排序的一个重要指标
# 2、<img>的title和alt有什么区别
- 通常当鼠标滑动到元素上的时候显示
alt是<img>的特有属性，是图片内容的等价描述，用于图片无法加载时显示、读屏器阅读图片。可提图片高可访问性，除了纯装饰图片外都必须设置有意义的值，搜索引擎会重点分析。
# 3、HTTP的几种请求方法用途
-
1、
GET方法- 发送一个请求来取得服务器上的某一资源
-
2、
POST方法- 向
URL指定的资源提交数据或附加新的数据
- 向
-
3、
PUT方法- 跟
POST方法很像，也是想服务器提交数据。但是，它们之间有不同。PUT指定了资源在服务器上的位置，而POST没有
- 跟
-
4、
HEAD方法- 只请求页面的首部
-
5、
DELETE方法- 删除服务器上的某资源
-
6、
OPTIONS方法- 它用于获取当前
URL所支持的方法。如果请求成功，会有一个Allow的头包含类似“GET,POST”这样的信息
- 它用于获取当前
-
7、
TRACE方法TRACE方法被用于激发一个远程的，应用层的请求消息回路
-
8、
CONNECT方法- 把请求连接转换到透明的
TCP/IP通道
- 把请求连接转换到透明的
# 4、从浏览器地址栏输入url到显示页面的步骤
- 浏览器根据请求的
URL交给DNS域名解析，找到真实IP，向服务器发起请求； - 服务器交给后台处理完成后返回数据，浏览器接收文件（
HTML、JS、CSS、图象等）； - 浏览器对加载到的资源（
HTML、JS、CSS等）进行语法解析，建立相应的内部数据结构（如HTML的DOM）； - 载入解析到的资源文件，渲染页面，完成。
# 5、如何进行网站性能优化
-
content方面- 减少
HTTP请求：合并文件、CSS精灵、inline Image - 减少
DNS查询：DNS缓存、将资源分布到恰当数量的主机名 - 减少
DOM元素数量
- 减少
-
Server方面- 使用
CDN - 配置
ETag - 对组件使用
Gzip压缩
- 使用
-
Cookie方面- 减小
cookie大小
- 减小
-
css方面- 将样式表放到页面顶部
- 不使用
CSS表达式 - 使用
<link>不使用@import
-
Javascript方面- 将脚本放到页面底部
- 将
javascript和css从外部引入 - 压缩
javascript和css - 删除不需要的脚本
- 减少
DOM访问
-
图片方面
- 优化图片：根据实际颜色需要选择色深、压缩
- 优化
css精灵 - 不要在
HTML中拉伸图片
# 6、HTTP状态码及其含义
1XX：信息状态码100 Continue继续，一般在发送post请求时，已发送了http header之后服务端将返回此信息，表示确认，之后发送具体参数信息
2XX：成功状态码200 OK正常返回信息201 Created请求成功并且服务器创建了新的资源202 Accepted服务器已接受请求，但尚未处理
3XX：重定向301 Moved Permanently请求的网页已永久移动到新位置。302 Found临时性重定向。303 See Other临时性重定向，且总是使用GET请求新的URI。304 Not Modified自从上次请求后，请求的网页未修改过。
4XX：客户端错误400 Bad Request服务器无法理解请求的格式，客户端不应当尝试再次使用相同的内容发起请求。401 Unauthorized请求未授权。403 Forbidden禁止访问。404 Not Found找不到如何与URI相匹配的资源。
5XX:服务器错误500 Internal Server Error最常见的服务器端错误。503 Service Unavailable服务器端暂时无法处理请求（可能是过载或维护）。
# 7、语义化的理解
- 用正确的标签做正确的事情！
html语义化就是让页面的内容结构化，便于对浏览器、搜索引擎解析；- 在没有样式
CSS情况下也以一种文档格式显示，并且是容易阅读的。 - 搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重，利于
SEO。 - 使阅读源代码的人对网站更容易将网站分块，便于阅读维护理解
# 8、介绍一下你对浏览器内核的理解？
-
主要分成两部分：渲染引擎(
layout engineer或Rendering Engine)和JS引擎 -
渲染引擎：负责取得网页的内容（
HTML、XML、图像等等）、整理讯息（例如加入CSS等），以及计算网页的显示方式，然后会输出至显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同，所以渲染的效果也不相同。所有网页浏览器、电子邮件客户端以及其它需要编辑、显示网络内容的应用程序都需要内核 -
JS引擎则：解析和执行javascript来实现网页的动态效果 -
最开始渲染引擎和
JS引擎并没有区分的很明确，后来JS引擎越来越独立，内核就倾向于只指渲染引擎
# 9、html5有哪些新特性、移除了那些元素？
# 10、HTML5的离线储存怎么使用，工作原理能不能解释一下？
# $CSS部分
← Vue学习总结(一)弹性布局总结 →
