牛客网面试题库刷题

20.简述es6中箭头函数

1. 当参数只有一个时可以省略括号
2. 当函数体是单条语句时可以省略{}和return
3. 特点：
   1. 没有this，this只能从外部获取；所以：不能作为构造函数，通过call或apply方法调用函数时，只能传递参数
   2. 没有原型和super
   3. 不能使用yield关键字；所以，不能作为Generator函数
   4. 不能使用arguments
   5. 不能直接返回对象字面量
   6. 适用场景:
      • 适合与this无关的回调：定时器、数组的方法等
      • 不适合与this有关的回调：事件回调、对象的方法

21. call、apply和bind的作用和区别

1. 三者都可以用来改变函数的this指向，具体区别：
   1. fn.call(newThis,params)：第一个参数是this的新指向，后面依次传入函数fn要用到的参数。会立即执行fn函数。常用于实现继承
   2. fn.apply(newThis,paramsArr)：第一个参数是this的新指向，第二个参数是fn要用到的参数数组。会立即执行fn函数
   3. fn.bind(newThis,params)：第一个参数是this的新指向，后面的参数可以直接传递，也可以按照数组的形式传入。不会立即执行函数，且只能改变一次fn函数的指向，后续再用bind更改无效，返回的已经是更改this指向的新fn。

22.this指向

1. this关键字的由来：在对象内部方法中使用对象内部的属性是一个非常普遍的需求，但javascript的作用域机制并不支持这一点，基于这个需求，JavaScript又搞出了另外一套this机制
2. this存在的场景：全局执行上下文、函数执行上下文、eval执行上下文
   1. 全局执行上下文：（在任何函数体外部）’this‘都指向全局对象
   2. 函数执行上下文：
      1. 全局环境中调用函数：this指向全局变量window
      2. 对象调用内部的一个方法：this指向对象本身
      3. 普通函数调用：
         1. 严格模式下：this值为undefined
         2. 非严格模式下：this指向全局对象window
      4. 箭头函数：没有自身的this，this指向取决于外部函数

23.JS变量提升

1. 定义：JS的变量提升指的是JS的变量和函数声明会在代码编译期，提升到代码的最前面
2. 变量提升前提：使用var关键字进行声明的变量
3. 注：
   1. 变量提升只是声明被提升，赋值并不会提升，且函数的声明提升会比变量的提升优先
   2. 使用let和const声明的变量是创建提升，形成暂时性死区，在初始化之前访问let和const创建的变量会报错
4. 提升的结果：可以在变量初始化之前访问变量，返回的是undefined，在函数声明前可以调用该函数

24.map和forEach的区别

1. map有返回值，可以开辟新空间，return一个length和原数组一致的数组

2. forEach默认无返回值，返回结果为undefined，可以通过在函数体内部使用索引修改数组元素

3. map的处理速度比forEach快，而且返回一个新数组，方便链式调用其他数组新方法，比如filter、reduce

25.事件Event loop，宏任务和微任务

1. js是单线程的，主线程在执行时会不断循环往复的从同步队列中读取任务，执行任务，当同步队列执行完毕后再从异步队列中依次执行。
2. 异步任务包括：宏任务和微任务
   1. 宏任务：异步队列中的任务都称为宏任务，每个红任务中都包含了一个微任务队列
      • 包括：执行script标签内部代码、定时器、ajax请求、postMessageMessageChannel、setImmediate，I/O（Node.js）
   2. 微任务：等宏任务中的主要功能都完成后，渲染引擎不急着去执行下一个宏任务，而是先执行当前宏任务中的微任务
      • 包括：promise回调、MutonObserver的回调、Object.observe、process.nextTick

26.ajax创建过程

1. 创建XHR对象：new XMLHttpRequest()

2. 设置请求参数：reqest.open(Mehtod,服务器接口地址)

3. 发送请求：request.send()；若是get请求则不需要参数，post请求需要参数则：request.send(data)

   • post请求还需要设置请求头

4. 监听请求成功后的状态变化：根据状态码进行相应的处理

   • XHR.onreadystatechange=function(){if(XHR.readyState4){if(XHR.status200){…}}}

   • readyState值

     • 0：初始化，此时XHR对象已经创建，但并未初始化open
     • 1：载入，此时已经初始化open，但并未发送请求send
     • 2：载入完成，请求send已经发送
     • 3：交互，可以接收到部分数据
     • 4：数据已经全部返回

   • status值说明

     • 200：成功

     • 404：没有发现文件、查询或URL

     • 500：服务器产生内部错误

27.伪数组和数组的区别

1. 伪数组的类型为Object；数组类型为Array

2. 伪数组可以使用length属性获取长度，也可以使用[index]获取某个元素，但是不能使用数组的其他方法，也不能改变长度，可以使用for…in遍历

3. 伪数组的常见场景：

   1. 函数参数arguments
   2. 原生js获取DOM：document.querySelector(‘div’)等
   3. jquery获取DOM：$(‘div’)

4. 伪数组转换为真数组方法：

   1. Array.prototype.slice.call(伪数组)
   2. [].slice.call(伪数组)
   3. Array.from(伪数组)
   • 注：转换后的数组长度由length属性决定，索引不连续时转换结果是连续的，会自动补位

28. token能否放在cookie中

1. 可以。token一般用来判断用户是否登录，内部包含信息：uid、time、sign(token的前几位以哈希算法压缩成一定长度的十六进制字符串)，token是否过期应该由后端判断，所以token存储在cookie中只要不设置cookie的过期时间就可以了，如果token失效，就让后端在接口中返回固定的状态表示token失效，需要重新登录，重新登录的时候，重新设置cookie中的token就行

2. token认证流程：

   1. 客户端使用用户名和密码请求登录

   2. 服务端收到请求，去验证用户名和密码

   3. 验证成功后，服务端签发一个token，并发给客户端

   4. 客户端接收到token后存储起来，比如放在cookie或者localStorage里

   5. 客户端每次发送请求时都需要带着服务器端签发的token（token放到HTTP的Header里）

   6. 服务端收到请求后，需要验证请求里带有的token，验证成功后就可返回对应的数据

29.new会发生什么

1. 创建一个空的简单的JavaScript对象
2. 为新创建的JavaScript对象添加属性_proto_，将该属性链接至构造函数的原型对象
3. 将新创建的JavaScript对象作为this的上下文
4. 如果该函数没有返回对象，则返回this
5. 注：new关键字后面的构造函数不能是箭头函数