字节商业变现前端一面+二面+三面（offer审批中）

字节效率真高

一面（4.14，40+分钟）

面试官是什么神仙级别呀，太棒了吧！！！

1. new Promise(function(resolve) {
   for(var i=0 ; i < 10 ; i++) {
    resolve(i);
   }
   }).then(function(i) {
   console.log(i);
   });
   new Promise(function(resolve) {
   for(var i=0 ; i < 10 ; i++) {
    function a() {
         resolve(i);
    }
   }
   a();
   }).then(function(i) {
   console.log(i);
   });
   // 上面打印 0
   // 下面打印 10（因为使用 var 定义是函数作用域，不会为每一个 i 保存一块内存）
   // 这里一开始说错了，完全反过来，面试官还引导我说定义了一个函数而不是立即执行，太幸运了

2. 0.1+0.2

3. add(a, b, precision)

4. DOM事件机制
   target/currentTarget

5. tcp三次握手、四次挥手

6. new Function()过程

7. 编程实现
   还原扁平的树结构，结构如下，id表示当前节点id，parentId表示其父节点id。
   const listTree = [
   { id: 1, parentId: 2 },
   { id: 2, parentId: 0 },
   { id: 3, parentId: 4 },
   { id: 4, parentId: 0 },
   { id: 5, parentId: 4 },
   { id: 6, parentId: 2 },
   { id: 7, parentId: 2 },
   { id: 8, parentId: 3 },
   ]

二面（4.16，1h左右）

1. 为什么 JS 的基本数据类型能够拥有方法，为什么对基本数据类型添加属性或者方法不生效

   let str = 'test'
   let str2 = str.substring(2)
   console.log(str2) // st
   const me='bytedance';
   me.age=9;
   console.log(me.age); // undefined

   对于基本类型，在进行一些方法或者属性的操作时，JS 会对其先进行装箱之后调用对应的方法，在 JS 引擎中的操作为

• 在内存中创建一个临时的对应类型实例（比如 String 实例）
• 在实例上调用指定的方法并返回结果
• 销毁这个临时的实例

2. 看输出

   // Q1
   var a = 1;
   function print () {
   console.log(this.a)
   }
   print() // 1
   // Q2
   const obj = {
   a: 2,
   print: function () { console.log(this.a) }
   }
   obj.print(); // 2
   // Q3
   function Person () {
   this.a = 8
   this.print = function () {console.log(this.a)}
   return {a: 9}
   }
   const p = new Person()
   console.log(p.a) // 9
   console.log(p.print()) // 报错，返回的对象中没有 print 方法
   // Q4
   'use strict';
   var a = 1;
   function print () {
   console.log(this.a)
   }
   print() // 报错 不能给 undefined 添加属性

3. 期间聊了关于 symbol、BigInt、==、===
   （录音没有弄好，记不下来）
4. 写题，一道插花的贪心题
5. 写 bind 方法

   这一面很多问题没有回答上来，录音没有弄好，但是问题大致是上面这些，还有一些 react 的

三面（4.19，50+分钟）

1、为什么选择成为一名前端工程师

• 老师实验室里接触到前端
• 开发相关官网
• 喜欢所见所得

2、平时如何学习前端？

• 在 MDN 学习基础
• 书籍
  • 红宝书
  • 你不知道的JS
• B站视频
• React 官网学习、B站学习
• 阮一峰 ES6
• Google、stackoverflow 搜索问题

3、 ES6 的模板字符串？
实现 template(str, data)

let str  =  'my name is {{name}}, age is {{age}}'
let data = {name: 'tom', age: 16 }
function template(str, data) {
    let arr = [];
    let reg = /[\{]{2}([\w]+)[\}]{2}/g;
    return str.replace(reg, function(item) {
        console.log(item);
        const _item = item.slice(2, item.length - 2);
        console.log(_item);
        if (data[_item]) {
            return data[_item]; // 
        } else {
            return "undefined";
        }
    });
}

4、箭头函数有哪些不适用的场景？

• 构造函数
• this 绑定
• 与 this 相关都需要注意
  5、HTTP 常用响应码介绍

  1**：表示服务器收到，需要进一步操作
  2**：表示响应成功
  200： ok
  3**：表示重定向（304表示资源未改变）
  301： 永久重定向
  302：临时重定向
  304：资源未更改（在缓存中使用）
  4**：表示客户端发生错误
  400：客户端错误
  401：身份认证错误
  403：资源不允许访问
  404：资源未找到
  5**：表示服务器发生错误
  500：服务器内部错误

6、TCP 和 UDP 区别
TCP 可靠，面向链接， 1对1， 字节流 HTTP
UDP 不可靠，尽全量交付 1对1 1对多，面向bao'w DNS

7、HTTPS过程 ？
http + ssl
对称加密
非对称加密
CA机构

8、实现一个自己 axois()

• 用 Promise 封装 xhr 写了一下

9、fetch 和 xhr 区别？

• fetch返回 promise
• xhr 有 abort
• fetch 需要调用 json text方法才能获取数据，链式；

10、常用的设计模式介绍？ 实现一个发布订阅；

• 单例
• 发布订阅/观察者
• 代理

面完几分钟 HR 打电话约了晚上9点HR面试

hr 面试就是聊天，然后就给了通过，正在offer审批中