「一周一个大厂」复盘一下 拼多多 的面经，发现不足，逐一击破！

前言

大家好，我是林三心，用最通俗易懂的话讲最难的知识点是我的座右铭，基础是进阶的前提是我的初心

一周一个大厂 是我新出的一个系列文章，大概的流程是这样的：

• 我会收集一些大厂的面经，并试着去回答
• 如果全都会则等待下一周重新一轮
• 如果有不会的，则记录下来，并去克服它们，写成文章，然后下一轮

这个系列的目的就是：逼自己学习，写文章巩固新知识，且复习旧知识

拼多多

今天是 一周一个大厂 的第二期，今天咱们来复盘一下拼多多的面经，发现不足，并逐一击破他们吧！

一面

1、简历项目问询 - 细节

略。。。。。

2、垂直水平居中

• 1、position: absolute + left: 50% + top: 50% + transform: translate(-50%, -50%)
• 2、display: flex + justify-content: center + align-items: center

• 3、display: table-cell + text-align: center + vertical-align: middle

  3、一个简单请求的header会有什么字段

• Accept ：浏览器支持的MIME类型
• Accept-Encoding：gzip, deflate ：浏览器支持的压缩编码是gzip和deflate
• Accept-Language：zh-cn,zh;q=0.5 ：浏览器支持的语言是简体中文和中文，优先支持前者
• Connection：keep-alive ：客户端与服务端的连接类型为持久连接
• Content-length ：内容长度
• Content-type ：内容格式
• Host ：域名
• Origin ：访问来源地址（protocal + host）

• Referer ：访问来源地址（完整）

  4、map、filter、reduce 都怎么用？

  可以看我的文章基础很好？总结了38个ES6-ES12的开发技巧，倒要看看你能拿几分？🐶 里面的 map、filter、reduce 部分

  5、Symbol有了解过过吗？

  可以看我的文章基础很好？总结了38个ES6-ES12的开发技巧，倒要看看你能拿几分？🐶 里面的 Symbol 部分

  6、ES5继承、ES6类继承，静态方法？

• ES5继承：工作中遇到的50个JavaScript的基础知识点 里的 继承方式

• ES6类继承：基础很好？总结了38个ES6-ES12的开发技巧，倒要看看你能拿几分？🐶 里的 Class

  7、Promise 超时控制？

  利用 Promise.all

  const request = (delay) => (
  new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('数据')
    }, delay)
  })
  )
  
  const time = (delay) => (
  new Promise((resolve, rejct) => {
    setTimeout(() => {
      resolve('超时啦！')
    }, delay)
  })
  )
  
  const getData = (delay1, delay2) => (
  Promise.race([request(delay1), time(delay2)])
  )
  
  // 不超时情况
  getData(1000, 2000).then(res => console.log(res))
  // 超时情况
  getData(2000, 1000).then(res => console.log(res))

  8、DFS 找节点

  function depthFirstSearchNoRecursion (target) {
    const res = [];
    const stack = target.slice();
    // console.log(stack)
    while (stack.length > 0) {
        const node = stack.shift(); // 最上层节点出栈
        res.push(node.id);
        // 如果该节点有子节点，将子节点存入栈中，继续下一次循环
        const len = node.children && node.children.length;
        for (let i = len - 1; i >= 0; i--) {
            stack.unshift(node.children[i]);
        }
    }
    return res;
  }

  9、Node有什么特性，适合用来做什么？

  特性

• 1、 它是一个Javascript运行环境
• 2、 依赖于Chrome V8引擎进行代码解释
• 3、 事件驱动
• 4、 非阻塞I/O
• 5、 轻量、可伸缩，适于实时数据交互应用

• 6、 单进程，单线程

  场景

• 1、 高并发（最重要的优点）
• 2、 适合I/O密集型应用

10、midway对比egg有什么优势？

据我所知就是对 typescript 的支持非常好

11、typescript 有没有实践过？

实践过：

• Vue3 + TS + Vite

• React + TS + Vite

  12、平时有用什么设计模式吗？

  可能用了，但是没去注意，没去总结

  13、平时打包工具 - Webpack 相关

  推荐几篇文章吧：

• 2020年了,再不会webpack敲得代码就不香了(近万字实战)

• webpack 十连问你能接住几题

  14、你有没有哪些我没问到你想说的？

  略

  15、缓存相关，cdn 缓存处理？

  CDN缓存 跟 浏览器http缓存 差不多，这一块还不精通，还得看看

  16、你有什么想问的？

  我帅吗？

二面

1、压力面，质疑观点？

略

2、拍平数组

要求

const flatten = (list, level = +Infinity) => {
  // ...
};
const array = [1, [2, [3, 4, [5]], 3], -4];
const list1 = flatten(array);
const list2 = flatten(array, 2);
console.log(list1); // [1, 2, 3, 4, 5, 3, -4]
console.log(list2); // [1, 2, 3, -4]

解题

const flatten = (list, level = +Infinity) => {
  let res = list
  for (let i = 0; i < level; i++) {
    res = [].concat(...res)
    if (!res.some(item => Array.isArray(item))) break
  }
  return res
};

3、Promise

要求

const myPromise = val => Promise.resolve(val);
const delay = duration => {
  // ...
};
myPromise(`hello`)
  .then(delay(1000))
  .then(val => console.log(val)); // 一秒之后输出 hello

解题

const delay = duration => {
  return (val) => (
    new Promise((resolve, reject) => {
      setTimeout(() => resolve(val), duration)
    })
  )
};

三面

1、项目细节询问

略。。。

2、Vue 源码有读吗 - 响应式原理，nextTick

可以看我的Vue源码解析专栏

3、最近有没有研究什么新技术？

唱跳rap

4、项目优化有哪些实践？

略。。。根据自己项目回答这几方面：

• 1、业务方面优化
• 2、请求方面优化
• 3、打包方面优化

• 4、架构方面优化

  5、V8 如何执行一段代码？

• 第一步： Parser 将代码转转 AST（抽象语法树）
• 第二步： 解释器Ignition 生成字节码

• 第三步：执行

  6、72-编辑距离

  不会。。已收集到大厂算法题中

  7、226-翻转二叉树

  不会。。已收集到大厂算法题中

  8、性能优化的实践？

  略。。。根据自己项目回答。。

  9、有其他想问的吗？

  我帅吗

结语

我是林三心，一个热心的前端菜鸟程序员。如果你上进，喜欢前端，想学习前端，那咱们可以交朋友，一起摸鱼哈哈，摸鱼群，加我请备注【思否】