前端面试

一、Cookie、web storage

cookie
优点：极高的扩展性和可用性
1.通过良好的编程，控制保存在cookie中的session对象的大小。
2.通过加密和安全传输技术（SSL），减少cookie被破解的可能性。
3.只在cookie中存放不敏感数据，即使被盗也不会有重大损失。
4.控制cookie的生命期，使之不会永远有效。偷盗者很可能拿到一个过期的cookie。
缺点：
1.Cookie数量和长度的限制。每个domain最多只能有20条cookie，每个cookie长度不能超过4KB，否则会被截掉。
2.安全性问题。如果cookie被人拦截了，那人就可以取得所有的session信息。即使加密也与事无补，因为拦截者并不需要知道cookie的意义，他只要原样转发cookie就可以达到目的了。
3.有些状态不可能保存在客户端。例如，为了防止重复提交表单，我们需要在服务器端保存一个计数器。如果我们把这个计数器保存在客户端，那么它起不到任何作用。
web storage
包括localStorage和sessionStorage。sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。
Cookie都会被发送过去，这样无形中浪费了带宽。
Cookie的作用是与服务器进行交互，作为Web Storage仅仅是为了在本地“存储”数据而生.

position

absolute 生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。
元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。

fixed 生成绝对定位的元素，相对于浏览器窗口进行定位。
元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。

relative 生成相对定位的元素，相对于其正常位置进行定位。
因此，“left:20” 会向元素的 LEFT 位置添加 20 像素。

static 默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right 或者 z-index 声明）。
inherit 规定应该从父元素继承 position 属性的值。

display:none和visibility:hidden

display:none 隐藏但不占位
visibility:hidden 隐藏占位

link 和@import 的区别

link在页面被加载时会同时被加载；而@import引用的CSS会等到页面被加载完再加载。
link是html标签；@import是CSS提供的。
import只在IE5以上才能识别；而link是HTML标签，无兼容问题;
link方式的样式的权重高于@import的权重.

CSS的盒子模型？

IE 盒子模型、标准 W3C 盒子模型；
IE的content部分包含了 border 和 pading;
盒模型： 内容(content)、填充(padding)、边界(margin)、 边框(border).

CSS3有哪些新特性？

CSS3实现圆角（border-radius），阴影（box-shadow），
对文字加特效（text-shadow、），线性渐变（gradient），旋转（transform）
transform:rotate(9deg) scale(0.85,0.90) translate(0px,-30px) skew(-9deg,0deg);//旋转,缩放,定位,倾斜
增加了更多的CSS选择器 多背景 rgba
在CSS3中唯一引入的伪元素是::selection.
媒体查询，多栏布局
border-image

iframe的优缺点

优点：
解决加载缓慢的第三方内容如图标和广告等的加载问题
并行加载脚本
缺点：
iframe会阻塞主页面的Onload事件；
即使内容为空，加载也需要时间
没有语意

多个标签页之间的通信?

可调用localstorge、cookies等本地存储方式

线程与进程的区别

一个程序至少有一个进程,一个进程至少有一个线程.
线程的划分尺度小于进程，使得多线程程序的并发性高。
另外，进程在执行过程中拥有独立的内存单元，而多个线程共享内存，从而极大地提高了程序的运行效率。
线程在执行过程中与进程还是有区别的。每个独立的线程有一个程序运行的入口、顺序执行序列和程序的出口。但是线程不能够独立执行，必须依存在应用程序中，由应用程序提供多个线程执行控制。
从逻辑角度来看，多线程的意义在于一个应用程序中，有多个执行部分可以同时执行。但操作系统并没有将多个线程看做多个独立的应用，来实现进程的调度和管理以及资源分配。这就是进程和线程的重要区别。

使用哪些工具来测试代码的性能

loadrunner 用的人多、资料全、可以录制，支持java写脚本,推荐入门学习
jmeter该软件开源免费，从性能测试的基本功能角度应该都能满足你的需要
LR提供的功能比JMeter丰富，但是属于商业软件，且费用较高。

减少页面加载时间的方法。

压缩Javascript、CSS代码。优化CSS（压缩合并css，如margin-top,margin-left…)
减少http请求（合并文件，合并图片）。减少调用其他页面、文件的数量。对于同一用户频繁访问的图片、Js脚本文件等可以在Apache或Nginx设置其缓冲时间，例如设置24小时过期时间，这样用户在访问过该页面之后再次访问时，同一组图片或JS不会再重复下载，从而减少了HTTP请求
在文件头部放置css样式的定义， 在文件末尾放Javascript脚本
尽可能减少DCOM元素，尽可能减少网页中各种<>元素数量，例如<table>的冗余很严重，而我们完全可以用<div>取代之。

null和undefined

null： Null类型，代表“空值”，代表一个空对象指针，使用typeof运算得到 “object”，null用来表示尚未存在的对象，常用来表示函数企图返回一个不存在的对象。
undefined是一个表示"无"的原始值，没有返回值的函数返回为undefined，没有实参的形参也是undefined。
undefined是访问一个未初始化的变量时返回的值，而null是访问一个尚未存在的对象时所返回的值。因此，可以把undefined看作是空的变量，而null看作是空的对象。

documen.write和 innerHTML

document.write只能重绘整个页面
innerHTML可以重绘页面的一部分

页面从输入 URL 到页面加载显示完成

分为4个步骤：

• 当发送一个URL请求时，不管这个URL是Web页面的URL还是Web页面上每个资源的URL，浏览器都会开启一个线程来处理这个请求，同时在远程DNS服务器上启动一个DNS查询。这能使浏览器获得请求对应的IP地址。
• 浏览器与远程Web服务器通过TCP三次握手协商来建立一个TCP/IP连接。该握手包括一个同步报文，一个同步-应答报文和一个应答报文，这三个报文在 浏览器和服务器之间传递。该握手首先由客户端尝试建立起通信，而后服务器应答并接受客户端的请求，最后由客户端发出该请求已经被接受的报文。
• 一旦TCP/IP连接建立，浏览器会通过该连接向远程服务器发送HTTP的GET请求。远程服务器找到资源并使用HTTP响应返回该资源，值为200的HTTP响应状态表示一个正确的响应。
• 此时，Web服务器提供资源服务，客户端开始下载资源。