共计 5397 个字符,预计需要花费 14 分钟才能阅读完成。
写在后面
笔者三年工作教训,平时工作上也会技术面试一些候选人,听江湖上风闻三年是个坎,目前刚好也有三年没有进去面试了,想进去考验考验本身功底如何?🙃
次要投递了一些 可视化
与基础设施建设
相干方向的职位,通过一个多月次要的面试后果如下:
- 字节:根底工程方向,offer
- 美团:可视化方向,offer
- 百度:小程序方向,业务面挂
- 滴滴:可视化方向,offer
- 360:奇舞团,offer
- 蚂蚁:可视化方向,offer
上面就别离开展面试的一些公司,列出记得的技术与业务面的一些面试题,这里不列出答案,如果对问题感兴趣,自我思考或者播种更大一些
面试考查内容会次要依据集体我的项目经验状况进行考核,故局部内容仅供参考
面试公司
字节
一面
typeof
类型判断状况- 代码执行状况
let a = 0, b = 0;
function fn(a) {fn = function fn2(b) {alert(++a+b);
}
alert(a++);
}
fn(1);
fn(2);
- 代码执行状况
async function async1() {console.log('async1 start')
await new Promise(resolve => {console.log('promise1')
})
console.log('async1 success')
return 'async1 end'
}
console.log('srcipt start')
async1().then(res => console.log(res))
console.log('srcipt end')
- 编程题:实现
add
办法
const timeout = (time) => new Promise(resolve => {setTimeout(resolve, time)
})
const scheduler = new Scheduler()
const addTask = (time, order) => {scheduler.add(() => timeout(time))
.then(() => console.log(order))
}
// 限度同一时刻只能执行 2 个 task
addTask(4000, '1')
addTask(3500, '2')
addTask(4000, '3')
addTask(3000, '4')
.....
//Scheduler?// 4 秒后打印 1
//3.5 秒打印 2
// 3 进入队列,到 7.5 秒打印 3
//...
require('xxx')
查找包过程- 算法题:判断是否有环
function ListNode(val) {
this.val = val;
this.next = null;
}
let a = new ListNode(4);
let b = a.next = new ListNode(1);
let c = b.next = new ListNode(8);
let d = c.next = new ListNode(4);
let e = d.next = b;
// 判断是否有环
// 比方上述是有环的
Vue use
实现逻辑Vue
中nextTick
实现原理Vue
组件中的data
为什么是一个办法
二面
- 聊
Flutter
、React Native
、比照、绘制、原生 API、性能思考、webView
、动态文件分包加载更新、本地动态文件服务器 - 编程手写设计题:门路增加删除的数据结构与办法
- 编程手写设计题:
Alert
组件设计,防止多次重复弹出 AMD
、CMD
、UMD
、Common.js
、ESModule
模块化比照,手写兼容多种模块化函数- 手写
Proxy
实现数据劫持 - 手写
deepClone
- 聊我的项目难点
三面
面试官玉北
- 自我介绍
- 聊成长最多方面
- 聊压力最大的经验
- 聊小组带队的经验,组内成员的造就
- 聊线上事变的经验
- 聊利用
Flutter
做了哪些事件 - 聊本人设计的技术计划
- 聊残缺的零碎设计经验
- 聊前端简单的设计
- 反诘
美图 – A 部门
- 代码题: 局部翻转
// 输出:const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const n = 3
// 输入:[10, 7, 8, 9, 4, 5, 6, 1, 2, 3];
function reverse(arr, n) { }
// 解法一:双指针办法
- 代码题: 数组去反复,如果思考简单类型,思考援用去重
// 数组去重
// 1. Set
// 2. filter O(n2)
// 3. Map
// 4. js 对象 { }
const arr = [1, 1, 2, 3, '1', x, y, z];
const x = {a: 100}
const y = {a : 100}
const z = x
const arr2 = [x, y, z]
function uniq(arr) {// TODO:}
- 如何判断是
new
还是函数调用
function foo() {// new 调用 or 函数调用}
new foo();
foo();
// 思路 1:new.target
// 思路 2:instanceof
// 思路 3:constructor
-
以下函数调用会产生什么状况
function foo() {foo(); } function foo2() {setTimeout(() => {foo2(); }, 0); } foo(); // 会有问题?栈溢出 foo2(); // 会有问题?不会栈溢出 // 什么起因?
requestAnimationFrame
与requestIdleCallback
含意及区别- 聊
chrome
过程模型,新开一个tab
会有哪些线程 - 聊
Compositing Layers
是什么,独立layers
会有什么益处 - 一个透半明背景图片上面有一个按钮,如果产生点击事件后,怎么让按钮触发事件响应
- 聊
z-index
美图 – B 部门
一面
- 聊我的项目(一小时)
- 代码题:微工作宏工作代码执行程序
- 聊
Webwork
通信优化 - 聊离屏渲染,多线程渲染
- 聊
Option
申请 - 聊
relative
、absolute
、fixed
区别?父元素与子元素两个元素都absolute
状况绝对于谁? - 代码题:
Promise
申请并发限度 - 聊
HTTPS
加密
function getData(url) {return new Promise(...)
}
const urls = [url1, url2, ..., urln]
function getDatas(urls) {
}
const p = getDatas(urls)
p.then(function(results) {console.log(results);
})
二面
-
聊我的项目
- 聊最具代表的我的项目
- 最近在干什么事件
- 聊职业倒退指标
- 聊技术与业务衡量
- 代码题:匹配替换值
let s = 'adf{ahhh},{b}dsf,{c}'
let o = {ahhh: 1, b:2, c: 3}
- 聊前端工程化、
CI/CD
- 聊平时有看什么书、什么技术架构的书
- 聊测试驱动开发
- 聊代码标准参考起源、如何落实开发代码标准
- 聊性能监控业务
三面
- 聊我的项目
- 聊成长
- 聊团队
百度
一面
deepClone
-
晓得的设计模式有哪些
- 别离说一下利用场景
- 依赖倒置设计准则、管制反转思维、依赖注入、JS 的依赖注入
- 罕用的
ES6
语法有哪些 -
JavaScript
的var
,let
和const
区别babel
编译for
循环中的let
做的工作
- 闭包
- 作用域
- 原型链
-
聊我的项目编码标准,如何实定位与落实团队标准
- 根底的标准定制起源
ESLint
与Prettier
区别- 编辑格式化与
CLI
格式化触发后果对立
-
聊浏览器输出
URL
产生哪些过程- 浏览器有哪些过程和线程,
electron
有哪些过程 DNS
解析过程TCP
链接过程HTTPS
设计到的内容- 浏览器解析渲染有哪些过程
JS
执行的宏工作与微工作
- 浏览器有哪些过程和线程,
二面
- 聊我的项目
- 手写
vue
中 的双向绑定及Proxy
实现数据劫持 - 我的项目中做过哪些性能优化工作
- 重排与重绘、
requestAnimationFrame
与requestIdleCallback
区别 - 聊
Web Workers
与WebAssembly
技术 - 聊浏览器的缓存
Webpack
打包原理、打包拆分怎么做Babel
工作原理- 聊
SSR
、CSR+SSR
滴滴
一面
- 聊地图可视化场景
- 聊三维渲染库的底层原理
- 聊三维场景点与物体的碰撞检测算法
- 聊
Leaflet
源码、底层实现 - 聊
svg
与Cavans
利用场景区别 -
口试题
/** * 把任意一个函数,润饰生成一个带重试性能的新函数。* 1、如果执行失败,进行重试;* 2、如果执行胜利,间接返回后果;* 3、如果重试了 n 次仍然失败,抛出最初一次的异样。* 4、新函数的体现行为要尽可能与原函数保持一致 * * @param {Function} fn * @param {number} n 最大重试次数 * @return {Function} 带有重试性能的新函数 */ function useRetryable(fn, n) {// TODO}
- 聊我的项目
- 聊
CPU
密集型算法、WebAssembly
技术、Golang
- 聊
Flutter
,3D
是否反对 -
Canvas
大量图斑渲染性能优化- 计算费时场景
- 优化指令
- 工夫分片
- 多线程渲染
- 聊
WebGL
性能优化、着色器分类、动态批量绘制
二面
-
聊
Canvas
性能优化- 分层渲染、
Canvas
通明如何解决 - 工夫分片
requestAnimationFrame
与requestIdleCallback
区别- 遍历像素点优化办法
- 分层渲染、
Webpack
中的loader
与plugin
区别Webpack
的事件用到的设计模式?-
算法题
- 间断子数组的最大和
- 数组中的第 K 个最大元素
- 缺失的第一个负数
三面
- 组件与脚手架工具设计
- 聊三维渲染库外面的渲染流程
- 聊三维中加载栅格与矢量数据对性能影响
-
浏览器的并行申请优化
HTTP 1.1
与HTTP 2.0
- 代码题:
Promise
并发
// fn(params): Promise<Params>
function requestInOrder(requests, initialParam) {// TODO}
const request = (param) => {return new Promise((resolve, reject) => {setTimeout(resolve(param), param)
})
}
requestInOrder([request, request, request], 1000).then(res => console.log(res))
- 聊我的项目中最有挑战的事件
Canvas
渲染多图斑性能优化与如何检测优化成果- 聊
Golang
协程、协程与线程的区别
360
一面
- 自我介绍
- 聊
CPU
密集型代码,聊利用GPU
并行运算 - 看了
Github
没有问大多技术问题,次要介绍聊团队状况(半小时)
二面
- 聊我的项目
- 聊
Code review
- 聊动向状况
- 聊团队规模
- 聊
Golang
与Node.js
区别 - 聊线程与协程、用户态与内核态线程,
Golang
的协程机制 - 聊
Golang channel
与Node callback
- 聊团队参加的产品
蚂蚁
口试题
- 试题一
<!-- 给定 CSV 文件,转换成树结构 -->
interface Person {
name: string;
age: number;
parent: Person[];
children: Person[];}
const csv = `
name,age,parent
Bob,30,David
David,60,
Anna,10,Bob
`;
-
考察点:
- 代码编写标准
- 测试技能把握水平
- 数据结构
- 试题二
-
实现一个前端缓存模块,模块反对设置最大容量,超出容量时采纳
LRU
机制,次要用于缓存xhr
返回的后果,防止多余的网络申请节约,要求:- 生命周期为一次页面关上
- 如果有雷同的申请同时并行发动,要求其中一个能挂起并且期待另外一个申请返回并读取该缓存
- LRU 机制当缓存容量达到下限时,它应该在写入新数据之前删除最久未应用的数据值,从而为新的数据值留出空间。
-
考察点:
- 对
xhr
的了解,用代码解决问题的能力 - 对缓存的解决能力
- 对
- 试题三
在一个 html
canvas
画布上绘制上百个圆,点击其中的一个圆,将其绘制在最下面(原先的绘制不保留),并设置不同的色彩
要求:
- 可能点击选中圆
- 将选中的圆绘制在最下面时,其余的圆的绘制程序不变
- 思考性能优化
口试题代码已放到仓库 ant-fe-interview
一面
- 聊口试题
- 聊工作做的次要事件与内容
- 聊工作中技术预研和选型的思考
- 聊我的项目
- 聊技术遇到比拟辣手的问题
- 聊与共事单干的例子
- 聊前端工程化的思考
二面
- 聊我的项目从开发到上线的流程做的事件
- 聊技术预研的一个案例
- 聊
CPU
密集型算法性能优化深刻,聊 REST 服务并发思考 - 聊天文可视化能够做哪些事件
- 聊工作之外学的货色及实际,
Flutter
、Golang
- 聊目前工作节奏、换工作的思考、对新工作有什么冀望
三面
- 目前这份工作的抉择
- 聊前端是怎么学习的、聊工作是怎么学习的
- 聊比拟深刻理解前端开源的库
- 聊
svg
与Canvas
区别 - 聊罕用的框架
- 聊天文可视化常见的可视化的库
- 聊近几年的业务的倒退和本人的成长
- 聊近几年带给业务的价值
- 聊接下来想做什么事件
- 聊对可视化的了解
- 聊换工作的次要起因
- 聊工作与生存
写在前面
以上就是技术面试的次要内容,面试个别面试官会依据人经验状况进行考查,故局部内容仅供参考。如果平时候选人的经验比拟有内容,面试官可能就不会问过多的八股文,而是更看重我的项目内容,如何思考,如何实现,如何解决问题,带来什么价值等。但也有个别情况,比方投递的方向与本身我的项目经验关联性不大,面试官可能会问更多根底相干的内容。
除此之外,面试过程中虚心,自信与虚心得适当的拿捏好,否则面试官可能认为候选人没有底气,不足对技术的自信。
有时候抉择比致力更重要,投递方向要明确,摸索本人到底想干什么,找到本人的趣味点是最好的。面试过程中可能会有失败,但可能外界因素也占一部分起因,切莫自乱阵脚,毕竟双向选择。
理解更多博文首发地址看看。