雪球，通过初筛

0817 字节前端一面（挂）

  • 自我介绍
  • 根据项目经验问答
    • 技术选型与开发架构问题
    • 三个细节问题
    • Echarts用的多，它底层怎么实现的，创建画布、绘制、GPU、shader、硬件调度
    • 如果设置8px字体，怎么保障它准确显示出来
  • 笔试算法
    • 二叉树问题
    • 循环链表问题

总结，技术负责人应该从更高的层面去体现自己，考虑把控整个项目，从技术选型、架构到开发，再到自动化部署与测试，以及系统稳定性、错误监控等方面，而不应该太过于拘泥于业务细节。
简历要体现大局观，面试也要体现大局观，业务部分要精简提炼语言
学习数据结构与算法，刷刷算法题目

0826 龙湖一面 （过）

  • 自我介绍
  • display的inline、inline-block、block区别
  • div.aaa内部div.bbb，样式解析时，从内到外，还是从外到内
  • 跨域如何解决
  • SPA的优缺点
  • vue的data为什么是一个函数
  • vue-route的hash和history区别
  • template模板解析的了解
  • 同一系统的多标签页面怎么通信
  • localSorage和sessionStorage区别
  • XSS、CRFS是什么怎么办
  • Object.difinePropety与Proxy区别

  • setTimeout、Promise、async/await区别

    0831 龙湖二面 （待定）

  • http缓存

  • vue-route
  • vuex的使用和install的实现方式
  • $set的使用
  • 深拷贝浅拷贝，JSON的问题
  • 抽离组件的考虑内容
  • 如何实现一个 n*n 的多宫格布局，保证单元格正方形，同时适配移动端
  • 高可用高并发怎么处理
  • 微前端、BFF、serverlet了解吗

    0826 旷视科技一面 （过）

    上来直接做题 ```javascript // [[1,2],[3,4], [1,2], [5,6]] // [ [1, 2], [3, 4], [5, 6] ]

function myFlt(arr) { // 先内部排序 var temp = arr.map(i => i.sort()) // 然后去重，也可以别的方法 var obj = {} temp.forEach((item) => { obj[JSON.stringify(item)] = item }) return Object.keys(obj).map(i => JSON.parse(i)) }

  1. ```javascript
  2. // 实现一个对象深层合并
  3. objA = {
  4.     a: {
  5.         a_1: 1,
  6.         a_2: {
  7.             a_2_1: 'a',
  8.             a_2_2: null
  9.         }
  10.     },
  11.     b: 'b',
  12.     c: 4
  13. }
  15. objB = {
  16.     a: {
  17.         a_2: {
  18.             a_2_1: 'a!',
  19.             a_2_2: 'a',
  20.             a_2_3: 2
  21.         }
  22.     },
  23.     b: 'c'
  24. }
  26. function deepmerge(input1, input2) {
  27.   if (typeof input1 ==='object' && typeof input2 ==='object') {
  28.     Object.keys(input2).forEach((key) => {
  29.       let item = input2[key]
  30.       if (typeof item === 'object') {
  31.         input1[key] = deepmerge(input1[key], input2[key])
  32.       } else {
  33.         input1[key] = input2[key]
  34.       }
  35.     })
  36.   } else {
  37.     input1 = input2
  38.   }
  39.   return input1
  40. }
  42. deepmerge(objA, objB)
  45. res = {
  46.     a: {
  47.         a_1: 1,
  48.         a_2: {
  49.             a_2_1: 'a!',
  50.             a_2_2: 'a',
  51.             a_2_3: 2
  52.         }
  53.     },
  54.     b: 'c',
  55.     c: 4
  57. }
  • 哪个项目比较得意，遇到什么问题
  • 了解 canvas、webgl、shader 吗
  • vue-route哪些模式，特点是什么
  • 路由如何匹配的，如何更新 ```javascript /document/{id} /document/{id}/edit

/docuemnt/1 /docuemnt/2 /docuemnt/other

path: ‘document/other’ path: ‘document/:id’

route = { name, path, params: { id, } }

按顺序，正则匹配

  2. - 有什么要了解的吗
  4. <a name="wjkNc"></a>
  5. #### 0826 旷视科技二面 （过）
  6. ```javascript
  7. // promise实现一个请求超时
  8. function myFetch(params, time) {
  9.   return new Promise((res, rej) => {
  10.     let timeout = setTimeout(rej, time)
  11.     fetch(parmas).then((result) => {
  12.       clearTimeout(timeout)
  13.       res(result)
  14.     })
  15.   })
  16. }
  1. // 做一个请求取消
  2. function myFetch(params, time) {
  3.   let pReject = null
  4.   const p = new Promise((res, rej) => {
  5.     pReject = rej
  6.     let timeout = setTimeout(rej, time)
  7.     fetch(parmas).then((result) => {
  8.       clearTimeout(timeout)
  9.       res(result)
  10.     })
  11.   })
  12.   p.abort = pReject
  13.   return p
  14. }
  16. 面试官给的答案
  17. function myFetch(params, time, event) {
  18.   return new Promise((res, rej) => {
  19.     event.on('abort', () => {
  20.       rej()
  21.     })
  22.     let timeout = setTimeout(rej, time)
  23.     fetch(parmas).then((result) => {
  24.       clearTimeout(timeout)
  25.       res(result)
  26.     })
  27.   })
  28. }
  30. var event = new Listener()
  31. myFetch(params, time, event)
  32. event.fire('abort')
  1. // 实现一个上面的监听器
  3. function Listener() {
  4.   this.eventList = {}
  5.   this.propetype.fire = function(type) {
  6.     const funcList = this.eventList[type]
  7.     if (funcList) {
  8.       funcList.forEach((func) => {
  9.         func()
  10.       })
  11.     } else {
  12.       throw new Error('xxxxx')
  13.     }
  14.   }
  15.   this.propetype.on = function(type, func) {
  16.     if (!this.eventList[type]) {
  17.       this.eventList[type] = [ func ]
  18.     } else {
  19.       this.eventList[type].push(func)
  20.     }
  21.   }
  22. }
  1. var a = [1,2,6,7,88,95]
  2. var b = [2,4,6,8,11]
  4. var c = [ ...a, ...b ]
  6. // 实现有序数组的合并，合并后依然是有序的
  7. var c = a.concat(b).sort((a, b) => a - b) // 太天真了
  9. // 比较a和b的第一个
  10. // 谁小，删除谁，放到c里
  11. // 相等就两个都删，都放到c里
  12. // 直到a,b其中一个为空时，把另一个剩余部分，全放到c里面
  • 项目上遇到过什么问题，怎么解决的

  • 有什么要了解的吗

    0830 旷世科技三面四面（过）

  • 自我介绍

  • 以往项目的难点
  • 接雨水题目
  • 递增后递减数组，求最大值
  • 自我介绍
  • 项目技术难点及个人收获
  • 再做一次，有什么需要优化的，哪些提升的

  • 三个次介绍一下自己

    0826 翼欧教育ClassIn 一面 （过）

  • 说一下闭包

  • 原型、原型链
  • promise与async/await
  • 如何理解http
  • 对工程化的理解
  • 持续集成怎么做的
  • 微服务框架干了啥

  • 微服务怎么部署，怎么管理的

    0831 翼欧教育ClassIn 二面（过）

  • express 中间件有哪些

  • vue-route或vuex的实现过程
  • redis用过什么功能
  • docker能够封装吗

  • 如何关注新技术，有哪些

    0901翼欧教育ClassIn HR面（待定）

  • 没啥好说的

    0827 白龙马 一面 （过）

  • 讲一下闭包，优缺点，怎么回收内存

  • 防抖与节流
  • 双向绑定原理
  • 引用类型的处理，深层监听
  • 怎样实现一个自己的订阅器（类似旷世科技二面第三题）
  • vue-router模式及原理
  • webpack配置及优化
  • react高阶组件用过吗，装饰器
  • 结合场景封装组件（收集需求，设计组件、提取配置、传参、合并参数、事件、扩展插槽等方面）

  • 组件同时适配el-table与antv-table时的特殊场景（样式重写、方法事件重写与扩展）

    0901 白龙马云行 二面（待定）

  • 深浅拷贝

  • 数据结构知道哪些，堆栈队列树链表等，以及实际的应用
  • 各个版本http协议
  • 长连接，webSocket，断开重连，心跳、假死
  • 路由钩子
  • tab切换，如何保存前一个面板中输入的内容（keep-alive、vuex）

  • 项目相关，占一半时间了

    0831 神策数据一面（待定）

  • 深拷贝浅拷贝，JSON的问题，递归循环引用的问题

  • vue-route
  • vue数据劫持原理，对象和数组怎么处理的
  • 手写事件监听器，比旷视的题目增加一个 once 绑定和off方法
  • 事件队列管理和最大可执行数量的实现
  • 宏任务微任务的执行顺序，及给定题目的输出结果

  • 大数运算，出了bigInt还有什么方法

    1. class Event {
    2. constructor() {
    3.   this.list = {}
    4. }
    6. on() {}
    7.   once() {}
    8. emit() {}
    9. off() {}
    10. }

    ```javascript const p1 = Promise const p2 = Promise

var myShcedule = new Schedule(2)

myShcedule.add().then() myShcedule.add().then()

class Schedule { constructor(count) { } add() {} _schedule() {} }

  1. ```javascript
  2. var a = 1
  3. var obj = {
  4.     a: 2,
  5.   getA: function() {
  6.       console.log(this.a)
  7.   }
  8. }
  9. obj.getA()
  10. // 输出什么，
  11. // 如果用箭头函数呢

滴滴网约车部门 一面 （待定）

  • webpack与rollup区别
    • 他俩 tree-shaking 的区别
    • 做过哪些优化
    • loader和plugin区别
  • 为什么用PG而不是mysql或其他
  • 编程题目三选二
    • 单链表翻转
    • 树的后续遍历
    • 合并两个有序数组，要求时间复杂度为O(n)
  • 程序输出题
  • Promise.race 和 Promise.any 有什么区别，请手写一个 any
  • catch之后还可以跟then吗，finaly呢（都可以）

  • then中的reject和catch有什么区别

    如果在then的第一个函数里抛出了异常，后面的catch能捕获到，而then的第二个函数捕获不到
    catch就是一个then的语法糖

  • Vue2 和 Vue3 有哪些明显区别（数据劫持、compositionAPI、diff算法、Ref）

  • $nextTick 用法及原理 ```javascript // 单链表翻转 function reserve(head) { let cur = head // 1 let next = cur.next // 2 while (cur.next) { let temp = next.next // 3 cur.next = null // 1 -> null next.next = cur // 2 -> 1 cur = next // 2 next = temp // 3 } return cur }

// 合并两个有序数组，例如[1,2,5,7,88], [2,3,5,77,99]，合并为一个数组，要求时间负责度O(n) function (arr1, arr2) { let res = [] while (arr1.length && arr2.length) { if (arr1[0] < arr[0]) { res.push(arr1.shift()) } else if (arr1[0] === arr[0]) { res.push(arr1.shift()) res.push(arr2.shift()) } else { res.push(arr2.shift()) } } return res.concat(arr1, arr2) }

// 程序输出题目 1 async function async1() { console.log(‘async1 start’) await async2() console.log(‘async1 end’) } async function async2() { console.log(‘async2’) } console.log(‘script start’) setTimeout(() => { console.log(‘settimout’) }) async1() new Promise((resolve) => { console.log(‘promise1’) resolve() }).then(() => { console.log(‘promise2’) }) console.log(‘script end’)

// script start // async1 start // async2 // promise1 // script end // async1 end // promise2 // settimeout

// 程序输出题目 2 Function.prototype.a = () => { console.log(1) } Object.prototype.b = () => { console.log(2) } function A() {} const a = new A()

a.a() a.b() A.a() A.b()

// a.a is not a function // 2 // 1 // 2 ```