一年前端的字节跳动一面问题及答案记录

286 阅读4分钟

问答题

1. HTTP code知道哪些?

我答错的答案

  • 200 成功
  • 300 重定向
  • 301 不知道
  • 304 not modified,需要去缓存找资源
  • 400 Bad Request,发送Http request时,请求参数写错了
  • 401 不知道
  • 403 Not Authorized
  • 404 Page Not Found
  • 406 不知道
  • 409 不知道
  • 500 服务器端有问题
  • 504 Gateway Error

正确答案

HTTP Status Codes

  • 1×× Informational
    • 100 Continue
    • 101 Switching Protocols
    • 102 Processing
  • 2×× Success
    • 200 OK
    • 201 Created
    • 202 Accepted
    • 203 Non-authoritative Information
    • 204 No Content
    • 205 Reset Content
    • 206 Partial Content
    • 207 Multi-Status
    • 208 Already Reported
    • 226 IM Used
  • 3×× Redirection
    • 300 Multiple Choices
    • 301 Moved Permanently
    • 302 Found
    • 303 See Other
    • 304 Not Modified
    • 305 Use Proxy
    • 307 Temporary Redirect
    • 308 Permanent Redirect
  • 4×× Client Error
    • 400 Bad Request
    • 401 Unauthorized
    • 402 Payment Required
    • 403 Forbidden
    • 404 Not Found
    • 405 Method Not Allowed
    • 406 Not Acceptable
    • 407 Proxy Authentication Required
    • 408 Request Timeout
    • 409 Conflict
    • 410 Gone
    • 411 Length Required
    • 412 Precondition Failed
    • 413 Payload Too Large
    • 414 Request-URI Too Long
    • 415 Unsupported Media Type
    • 416 Requested Range Not Satisfiable
    • 417 Expectation Failed
    • 418 I'm a teapot
    • 421 Misdirected Request
    • 422 Unprocessable Entity
    • 423 Locked
    • 424 Failed Dependency
    • 426 Upgrade Required
    • 428 Precondition Required
    • 429 Too Many Requests
    • 431 Request Header Fields Too Large
    • 444 Connection Closed Without Response
    • 451 Unavailable For Legal Reasons
    • 499 Client Closed Request
  • 5×× Server Error
    • 500 Internal Server Error
    • 501 Not Implemented
    • 502 Bad Gateway
    • 503 Service Unavailable
    • 504 Gateway Timeout
    • 505 HTTP Version Not Supported
    • 506 Variant Also Negotiates
    • 507 Insufficient Storage
    • 508 Loop Detected
    • 510 Not Extended
    • 511 Network Authentication Required
    • 599 Network Connect Timeout Error

分析

2. 网络缓存分为哪几类?每一类又分为哪几类?

我答错的答案

  • 强缓存
    • expire
    • cache-control
  • 协议缓存
    • last-modified
    • etag

正确答案

追问

两类协议缓存之间有什么区别?

我答错的答案

精度不同。

分析

3. 前端监控知道吗?

我答错的答案

不知道

正确答案

分析

4. webpack有写过loader或者plugin吗?不仅仅是用过

我答错的答案

没有

正确答案

分析

5. React的setState是同步的还是异步的?

我答错的答案

异步的

追问: 一直是异步的吗?为什么是异步的?它异步的原理是什么?

我答错的答案

不一定一直是异步的。

正确答案

分析

编程题

第一题:函数柯里化

function A(a, b, c, d) {
   return a+b+c+d;
}

// 实现一个curry方法:curry(A)('a')('b')('c')('d')()==='abcd'

我答错的答案

不知道

正确答案

分析

第二题:LRU缓存机制

设计一个MemoryCache工具,支持根据key读写数据,设置缓存上限,当达到了缓存上限的时候,清理旧数据。

我答错的答案 正确答案

分析

追问: for-in和for-of的区别

我答错的答案

不知道

正确答案

  • for...in 语句以原始插入顺序迭代对象的可枚举属性。
  • for...of 语句遍历可迭代对象定义要迭代的数据。
  • for...in遍历的是数组的索引(即键名),而for...of遍历的是数组元素值。 所以for...in更适合遍历对象,不要使用for...in遍历数组。

分析

对数组的遍历大家最常用的就是for循环:

  • JS原生:
    • for (let i = 0; i < length; i++)
  • ES5:
    • forEach
      • 使用break不能中断循环,使用return也不能返回到外层函数。
    • mapfiltersomeeveryreducereduceRight
  • ES6:
    • for...in
    • for...of

五分钟掌握 for...in 和 for...of 区别:

for...in

  • for...in 语句以任意顺序遍历一个对象的可枚举属性。
  • for...in 遍历对象本身的所有可枚举属性,以及对象从其构造函数原型中继承的属性。

for in 应用于数组

Array.prototype.sayHello = function(){
    console.log("Hello")
}
Array.prototype.str = 'world';
var myArray = [1,2,10,30,100];
myArray.name='数组';

for(let index in myArray){
    console.log(index);
}
//输出结果如下
0,1,2,3,4,name,str,sayHello

for in 应用于对象

Object.prototype.sayHello = function(){
    console.log('Hello');
}
Obeject.prototype.str = 'World';
var myObject = {name:'zhangsan',age:100};

for(let index in myObject){
    console.log(index);
}
//输出结果
name,age,str,sayHello

首先输出的是对象的属性名,再是对象原型中的属性和方法。

如果不想让其输出原型中的属性和方法,可以使用hasOwnProperty方法进行过滤

for(let index in myObject){
    if(myObject.hasOwnProperty(index)){
        console.log(index)
    }
}
//输出结果为
name,age

你也可以用Object.keys()方法获取所有的自身可枚举属性组成的数组。

Object.keys(myObject)

可以看出for in 应用于数组循环返回的是数组的下标和数组的属性和原型上的方法和属性,而for in应用于对象循环返回的是对象的属性名和原型中的方法和属性。

使用for in 也可以遍历数组,但是会存在以下问题:

  1. index索引为字符串型数字,不能直接进行几何运算
  2. 遍历顺序有可能不是按照实际数组的内部顺序
  3. 使用for in会遍历数组所有的可枚举属性,包括原型。例如上栗的原型方法method和name属性

for...of

for...of 语句在可迭代对象(包括 Array,Map,Set,String,TypedArray,arguments 对象等等)上创建一个迭代循环,调用自定义迭代钩子,并为每个不同属性的值执行语句。

对于for...of的循环,可以由break, throw 或return终止(使用return报错?)。

for (variable of iterable) {
    //statements
}
  • variable 在每次迭代中,将不同属性的值分配给变量。
  • iterable 被迭代枚举其属性的对象。

for of 应用于数组

Object.prototype.sayHello = function(){
    console.log('Hello');
}
var myObject = {
    name:'zhangsan',
    age:10
}

for(let key of myObject){
    consoloe.log(key);
}
//输出结果
//typeError

for of 应用于对象

Array.prototype.sayHello = function(){
    console.log("Hello");
}
var myArray = [1,200,3,400,100];
for(let key of myArray){
    console.log(key);
}
//输出结果
1,200,3,400,100

for in遍历的是数组的索引(即键名),而for of遍历的是数组元素值。 所以for in更适合遍历对象,不要使用for in遍历数组。

参考:

第三题:函数字面量、this指向

const test = {
	name: 'Bill',
    show1: function() {
    	console.log(this.name);
    },
    show2: () => {
    	function innerFunction() {
        	console.log(this.name);
        }
        innerFunction();
    }
}

// 以下分别输出什么结果?
test.show1();
test.show2();
test.show3();

我答错的答案

Bill
Bill
undefined

正确答案

Bill
undefined
undefined

分析

第四题:Promise

new Promise(() => {
	throw new Error()
}).catch(() => {
	console.log('1')
}).then(() => {
	console.log('2')
})
// 请问输出什么结果?

我答错的答案

[throw an Error]
1

正确答案

[throw an Error]
1
2

分析

catch已经改变了promise的状态为reject了,且catch是then的语法糖,then可以链式调用,故catch之后的then可以被调用。

Behavioral Questions

说说你以前经历里的亮点,技术或者非技术方面都可以,说一点

说说你对自己的规划

你有什么问题要问我吗?

分析

30 Behavioral Interview Questions You Should Be Ready to Answer