字节跳动抖音前端实习面经（三面+HR面，已入职

背景简述

本人23届CS弱相关专业，自学前端两个月，做过微信小程序的全栈开发项目，简历里写的技术栈是三大件+node+vue，除此之外无开发岗实习经历。当时是有学长给我了部门定向内推，日常实习，整体过程还算挺顺利的，觉得题目也相对基础。

面试问题

一面（约40min

介绍项目
jwt在项目中的具体实现，必要性？为什么不用微信API的鉴权？（答官方文档建议开发者自定登录态）
tcp与udp区别？应用场景？
get与post区别，应用场景？在项目中的使用？
http缓存控制，协商缓存？
https如何保证安全的？加密方式？公私钥交换过程？
跨域是什么？产生条件？在微信小程序中的运用？解决了什么？
jsonp有了解过吗？（答没有什么了解，之前看到跨域解决方案的时候有看到过对比，没有深入了解，熟悉的是cors和nginx反向代理。然后也没有追问下去了）

看输出，解释原因

// 1.局部作用域与全局作用域
let val = 1;
function foo() {
  console.log(val);
}
function bar() {
  let val = 2;
  foo();
}
bar();

// 2.this指向
window.name = 'ByteDance';
function A() {
  this.name = 123;
}
A.prototype.getA = function () {
  return this.name + 1;
};
let a = new A();
let funcA = a.getA;
console.log(funcA());
// 解释完上面答下面这种情况
console.log(a.getA());

// 3.this指向(call)
const obj = {
  birth: 1990,
  getAge(year) {
    let fn = y => y - this.birth;
    return fn.call({ birth: 2000 }, year);
  },
};
console.log(obj.getAge(2020));

// 4.执行顺序
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);
async1();
new Promise(function (resolve) {
  console.log('promise1');
  resolve();
}).then(function () {
  console.log('promise2');
});
console.log('script end');

算法：栈模拟队列剑指 Offer 09. 用两个栈实现队列 - 力扣（LeetCode） (leetcode-cn.com)

二面（约70min

介绍项目，看项目后端中某个具体功能的具体代码（图片上传与处理）
实习经历？（简历上写的hr岗怎么就整开发了呢？噢，原来是用python编写脚本、使用文档，提升部门某项重复性耗时工作的工作效率）
浏览器不同标签页面通信？同源、跨域情况下？（可能我一直都没答到点子上，一直让我说有没有其他的方案，说了好几个能想到的，包括storage api,server侧配合websocket甚至外部应用程序
localStorage，sessionStorage区别？
css实现三角形！（我答的transform: rotate(45deg)然后在父元素overflow: hidden，插问了rotate的旋转中心怎么确定。总之是没答到正解border的点子上）
css position属性有哪些？区别是什么？详细说说fixed的定位方式？

看输出，解释原因

//1也是关于this的，还有闭包，和一面差不多

//2. 作用域？变量提升？
for(var i=0;i<5;i++){
  setTimeout(()=>{
    console.log(i);
  },0) 
}
//3也是关于event loop的，和一面的执行顺序差不多，让具体解释了一下宏任务和微任务

算法：查找json中的children路径
现有如下json（简化为对象），已知每个节点id唯一，编写findNode(id)，返回路径，如findNode(5) 输出 1->4->5
（直接DFS就行，当时一下没想好回溯写了半天没写对，面试结束后两分钟搞定了）
```
{
  id: 1,
  children: [
    { id: 2, children: [{ id: 3, children: [] }] },
    {
      id: 4,
      children: [
        { id: 5, children: [] },
        { id: 6, children: [] },
      ],
    },
    { id: 7, children: [] },
  ],
};
```
算法：合并两个有序数组88. 合并两个有序数组 - 力扣（LeetCode） (leetcode-cn.com)，要求时间O(m+n)。改进：输入的两个数组各自有序，有可能分别是升序，降序情况

三面（约40min

项目整体设计思路与逻辑、架构（感觉很棒的是面试官从项目本身的需求出发，一起探讨了项目的设计和方向，还给项目提出了建设性意见，而不是模板式的让我说有什么难点、解决方案）
前端是怎么学的？
promise原理与实现（我答了发布订阅模式的实现方法，说逻辑没让写代码）
那已经有发布订阅模式了，为什么还要promise（我答promise是用这个模式来解决异步回调地狱问题balabala，扯到了事件循环）
事件队列保存在哪？执行栈呢？

HR面（约20min

时间不长，主要聊了爱好、为什么选择前端？学习方法？详细聊了聊之前的实习经历的工作？读不读研、职业规划？可以实习的时间，公司待遇方面的介绍。

最后

由于篇幅原因，这里分享最有用的面试题部分，我把我的学习历程、面试流程、实习一月的体验的记录与总结（其实挺多废话的hhh）都发在了自己的blog上，这里遵守牛客的相关规章只发名称，不做引流，感兴趣的可以自行在搜索引擎搜索 @西行寺悟空の小站。有任何问题也可以和我在评论区交流，希望大家都能收到理想的offer~

#面经##实习##字节跳动#