芯安微众

工作职责

面试

自我介绍

• 面试官您好，我叫宋兴国，有2 年全栈开发经验，有 3 年的小程序、Vue 开发经验，有 3 个上线项目和微信小程序有 4 个 Demo 项目，有使用 uniapp进行多端开发的经验。最近实现了大文件分片上传的DEOM。
• 在上家公司作为开发负责人负责播放器项目技术选型工作，从 0 到 1为公司搭建了前端播放器。注重前端标准化，在部门内部推行了前端规范的落地。
• 自己喜欢折腾，拥有自己的知识库和Node. js搭建的命令行工具，用于沉淀最佳实践和提高开发效率，并且知识库公开发布到线上。

反问

技术相关

• 你觉得我的技术有什么问题？
• 咱们公司的技术栈是什么？
• 岗位的任务和团队的风格？
• 技术团队规模？
• 目标用户、用户体量，产品优势，怎么盈利？
• 晋升路线。

HR（没问）

• 工作时间？
• 现在加班的强度
• 请问公司的调薪是怎么样的呢？
• 几轮面试？

面试内容

• 搭建前端播放器，具体哪些功能？使用了哪些技术？
  • 视频画面上圈点画，使用canvas进行实现
  • 使用canvas实现了视频比例的裁切, 具体用到那个方法？fillRect和clearRect, strokeRect 矩形
  • 使用 hls.js对视频播放器进行个性化处理
  • 视频帧预览，雪碧图和 background-position
  • 图片地图
  • 视频转码中
• 你有研究过第三方库运用了前端的哪些知识吗？多媒体前端手册
• 前端播放器有卡顿的处理？清晰度、开启缓存
• 前端标准化做了哪些东西？目录规范、git 提交规范（commitlint）、编辑器规范（eslint、Vetur、Prettier、编辑器统一使用VSCode）、代码编写规范(组件大驼峰、遵循BEM规范)、播放器文档（vue-styleguidist）
• 什么情况下会产生代码冲突？遇到冲突怎么解决？开发的工作安排是怎么安排的？
• three.js 实现了一个DEMO 项目是一个关于什么的项目？
• 移动端适配是如何做的？
  • 移动端适配： rem、媒体查询、 viewport、vw、vh
• flex都有哪些具体的属性？如何实现水平垂直居中？Flex 布局教程：语法篇、元素水平垂直居中的方法有哪些！如果元素不定宽高呢！
• 如何解决 margin 塌陷？margin 合并
• js的基础数据类型？JS 中的 8 种数据类型及区别
• 数组有哪些常用方法？Map和forEach有哪些区别？fliter有什么区别、不符合条件会返回什么？Array 对象、每个开发者都应该知道的 forEach() 和 map() 的区别、@数组常考方法（forEach,Map,Reduce,Filter） - 掘金，可以返回新数组、可以链式调用。
• 解释一下什么是深拷贝和浅拷贝？如何实现一个深拷贝？Object.assign 是浅拷贝还是深拷贝？深拷贝浅拷贝的区别！如何实现一个深拷贝！
• 对象还用过哪些方法？hasOwnProperty，Object 对象的相关方法、Object 对象
• 用得最多的是Vue2、Vue3还是React？
• 介绍一下阅流是怎么一步步实现的，都用了哪些前端的技术？
  • 视频
  • 图片
  • 文档
• 阅流是H5、Web、小程序项目？H5端有遇到视频打不卡的情况吗？H5 播放视频常见bug及解决方案

反思

• 想三秒再回答，先弄清楚面试官的问题
• 说做的事情时要落实到具体的技术和API