WEB前端面经（一）

1、http请求头包含哪些信息？

• Accept：指客户端能够处理的内容类型，在Ajax代码中，可以使用XMLHttpRequest 对象中setRequestHeader函数方法来动态设置这些Header信息

• Accept-Charset：浏览器能够显示的字符集

• Accept-Encoding：浏览器能够处理的压缩编码

• Accept-Language：浏览器优先选择的语言

• Connection：浏览器与服务器之间连接的类型，即是否持久连接

• Cookie：当前页面设置的任何Cookie

• Host：发出请求的页面所在的域

• Referer：发出请求的页面的URL

• User-Agent：浏览器的用户代理字符串，客户端信息
  
  2、http响应头包含哪些信息？

• Age：从原始服务器到代理缓存形成的估算时间（以秒计，非负）

• Cache-Control：告诉所有的缓存机制是否可以缓存及哪种类型

• Content-Encoding：web服务器支持的返回内容压缩编码类型

• Content-type：返回内容的MIME类型

• Date：原始服务器消息发出的时间

• Connection：浏览器与服务器之间连接的类型

• Expires：响应在该日期时间后被认为是失效的

• Last-Modified： 请求资源的最后修改时间

• Server：服务器名字
  
  3、js的变量提升和函数提升？

  在ES6之前没有块级作用域，只有全局和函数作用域。

变量提升

允许变量不声明就可以访问，或声明在后使用在前。如果存在两个同名变量，我们会现在当前作用域中寻找此变量，若有就用这个若没有，就往外 层作用域中寻找。

var age;
console.log(age);// undefined
age = 23; 
function foo() {
  var age;
  console.log(age); // undefined
  var age = 65;
  console.log(age); // 65
}
foo();
console.log(age); // 23

函数提升

预编译之后，引擎把函数的声明整个的提前到当前作用域的顶部，如果在同一个作用域中存在多个同名的函数声明，后面的会覆盖前面的函数声明。
函数声明的优先级最高，会被提升至当前作用域的最顶端，然后才是函数表达式和变量按顺序执行。举例如下：

//第一次调用实际上执行了下面定义的函数声明，而第二次调用时，由于前面的函数表达式与之前的函数声明同名，故将其覆盖，以后的调用也是同样的结果
function hoistFunction() {
    foo(); // 2
    var foo = function() {
        console.log(1);
    };
    foo(); // 1
    function foo() {
        console.log(2);
    }
    foo(); // 1
}
hoistFunction();

4、普通函数和箭头函数的区别？

• 箭头函数是匿名函数，简化了函数的定义，因此不能作为构造函数，不能用new
• 箭头参数不绑定arguments，使用…解决

function A(a){
  console.log(arguments);
}
A(1,2,3,4,5,8);  //  [1, 2, 3, 4, 5, 8, callee: ƒ, Symbol(Symbol.iterator): ƒ]

//箭头参数
let C = (...c) => {
  console.log(c);
}
C(3,82,32,11323);  // [3, 82, 32, 11323]

• 箭头参数不绑定this，会捕获其所在上下文的this值，作为自己的this
• 箭头函数没有原型属性
• 箭头函数不能使用yield关键字

5、js判断一个对象是否为NaN？

对于isNaN()判断的是一个值是否能被Number合法转化为数字。比如，传入字符串的时候，字符串会被先转成NaN，所以最后返回true，(不是数值会先调用 Number 方法转化为数值)，所以对于变量不能直接用isNaN()判断。

console.log(Number(true))	//1
console.log(Number(false))	//0
console.log(Number(123))	//123
console.log(Number('123'))	//123
console.log(Number('abc'))	//NaN
console.log(Number(null))	//0
console.log(Number([]))	//0
console.log(Number(undefined))	//NaN
console.log(Number({}))	//NaN
console.log(Number(function(){}))	//NaN
//数组特殊isNaN([a])=isNaN(a)
console.log(Number([1]))	//1
console.log(Number([1,2]))	//NaN

var a = 'str'
var b = 123
//对于字符串，首先Number(‘str’)将其转化为NaN，即isNaN(NaN)，结果为true
console.log(isNaN(a))	//true
console.log(isNaN(b))	//false

• 方法一（定义）

//完善isNaN的定义
function isNaN(n){
    if (typeof(n) === "number" && isNaN(n))
        return true
    return false
}
var a = 'str'
console.log(Number.isNaN(a))	//false

• 方法二（ES6）

//Object.is()是ES6中比较严格的判断两个值是否相等，但是Object.is(NaN, NaN)为true,Object.is(+0, -0) 为false

var a = 'str'
console.log(Object.is(a,NaN))	//false

• 方法三（利用NaN不等于自身的特点）

function isNaN(n){
    if(n!==n)
        return true
    return false
}
var a = 'str'
console.log(isNaN(a))//false

• 补充，对于不支持Number.isNaN()的老版本浏览器

Number.isNaN = Number.isNaN || function(value) {
                       return  value !== value;
           }