字节跳动真实面试

来源：17-2 社群资源-面试预约

Sunday

2023-07-06

字节面试酷爱 算法题！！

写回答

8回答

Sunday

提问者

2023-07-06

xxx面试记录（tiktok）：2023-03-18

三次技术面，一次 HR 面

一面：技术面

根据简历问项目

二面：技术面（tiktok架构组）

根据简历问项目，主要针对以下聊
多工程公共模块处理方式 vue多工程间公共模块处理最佳实践

多版本怎么管理
私有化怎么更新

lint规范怎么做的如何在前端团队快速落地代码规范

团队怎么落地的
如何衡量lint对代码规范的效果，比如说规范了百分之多少的代码（可以用 CI、CD这种，我没有想到）
目前这个规范还有什么可以改进的嘛

算法：实现一个调度器
算法：JSON转JSX

三面：技术面（tiktok直播组）

组件库：Taro多端组件库的设计与实现
介绍一个你觉得最难的组件，如何设计并实现的（由于这块没有总结过，回答的明显有点磕巴，面试官根据组件延伸了也不少问题）

dropItemMenu，想实现一个用户点击非浮层区域也能关闭，怎么实现

你在组件库承担的什么角色（有点紧张，没有把自己做的事情讲出来）
移动端比较熟悉嘛
webpack性能优化
tree shaking原理
external与dll区别
没有问算法了

四面：HR面

没有让自我介绍，问对面试流程体验怎么样
跳槽你会考虑哪些
那现在你面试的字节的这个岗位符合你的预期嘛
你是怎么判断出符合的
看你不是计算机专业为什么做前端(其实我是学的计算机，只是在一个文科学校学的计算机，每个hr都要这么问我>_<)
不是有技术鄙视链嘛，为什么做前端而不是后端啥的
绩效怎么样

面试总结

简历非常重要，大部分都是根据简历来问，写上去的东西一定要想好怎么说，有些即便你做过很多，但是没说出来也很可惜
八股文就适当的准备就ok，其实这次的跳槽感觉也是对自己知识体系的一个梳理，慢慢发现，从业越久对各个知识点贯通的越好，相比八股文更重要的是实际工作中的解决的问题，有无亮点
算法，还是得准备，算法没写出来，感觉基本就挂了
面试需要自信，不自信面试效果不好，这个是我做的不够的，可能一部分是对自己技术心虚、菜，还有一部分原因是今年的大环境，会让我有点畏手畏脚，害怕没机会
面了几家后其实会感觉面试有些累，就是重复讲一些东西的感觉，面不动的感觉，所以面了几家之后我就放弃了一些基本我不会考虑的公司的面试

Sunday

提问者

2023-07-06

xxx面试记录（非中区商业化）：2023-04-19

字节面试一共4面（三次技术面，一次 HR 面）。特别喜欢 编程题、算法题

一面：技术面

Vue的父子组件传值有哪些方法？详细谈谈。
手写EventEmitter，实现on/emit/off方法。
Vue的响应式原理。
既然刚刚聊到响应式原理，那么下面的代码中，一开始foo=true，接着foo=false，这之后再修改a=123，页面会不会重新render？

<template>
<div v-if=foo>
{{ a }}
</div>
<div v-else>
{{ b }}
</div>
</tempate>

了解预检请求preflight吗？展开谈谈。
webpack的工作流程了解吗？
刚刚提到了plugin，现在有两个plugin，plugin1可以派发事件让plugin2监听吗？
一道事件循环代码题：

async function async1() {
  console.log('async1 start')
  await async2()
  console.log('async1 end')
}
async function async2() {
  console.log('async2')
}
console.log('script start')
setTimeout(function () {
  console.log('setTimeout')
}, 0)
requestAnimationFrame(function () {
  console.log('requestAnimationFrame')
})
async1()
new Promise(function (resolve) {
  console.log('promise1')
  resolve()
}).then(function () {
  console.log('promise2')
})

算法题：请从字符串中找出一个最长的不包含重复字符的子字符串，计算该最长子字符串的长度。例如，输入abcabcbb，那么无重复字符的最长子串是 abc，长度为 3。

二面：技术面

介绍一下https。
知道https中的http请求怎么处理吗？
了解http2的特性吗？
刚刚提到http2有服务器推送功能。http2与websocet都有服务器推送的功能，那么websocket会被http2取代吗？为什么？
使用Array的reduce方法实现map。

Array.prototype.myMap(fn,_this) {
  let result = [];
  this.reduce((prev,cur,index,arr) => {
      result[index] = fn.call(_this,arr[index],index,arr);
  },0)
  return result;
}


//arr.map((item,index,arr) => fn(item),_this);
//arr.reduce((prev,cur,index,arr) => {},start);

事件循环题

async function f1() {
  return new Promise((resolve) => {
    console.log(4)
    resolve()
  }).then(() => {
    console.log(5)
  })
}
async function run() {
  console.log(1)
  new Promise((resolve) => {
    console.log(2)
    resolve()
  }).then(() => {
    console.log(3)
  })
  await f1()
  setTimeout(() => {
    console.log(6)
  }, 0)
  console.log(7)
}
run()

给定一个二进制数组, 找到含有相同数量的0和1的最长连续子数组的长度，例如 [0,0,0,1,1,0,1,0,0]=>6

//先写了个暴力
// function test(arr) {
//     let maxLen = 0;
//     for(let i=0; i<arr.length; i++) {
//         for(let j=i+1; j<arr.length; i++) {
//             let temp = arr.slice(i,j+1);
//             let count0 = 0,count1 = 0;
//             temp.forEach(item => {
//                 if(item == 0) {
//                     count0++;
//                 } else {
//                     count1++;
//                 }
//             })
//             if(count0 == count1) {
//                 maxLen = Math.max(maxLen, j - i + 1);
//             }
//         }
//     }
//     return maxLen;
// }


//前缀和
function test(arr) {
  let len = arr.length
  let map = new Map()
  let count = 0
  let res = 0
  //[0] -> 0
  for (let i = 0; i < len; i++) {
    count += arr[i] == 1 ? 1 : -1
    if (map.has(count)) {
      res = Math.max(res, i - map.get(count))
    } else {
      map.set(count, i)
    }
  }
  return res
}
console.log(test([0, 0, 0, 1, 1, 0, 1, 0, 0]))

三面：技术面

deepclone
vue-router有几种模式？有什么区别？history模式下404后台应该配置什么？
算法题：给定一个整数数组 nums ，找到一个具有最大和的连续子数组（子数组最少包含一个元素），返回其最大和。

var maxSubArray = function (nums) {
  // let res = nums[0];
  // let sum = 0;
  // for(let num of nums) {
  //     if(sum > 0) {
  //         sum += num;
  //     } else {
  //         sum = num;
  //     }
  //     res = Math.max(res,sum);
  // }
  // return res;
  // let res = nums[0];
  // let tep = 0;
  // nums.forEach(num => {
  //     tep = Math.max(num+tep,num);
  //     res = Math.max(res,tep);
  // })
  // return res;


  let n = nums.length
  if (n == 0) return 0
  let dp = new Array(n)
  dp[0] = nums[0]
  for (let i = 1; i < n; i++) {
    dp[i] = Math.max(nums[i], dp[i - 1] + nums[i])
  }
  let res = dp[0]
  for (let i = 0; i < dp.length; i++) {
    res = Math.max(res, dp[i])
  }
  return res
}

Sunday

提问者

2023-07-06

xxx面试记录（pico）：2022-12-23

Pico 北京小鸟看看成立于2015 年4 月，主营业务是VR 软硬件研发制造商，其主要产品为VR 设备和围绕VR 设备的内容平台。后被字节收购

一次技术面试

tranform 原理
浏览器地址栏中输入url后发生了什么
px的理解，dpr是怎么计算的
AO 和 GO
垃圾回收机制

判断输出结果

输出结果、原因是什么

Function.prototype.a = 'function'
Object.ptototype.a = 'object'
function Person() {}
let child = new Person()
console.log(child.a) // 'object'
console.log(Parent.a) // 'function'

编程题

解决以下代码需求：

function timeout(time) {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve()
    }, time)
  })
}
const supervene = new Supervene()
function addTask(time, name) {
  supervene
    .add(() => timeout(time))
    .then(() => {
      console.log(`任务${name}完成`)
    })
}
addTask(10000, 1) // 10000ms后输出 任务1完成
addTask(5000, 2) // 5000ms后输出 任务1完成
addTask(3000, 3) // 8000ms后输出 任务3完成
addTask(4000, 4) // 11000ms后输出 任务4完成
addTask(5000, 5) // 15000ms后输出 任务5完成

Sunday

提问者

2023-07-06

xxx面试记录（广告部门）：2022-11-18

两次技术面试（没过😭）

一面

聊聊你觉得比较有意义的项目
如何实现一个diff工具
获取dom的位置
移动端宽度适配，有哪些单位
this的应用场景
构造函数与bind关系

编码题

写出转化过程

{
  a: {
      b: 'hello ',
      c {
          d: 'world'
      }
  },
  e: 'hello world'
}


// 转换为
{
  'a.b': 'hello',
  'a.c.d': 'world',
  'e': 'hello wolrd'
}

判断函数执行结果

var obj = {};
obj.fun = function foo() {
    console.log(this);
    return () => {
        console.log(this);
        return () => console.log(this);
    }
}
obj.fun()()();

判断代码输出结果：

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('setTimeout')
}, 0)
requestAnimationFrame(() => {
  // 注意这个函数
  console.log('requestAnimationFrame')
})
async1()
new Promise((resolve) => {
  console.log('promise')
  resolve()
}).then(() => {
  console.log('then')
})
console.log('script end')

二面

聊一些我平时的工作内容，在提效方面做了那些工作，最近有做什么分享嘛
二叉树广度优先遍历

Sunday

提问者

2023-07-06

xxx面试记录（基础架构）：2023-03-02

两次技术面试

一面

自我介绍
表单解决方案，jsonSchema协议
前端测网速，一个请求从发送到接受经历了一些步骤，怎么更精准
模态
计算机网络，有待熟练，udp和tcp，dns问题
css object model
dom
白屏问题
大前端非web类的
编译原理（ast）
聊vue3，react--开源贡献
golang
字节晋升，团队影响力
软实力：回答问题过于委婉，培养直白的回答问题的习惯，沟通方式
代码输出结果题（字节文档隐私）
两个手写题（字节文档隐私）
页面从输入URL到展示的过程细节细扒
反问，团队全栈方向

二面

介绍字节产出
计算机网络
操作系统
前端工程化
react diff算法
redis缓存原理，
算法：实现一个迭代器拍平，找到列表中的所有Int类型的数字A
手写：react+ts手写一个组件，样式没完全写出来
面试通过，3分，hr不推进流程了。。。想要3+

Sunday

提问者

2023-07-06

xxx面试记录（懂车帝）：2022-12-15

两次技术面试，一个同事面试，一个 leader 面试：

一面（同事面）

对业务的理解
TypeScript 的泛型及距离，Interface 与 Type 的区别，TypeScript 的高阶用法（Pick,...)，详细聊聊 Omit。
介绍产出，难点
手写：柯里化有些问题，没全
手写：36进制加法
手写：直线上最多的点数
口撕：给一个字符串数组，[＇ a = b ＇,' a = C ’,' b ! c ]，怎么判断是否正确？

二面（leader 面）

说是闲聊，结果变成了面试 😭

我写的代码，用户是怎么访问到的
工程化理解
介绍产出，难点
知道懂车帝业务吗？不知道...
对什么业务方向感兴趣？都不感兴趣，呜呜呜感觉寄了，软实力拉胯，太坦诚清晰了
未来的规划
会议上，会提问吗？会觉得是小白问题不敢问吗？
知道为啥今年hc少吗？
作为RD，怎么推进业务
owner意识
反问：

1. 业务理解重要还是产出重要？不矛盾      
2. 实习生能不能转正看什么？当你不再需要mentor就能了

说好的聊天呢？怎么成面试了，擦，0准备

不知道为神马我参加面试问的这么难，难道因为我是双飞本科吗？？？？

Sunday

提问者

2023-07-06

xxx 面试记录（今日头条）：2023-01-17

三次技术面试，三面挂

一面：技术面

自我介绍
介绍头条项目的功能
具体如何解决搜索遇到的前端异步请求竞态问题
防抖如何做的
记住滚动条位置如何做的/会出现闪动问题吗/手动实现还是用的api
这个功能有没有考虑不同浏览器兼容性的问题
资讯一次渲染多少条加载很多会白屏吗有什么性能问题吗
移动端适配具体怎么做的用的插件原理是什么
如果我想把css中的px转成其他单位，有的我不想转换，让你做这样的插件，有什么思路❌
图片懒加载怎么做的原理是什么加载时机有没有什么优化调整
如果一个图片体积很大加载时间很长有什么优化思路
websocket机器人聊天说一下具体的逻辑功能
为什么不用http 两者有什么区别
如果连接出问题消息收不到有没有考虑怎么解决
有没有什么问题到现在还没有解决说说
博客项目介绍一下
倒计时不准确使用系统时间补偿解决还有什么其他方案吗
http状态码
说说缓存
跨域问题
tcp udp的区别
代码题：数组扁平化/小于n的最大数/sleep函数

二面：技术面

说说头条项目
上拉加载更多下拉刷新逻辑怎么做的
使用的这些组件原理是什么 ❌
切换频道回来的话会留在之前离开的位置吗记住滚动条怎么做的
scroll事件频繁触发怎么办为什么监听这个时间而不是监听频道切换
节流防抖区别手写节流
登录逻辑怎么做的
为什么token时间短为什么用refresh_token
说说浏览器本地存储 cookie localstorage sessionstorage
有两个域名 toutiao.com和 xxx.com 如何实现两个域名之间共享cookie
为什么token不放在cookie里
token方式和cookie方式登录的区别
cookie：服务端使用setcookie字段设置，token需要前端自己存储
cookie存sessionId，不带用户信息，token内部包含用户信息，对服务端压力小
踢掉用户下线，cookie可以后端删掉，token怎么做
项目移动端适配怎么做的
让你写一个px->rem的插件有什么思路❌
vue和jquery有什么区别数据层面
vue双向数据绑定原理为什么把数组和对象分开处理
如果一个对象很庞大有几百个属性如何优化
vue3学了吗 ❌
算法题：连续子数组的最大和
position 的属性值定位都是相对于谁
说说下面代码两个dom的大致布局

blue的position属性值分别为absolute/relative/fixed 的布局效果 解释原因
fixed是相对于根标签，如何让blue的定位是相对于red，而不是根标签
// html
<div class="red">
  <div class="blue"></div>
</div>
// css
.red{
  width: 100px;
  height: 100px;
  background-color: red;
  position: absolute;
  left: 100px;
  top: 100px;
}
.blue{
  width: 100px;
  height: 100px;
  background-color: blue;
  position: absolute/relative/fixed;
  left: 100px;
  top: 100px

三面：技术面

头条项目介绍一下设计思路功能遇到的难点
新闻资讯的内容是怎么获取到的 /开源接口
介绍一下 websoket协议
用http协议完成websocket什么想法 /轮询
acm涉及的算法在前端中有用到过吗 /keep-alive 淘汰组件->LRU算法思想
为什么选择前端
期望加入什么样的一个团队
平时怎么学习前端技术的
vue的优缺点了解过其他框架吗
希望自己工作一年之后达到什么样的自我要求

Sunday

提问者

2023-07-06

xxx 面试记录（实习）：2023-03-26

三轮技术面

一面：技术面

移动端适配具体怎么做的为啥用pxtorem 为啥不直接用rem 直接用rem可以吗
写一个原生的ajax 发送get请求封装一下只有status为200才成功吗
象征问你一下网络问题吧：跨域问题
如何实现组件间的css样式隔离
除了scoped呢 css in js 了解吗
单独设置组件库比如 button的样式怎么做
为什么想做前端如何了解到前端这个岗位的
手写题 safeGet

const data = { a: { a: { b: 1 } } }
let path = 'a.a.b'
let failMsg = 'fail'
function safeGet(data, path, failMsg) {
  let paths = path.split('.')
  for (let p of paths) {
    if (data[p] === undefined) {
      return failMsg
    }
    data = data[p]
  }
  return data
}