面试要点




1、includes(es7) 与 indexOf()(es6)

  • indexOf():可返回某个指定的字符串值在字符串中首次出现的位置,如果要检索的字符串值没有出现,则返回 -1.【数组、字符串】
  • includes():判断一个数组是否包含一个指定的值,返回布尔值,类似于indexOf().【数组】
    includes()indexOf()的优势在于,indexOf()的返回结果不是布尔值,须与-1对比,不够直观。
let s = 'Hello world!';
s.includes('o') // true

2、promise(es6)与async/await(es8)
异步=》同步
(1)Promise 是异步编程的一种解决方案。


Promise.all()并行执行异步任务。
Promise.race()获得先返回的结果即可。

Promise 概括来说是对异步的执行结果的描述对象。

Promise优点:

  • Promise最大的好处是在异步执行的流程中,把执行代码和处理结果的代码清晰地分离了。
  • 解决回调地狱(Callback Hell)问题

(2)async/await
虽然promise跳出了异步嵌套的怪圈,用链式表达更清晰,但是当大量异步请求流程时满屏的then()看起来很吃力,es7提出的async/await就是为了解决这种复杂情况。
async,会返回一个promise对象。如果async函数中是return一个值,这个值就是Promise对象中resolve的值;如果async函数中是throw一个值,这个值就是Promise对象中reject的值。
await会暂停当前async函数的执行,等待后面的Promise的计算结果返回以后再继续执行当前的async函数

3、http与https

  • HTTP 标准端口是80 ,而 HTTPS 的标准端口是443
  • HTTP 无法加密,而HTTPS 对传输的数据进行加密
  • HTTP无需证书,而HTTPS 需要CA机构(如Wosign)的颁发的SSL证书

HTTP + 加密 + 认证 + 完整性保护 = HTTPS

4、flex弹性布局
拥有更好的重排性能
display: flex;
justify-content: center; /* 水平居中 /
align-items: center; /
垂直居中 */

5、HMR
(1)什么是热更新:不刷新页面即看到变化。
(2)热更新需要安装的配置:
webpack-dev-server(或webpack-dev-middleware
(3)为 Webpack 开发环境开启热更新

  • 使用 HotModuleReplacementPlugin 插件
  • 打开 webpack-dev-server 的热更新开关

(4)webpack热更新原理:

1、Webpack编译期,为需要热更新的 entry 注入热更新代码(EventSource通信)
2、页面首次打开后,服务端与客户端通过 EventSource 建立通信渠道,把下一次的 hash 返回前端
3、客户端获取到hash,这个hash将作为下一次请求服务端 hot-update.js 和 hot-update.json的hash
4、修改页面代码后,Webpack 监听到文件修改后,开始编译,编译完成后,发送 build 消息给客户端
5、客户端获取到hash,成功后客户端构造hot-update.js script链接,然后插入主文档
6、hot-update.js 插入成功后,执行hotAPI 的 createRecord 和 reload方法,获取到 Vue 组件的 render方法,重新 render 组件, 继而实现 UI 无刷新更新。

6、小程序父子组件传值,父组件的值是异步请求得到的,子组件怎么样拿到这个值,或者说你怎么处理这种情况?
父组件异步获取到数据后,this.selectComponent选中子组件,再调用子组件的方法。