闭包:
闭包:https://segmentfault.com/a/1190000000652891
js链式作用域结构,作用:①函数外部访问局部函数内部变量;②将变量保存在内存里,不会被垃圾回收机制回收
缺点:内存消耗很大，所以不能滥用闭包，否则会造成网页的性能问题，在IE中可能导致内存泄露。解决方法是，在退出函数之前，将不使用的局部变量全部删除
cookie
HTTP
浏览器本地存储:
HTML5中提供了localStorage,持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。
相对比sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。
css相关:
①display:none和visibility:hidden的区别:
display不占空间,visibility(清晰度)透明,任然占空间
②CSS中 link 和@import 的区别
(1) link属于HTML标签，而@import是CSS提供的;
(2) 页面被加载的时，link会同时被加载，而@import引用的CSS会等到页面被加载完再加载;
(3) import只在IE5以上才能识别，而link是HTML标签，无兼容问题;
(4) link方式的样式的权重 高于@import的权重.
③position:absolute和float属性的异同
共同点：
对内联元素设置`float`和`absolute`属性，可以让元素脱离文档流，并且可以设置其宽高。
不同点：
float仍会占据位置，position会覆盖文档流中的其他元素。
④box-sizing属性
主要用来控制元素的盒模型的解析模式。默认值是content-box。
content-box：让元素维持W3C的标准盒模型。元素的宽度/高度由border + padding + content的宽度/高度决定，设置width/height属性指的是content部分的宽/高
border-box：让元素维持IE传统盒模型（IE6以下版本和IE6~7的怪异模式）。设置width/height属性指的是border + padding + content
IE8以下浏览器的盒模型中定义的元素的宽高不包括内边距和边框[注意]:标准浏览器下，按照W3C规范对盒模型解析，一旦修改了元素的边框或内距，就会影响元素的盒子尺寸，就不得不重新计算元素的盒子尺寸，从而影响整个页面的布局。
⑤CSS 选择符有哪些？哪些属性可以继承？优先级算法如何计算？ CSS3新增伪类有那些?
优先级:!important > id > class > tag
important 比 内联优先级高,但内联比 id 要高
伪元素::enabled :disabled 控制表单控件的禁用状态 :checked 单选框或复选框被选中
html相关:
语义化:选择合适的标签
<!DOCTYPE> 声明位于文档中的最前面，处于 <html> 标签之前。告知浏览器以何种模式来渲染文档
DOCTYPE文档类型:严格版本、过渡版本以及基于框架的 HTML 文档,DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现
HTML与XHTML——二者有什么区别:
XHTML相对更加严谨,比如图片必须加文字说明,所有标签的元素和属性的名字都必须使用小写
常见兼容性问题:
①浏览器默认的margin和padding不同。解决方案是(初始化css里)加一个全局的*{margin:0;padding:0;}来统一
②Chrome 中文界面下默认会将小于 12px 的文本强制按照 12px 显示, 可通过加入 CSS 属性 -webkit-text-size-adjust: none; 解决.
③超链接访问过后hover样式就不出现了 被点击访问过的超链接样式不在具有hover(悬停)和active了解决方法是改变CSS属性的排列顺序:L-V-H-A : a:link {} a:visited {} a:hover {} a:active {}---爱恨原则LoVe/HAte
清除浮动:
①直接给父级添加高度,前提是知道并计算好内容高度
②在父级标签尾部,添加标签<div class="clear"></div>,然后给clear类添加css属性:clear:both;
即额外标签法<div style="clear:both;"></div>（缺点：不过这个办法会增加额外的标签使HTML结构看起来不够简洁）
③比较简便的方法:给父级添加css属性:overflow:hidden;即可.因为这个属性是把父级紧贴内容,从而实现清除浮动.
DOM操作——怎样添加、移除、移动、复制、创建和查找节点
（1）创建新节点
createDocumentFragment() //创建一个DOM片段
createElement() //创建一个具体的元素
createTextNode() //创建一个文本节点
（2）添加、移除、替换、插入
appendChild()
removeChild()
replaceChild()
insertBefore() //在已有的子节点前插入一个新的子节点
（3）查找
getElementsByTagName() //通过标签名称
getElementsByName() //通过元素的Name属性的值(IE容错能力较强，会得到一个数组，其中包括id等于name值的)
getElementById() //通过元素Id，唯一性
html5和html的区别 :
可以大致理解为:HTML 5 ≈ HTML4.0+CSS3+JS+API
①在文档声明上，HTML5更加简洁,<!DOCTYPE html>.而HTML有很长段代码,如<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
②结构语义上更加优化<header> 、<nav>、<article>、<aside>、<footer>.
③添加了许多新功能:绘图,视频标签等
实现浏览器内多个标签页之间的通信:
调用localstorge,cookies等本地存储
减少页面加载时间的方法:
①优化css;②优化图片;③标明高度和宽度（如果浏览器没有找到这两个参数，它需要一边下载图片一边计算大小，如果图片很多，浏览器需要不断地调整页面。这不但影响速度，也影响浏览体验。
当浏览器知道了高度和宽度参数后，即使图片暂时无法显示，页面上也会腾出图片的空位，然后继续加载后面的内容。从而加载时间快了，浏览体验也更好了。）
css link和@import区别用法:
都是引入css到html,用法:
①在html里
<style type="text/css">
@import url(CSS文件路径地址)
</style>
②在css里
直接使用
@import url(CSS文件路径地址)
<link>是html标签，只能放入html源代码中使用，@import可看作为css样式，作用是引入css样式功能。@import在html使用时候需要<style type="text/css">标签，同时可以直接“@import url(CSS文件路径地址);”放如css文件或css代码里引入其它css文件
null和undefined的区别:null是不存在;而undefined是未定义
new操作符:
1、创建一个空对象，并且 this 变量引用该对象，同时还继承了该函数的原型。
2、属性和方法被加入到 this 引用的对象中。
3、新创建的对象由 this 所引用，并且最后隐式的返回 this
js延迟加载的方式:
defer和async、动态创建DOM方式（创建script，插入到DOM中，加载完毕后callBack）、按需异步载入js
是将 js 切分成许多模块,就像图片的延迟加载，在图片出现在可视区域内时（在滚动条下拉）才加载显示图片。
js异步加载:http://blog.csdn.net/m13666368773/article/details/7586106
同步加载:和开发的瀑布模型类似,会阻止浏览器的后续处理,比如文件的加载,渲染等
之所以要同步执行，是因为 js 中可能有输出 document 内容、修改dom、重定向等行为
解决跨域问题:jsonp的原理是动态插入script标签
documen.write和 innerHTML的区别:
①document.write只能重绘整个页面
②innerHTML可以重绘页面的一部分
判断当前脚本运行在浏览器还是node环境中:
控制台检验alert(this);判断Global对象是否为window，如果不为window，当前脚本没有运行在浏览器中
对前端界面工程师这个职位是怎么样理解的？
前端是最贴近用户的程序员，比后端、数据库都更加近。
1、实现界面交互;2、提升用户体验
页面从输入 URL 到页面加载显示完成，这个过程中都发生了什么?
连接建立TCP/IP连接，浏览器会通过该连接向远程服务器发送HTTP的GET请求。远程服务器找到资源并使用HTTP响应返回该资源，值为200的HTTP响应状态表示一个正确的响应。Web服务器提供资源服务后，客户端开始下载资源。
平时如何管理你的项目？
先确定好确定好全局样式（globe.css），编码模式(utf-8)
页面进行标注（例如 页面 模块 开始和结束）；标注模块
javascript对象的几种创建方式;
1，工厂模式2，构造函数模式3，原型模式
[注意]ajax过程
(1)创建XMLHttpRequest对象,也就是创建一个异步调用对象.
(2)创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息.
(3)设置响应HTTP请求状态变化的函数.
(4)发送HTTP请求.
(5)获取异步调用返回的数据.
(6)使用JavaScript和DOM实现局部刷新.
异步加载和延迟加载
1.异步加载的方案： 动态插入script标签
2.通过ajax去获取js代码，然后通过eval执行
3.script标签上添加defer或者async属性
4.创建并插入iframe，让它异步执行js
5.延迟加载：有些 js 代码并不是页面初始化的时候就立刻需要的，而稍后的某些情况才需要的。
GET和POST区别:
Get是通过地址栏来传值，而Post是通过提交表单来传值
GET：一般用于信息获取，使用URL传递参数，对所发送信息的数量也有限制，一般在2000个字符 POST：一般用于修改服务器上的资源，对所发送的信息没有限制。
Javascript无阻塞加载具体方式:
将脚本放在底部。<link>还是放在head中，用以保证在js加载前，能加载出正常显示的页面。<script>标签放在</body>前
ajax的缺点
在客户端运行，承担了一部分本来由服务器承担的工作，减少了大用户量下的服务器负载
1、安全问题 AJAX暴露了数据交互的细节。
2、不容易调试。
前端模块化:
使用define定义模块，使用require调用模块,export导出模块
网站重构:优化网站
输入url到页面加载完成经历了什么?
①URL包含协议,IP,资源路径.所以输入地址后会先查找IP,然后向服务器发送HTTP请求
②服务器处理好请求后,返回一个HTTP响应,浏览器显示HTML中资源
③根据资源类型进行渲染
cookie:
可以将数据持久保存在客户端,但有大小限制
初始化CSS样式:解决浏览器兼容性
JSON 是存储和交换文本信息的语法,用于数据交换
①向服务器发送数据时一般是字符串,可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串。
②接收服务器数据时一般也是字符串,可以用 JSON.parse() 方法将数据转换为 JavaScript 对象
MongoDB
非关系型数据库,将数据存在文档里,数据结构由键值对组成,文档类型相当JSON对象
一个mongodb中可以建立多个数据库。
默认数据库为"db"，该数据库存储在data目录中
AngularJS
AngularJS是一个JS框架。通过指令扩展了HTML，且通过表达式绑定数据到HTML
跨域:
网址:http:// www . google : 8080 / script/jquery.js
http:// （协议号）www （子域名）google （主域名）8080 （端口号）script/jquery.js （请求的地址）
定义: 当协议、子域名、主域名、端口号中任意一各不相同时，都算不同的域
处理跨域方法:代理,通过后台获取其他域名下的内容,再返回给前端.也就是A的服务在后台做了一个代理，前端只需要访问A的服务器也就相当与访问了B的服务器。这种代理属于后台的技术
CSS相关:
①z-index 属性设置元素的堆叠顺序
②position类型:absolute,relative,fixed,static(默认无定位)
③水平居中:行级元素设置其父元素的text-align.块级元素设置其本身的left 和 right margins为auto
④垂直居中:
1.单行文本垂直居中:line-height
2.图片垂直居中:
①父级元素设置line-height;图片设置(垂直)vertical-align: middle;(正中)
②适用：通用
<div id="parent">
<div id="child">Content here</div>
</div>
#parent {display: table;}
#child {display: table-cell;vertical-align: middle;}
低版本 IE fix bug：
#child {display: inline-block;}
3.多行内容居中，且容器高度可变:给出一致的 padding-bottom 和 padding-top
4.把容器当作表格单元:
CSS 提供一系列diplay属性值，包括 display: table, display: table-row, display: table-cell 等，能把元素当作表格单元来显示。这是再加上 vertical-align: middle, 就和表格中的 valign="center" 一样了。
display: table-cell;height: 300px;vertical-align: middle;
垂直居中例子网址:http://www.blueidea.com/tech/web/2006/3231.asp
HTTP协议网络:
是基于TCP的应用层协议,客户端和服务端数据传输的格式和数据交互行为,最初是用来向客户端传输HTML页面的内容
通常，由HTTP客户端发起一个请求，建立一个到服务器指定端口（默认是80端口）的TCP连接。
{TCP基于字节流的传输层通信协议}
HTTP服务器则在那个端口监听客户端发送过来的请求。一旦收到请求，服务器（向客户端）发回一个状态行，比如"HTTP/1.1 200 OK"，和（响应的）消息，消息的消息体可能是请求的文件、错误消息、或者其它一些信息
用于从WWW服务器传输超文本到本地浏览器的传输协议,输入URL(统一资源定位符)确定后,HTTP从服务器提取网页代码到浏览器进行渲染
盒子模型:
页面布局时所用,标准W3C盒子模型和传统IE盒子模型.
区别:标准盒子模型content只是content,而IE的content包含padding,border
行内元素和块级元素的区别:
块级元素会自动换行，而行内元素不会自动换行
行内元素设置width无效，height无效(可以设置line-height)，margin上下无效，padding上下无效
行内元素转换为块级元素display:block
行内块级元素
在IE8以下的兼容性
div {
display： inline-block；
*zoom： 1；
*display： inline；
}
解析：
*zoom：1作用是在IE下触发hasLayout
*display：inline作用作用是一旦触发了hasLayout设置display：inline和display：block效果相似。
文档流和文本流:
文档流是相对于盒子模型讲的
文本流是相对于文子段落讲的
元素浮动之后，会让它跳出文档流，也就是说当它后面还有元素时，其他元素会无视它所占据了的区域，直接在它身下布局。但是文字却会认同浮动元素所占据的区域，围绕它布局，也就是没有拖出文本流。
相关推荐
阿里前端面试问题汇总以及集团面试题汇总
9月份亲自出去面试，跑的所有公司，面试官问的问题总结。 没有答案，只有问题。
阿里前端面试问题汇总.doc
2023最新前端面试题总结
前端面试题总结
最新BAT 面试题、WEB前端开发考试参考题、模拟面试常问问题汇总、前端面试宝典等......
前端面试题汇总
前端面试题汇总-分享一下，给面试前端的朋友
前端面试常见问题前端面试常见问题前端面试常见问题前端面试常见问题前端面试常见问题前端面试常见问题前端面试常见问题前端面试常见问题前端面试常见问题前端面试常见问题前端面试常见问题前端面试常见问题前端面试...
web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题...
2022年前端面试题汇总.pdf
Web前端开发，最新的各大公司的面试题，有兴趣的朋友拿去学习......
个人前端面试题的一些汇总和面试题网址
这里将收集我做过的所有的前端面试笔试题，并根据自己的理解提供解答，以及一些关于前端...23.md 最全前端面试问题及答案总结 General 24.md 阿里航旅前端开发校招面试题 General 25.md ElemeFE Node 面试题 General
前端面试总结前端面试总结前端面试总结前端面试总结前端面试总结前端面试总结前端面试总结
2021年前端面试题汇总.pdf
「2021」高频前端面试题汇总之JavaScript篇