前端面试一

1. var let const三者的区别？

Let,const是es6中新的声明命令

Var是声明全局变量，用var声明的变量，在全局内有效，能够跨块级做用域访问，可是不能跨函数访问，var声明的变量可更改，所以在声明的时候没必要赋值，但不建议这么干。Var声明的变量存在变量提高现象，即变量能够在声明以前使用，值为undefined。

Let是声明局部变量的命令，let声明的变量，只在声明的块内有效，不能跨块访问，也不能跨函数访问，let声明的变量可更改，所以在声明的时候没必要赋值，但不建议这么干。Let声明的变量不存在变量提高现象，它所声明的变量必定要在声明后使用，不然报错。Let还存在暂时性死区，也即，在代码块内，let变量必定要在声明后使用，不然就会报错，let变量声明前都是let变量的死区。Let变量不容许重复声明。

Const的用法和let相似，可是const声明的是常量，不可更改，所以在定义的时候就必需要给其赋值。Const也存在暂时性死区，也在其定义的块内才取做用。

2. 如何清除浮动？

1.在父元素后面新增一个空标签，设置css，clear：both；

2.父级div定义 伪类:after 和 zoom

.clearfix:after {
    content: ".";
    display: block;
    height:0;
    clear:both;
    visibility: hidden;
}
.clearfix {
    *zoom:1;
}

3.给父元素设置css，overflow：hidden；

推荐用第二种

3. CSS伪类？

  :focus: 元素得到焦点

:link: 元素未被访问

:active: 正在活动的元素

:before: 在元素前插入内容

:hover: 鼠标移入元素

:visited: 元素已经被访问过

:first-child: 选择第一个匹配的元素

:empty: 内容为空的元素

:nth-child(n): 选择元素的第n个子元素

:nth-of-type(n): 选择元素的第n个与元素相同类的子元素

:last-child： 选择父元素的最后一个元素

4. Position的属性？

1.static 默认标准流

2.Fixed 固定定位，相对于窗口

3.Relative 相对定位 相对于标准流

4.Absoluted 绝对定位 和relative配合使用

5. 数组的内置方法？

  1.length 数组的长度

2.indexOf 搜索一个元素的指定位置，不存在返回-1

3.slice 截取数组的部分长度，而后返回新的数组

4.push() 在数组尾部添加若干内容

5.pop() 删除数组尾部最后一个元素

6.unshift() 向数组头部添加若干内容

7.shift() 删除数组的第一个元素

8.sort() 给数组重新排序

9.reverse() 给数组倒序

10.splice() 从指定的索引开始向数组中添加或者删除元素

11.concat() 把当前的数组和另外一个数组合并为一个新的数组

12.join() 把当前数组用指定字符串链接起来，而后返回新的字符串

6.考察做用域

var a = 'a';
function A() {
    console.log(a);
    var a = 'a';
}
A() ;  //undefined

 

Var声明的变量存在变量提高现象

函数内部又会从新开辟一块空间，若是有变量，继续在函数内变量提高

所以在执行函数的时候，函数内的a变量提高，而后打印在变量的赋值前，所以是undefined

7.setTimeout和setInterval的区别？

   var b = 1;
setTimeout(function () {
    b = 2;

console.log(b)  //2
},0);
console.log(b)  //1

setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,而setInterval()则能够在每隔指定的毫秒数循环调用函数或表达式，直到clearInterval把它清除。

Js有一个主js执行进程，这个进程是页面刚加载的时候页面按照加载顺序执行的js代码，此外还有一个须要在进程空闲的时候执行的代码队列，而定时器的回调函数就是在定时时间到了之后放入这个代码队列进行执行，所以定时器的任务和js任务是并行执行的。

因此虽然定时时间是0, 可是打印的b依然是1，由于是在js主执行进程中执行的代码。

8. localStorage 和 sessionStorage的区别？

localStorage 和 sessionStorage是客户端存储数据的两个对象。

localStorage用于长久保存整个网站的数据，保存的数据没有过时时间，直到手动去除。

sessionStorage 用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页以后将会删除这些数据。

不一样浏览器没法共享localStorage或sessionStorage中的信息，相同浏览器的不一样页面间能够共享相同的 localStorage（页面属于相同域名和端口），可是不一样页面或标签页间没法共享sessionStorage的信息。

9. Cookie 和 webstorage的区别？

webstorage是本地存储，存储在客户端，包括localStorage和sessionStorage，不与服务器端进行通讯，二者的存储大小均为5Mb；

cookie生命期为只在设置的cookie过时时间以前一直有效，即便窗口或浏览器关闭。 存放数据大小为4K左右 。有个数限制（各浏览器不一样），通常不能超过20个。与服务器端通讯：每次都会携带在HTTP头中，若是使用cookie保存过多数据会带来性能问题。但具备极高的扩展性和可用性。同时也存在安全性问题。

 

10. http响应码，200、400、500分别指什么？

200：（OK）：请求成功。通常用于GET与POST请求

400：（Bad Requests）：客户端请求的地址不存在或者包含不支持的参数

500：服务器内部错误，没法完成请求

1XX——信息类（Information），表示收到http请求，正在进行下一步处理，一般是一种瞬间的响应状态。

2XX——成功类（Successful），表示用户请求被正确接收、理解和处理

200（OK）：请求成功。通常用于GET与POST请求

201（Created）：已建立。成功请求并建立了新的资源

202（Accepted）：服务器已接受请求，但还没有处理。正如它可能被拒绝同样，最终该请求可能会也可能不会被执行。

3XX——重定向类（Redirection），表示没有请求成功，必须采起进一步的动做

301（Moved Permanently）：资源被永久移动。请求的资源已被永久的移动到新URI，返回信息会包括新的URI，浏览器会自动定向到新URI。从此任何新的请求都应使用新的URI

302（Found）：资源临时移动。资源只是临时被移动，客户端应继续使用原有URI

304：用其余策略获取资源

4XX——客户端错误（Client Error），表示客户端提交的请求包含语法错误或不能正确执行

400（Bad Requests）：客户端请求的地址不存在或者包含不支持的参数

401（Unauthorized）：未受权，或认证失败。对于须要登陆的网页，服务器可能返回此响应

403（Forbidden）：没权限。服务器收到请求，但拒绝提供服务

404（Not Found）：请求的资源不存在。遇到404首先检查请求url是否正确

5XX——服务端错误（Server Error），表示服务器不能正确执行一个正确的请求（客户端请求的方法及参数是正确的，服务端不能正确执行，如网络超时、服务僵死，能够查看服务端日志再进一步解决）

500（Internal Server Error）：服务器内部错误，没法完成请求

503（Service Unavailable）：因为超载或系统维护（通常是访问人数过多），服务器没法处理客户端的请求 ，一般这只是暂时状态