收錄字節(jié)面試題:
一面
1.說(shuō)一下瀏覽器緩存?
???♀? 瀏覽器緩存
2.cookie 與 session 的區(qū)別
Session 是在服務(wù)端保存的一個(gè)數(shù)據(jù)結(jié)構(gòu),用來(lái)跟蹤用戶的狀態(tài),這個(gè)數(shù)據(jù)可以保存在集群、數(shù)據(jù)庫(kù)、文件中;Cookie 是客戶端保存用戶信息的一種機(jī)制,用來(lái)記錄用戶的一些信息,也是實(shí)現(xiàn) Session 的一種方式
https://zhuanlan.zhihu.com/p/27561547
3.瀏覽器如何做到 session 的功能的。
其實(shí)就是考察 http 怎么處理無(wú)狀態(tài)是怎么處理的,具體可見 COOKIE 和 SESSION 有什么區(qū)別?里面的答案。
4.解釋一下:csrf 和 xss
XSS:惡意攻擊者往 Web 頁(yè)面里插入惡意 Script 代碼,當(dāng)用戶瀏覽該頁(yè)之時(shí),嵌入其中 Web 里面的 Script 代碼會(huì)被執(zhí)行,從而達(dá)到惡意攻擊用戶的目的。
CSRF:CSRF 攻擊是攻擊者借助受害者的 Cookie 騙取服務(wù)器的信任,可以在受害者毫不知情的情況下以受害者名義偽造請(qǐng)求發(fā)送給受攻擊服務(wù)器,從而在并未授權(quán)的情況下執(zhí)行在權(quán)限保護(hù)之下的操作。
詳見:前端安全面試題
5.怎么防止 csrf 和 xss
詳見:前端安全面試題
6.CORS 是如何做的?
服務(wù)端設(shè)置 Access-Control-Allow-Origin 就可以開啟 CORS。
7.對(duì)于 CORS ,Get 和 POST 有區(qū)別嗎?
其實(shí)想考察的就是什么時(shí)候會(huì)有預(yù)檢請(qǐng)求(option 請(qǐng)求)。
8.了解 HTTPS 的過(guò)程嗎?
推薦浪浪的 深入理解 HTTPS 工作原理
9.webpack 如何做性能優(yōu)化
webpack 做性能優(yōu)化主要是考慮打包體積和打包速度。
體積分析用 webpack-bundle-analyzer 插件,速度分析用:speed-measure-webpack-plugin 插件。
打包速度優(yōu)化瓶子君的:玩轉(zhuǎn) webpack,使你的打包速度提升 90%。
10.跨域的處理方案有哪些
常用的:jsonp、CORS、nginx 代理,完整的大概是九種,可見:九種跨域方式實(shí)現(xiàn)原理(完整版)
11.es module 和 commonjs 的區(qū)別
高頻題,考察 ES6 模塊和 CommonJS 模塊 的區(qū)別。關(guān)鍵點(diǎn):1. 前者是值的引用,后者是值的拷貝。2.前者編譯時(shí)輸出接口,后者運(yùn)行時(shí)加載。
推薦文章:前端模塊化:CommonJS,AMD,CMD,ES6
12.react 里如何做動(dòng)態(tài)加載
React.lazy ,另外通過(guò) webpack 的動(dòng)態(tài)加載:import() 和 ensure.require
13.動(dòng)態(tài)加載的原理是啥,就是 webpack 編譯出來(lái)的代碼
講道理 webpack 動(dòng)態(tài)加載就兩種方式:import()和 require.ensure,不過(guò)他們實(shí)現(xiàn)原理是相同的。
我覺(jué)得這道題的重點(diǎn)在于動(dòng)態(tài)的創(chuàng)建 script 標(biāo)簽,以及通過(guò) jsonp 去請(qǐng)求 chunk,推薦的文章是:webpack 是如何實(shí)現(xiàn)動(dòng)態(tài)導(dǎo)入的
14.筆試題:頁(yè)面結(jié)構(gòu)包括頁(yè)頭(永遠(yuǎn)在頂部)、主體內(nèi)容、頁(yè)腳,頁(yè)腳永遠(yuǎn)在頁(yè)面底部(不是窗口底部),即內(nèi)容高度不夠時(shí),頁(yè)腳也要保證在頁(yè)面底部
常規(guī)題,考察基本的布局
15.筆試題:寫 new 的執(zhí)行過(guò)程
我們先來(lái)看,new 實(shí)現(xiàn)的功能
// Otaku 御宅族,簡(jiǎn)稱宅
function Otaku (name, age) {
this.name = name;
this.age = age;
this.habit = 'games';
}
// 因?yàn)槿狈﹀憻挼木壒剩眢w強(qiáng)度讓人擔(dān)憂
Otaku.prototype.strength = 60;
Otaku.prototype.sayYourName = function() {
console.log("i, am "+ this.name);
}
var person = new Otaku("kevin", 18);
console.log(person.name); //kevin
console.log(person.habit); //games
console.log(person.strength); //60
person.sayYourName(); //i, am kevin
我們可以看出,返回一個(gè)新得對(duì)象 person,然后person可以訪問(wèn)構(gòu)造函數(shù) Otaku 的屬性 和Otaku.prototype的屬性。
new 的執(zhí)行過(guò)程大致如下:
- 創(chuàng)建一個(gè)對(duì)象
- 將對(duì)象的 __proto__ 指向 構(gòu)造函數(shù)的 prototype
- 將這個(gè)對(duì)象作為構(gòu)造函數(shù)的 this
- 返回該對(duì)象
根據(jù)思路,這樣我們就可以手寫一個(gè)自己的new~
funtion myNew() {
let obj = new Object();
let Contructor = [].shift.call(arguments);
obj.__proto__ = Contructor.prototype;
let ret = Construct.apply(obj, arguments);
return typeof ret === 'object' ? ret :obj;
};
//或者
function myNew (Con, ...arges) {
var obj = Object.create(Con.prototype);
let res = Con.apply(obj, ...arges);
return typeof res === 'object' ? res: obj;
}
16.筆試題:寫一個(gè)處理加法可能產(chǎn)生精度的函數(shù),比如 0.1 + 0.2 = 0.3
思路:對(duì)于浮點(diǎn)數(shù)在底層處理是有問(wèn)題的,所以目的就是想辦法將所以的浮點(diǎn)數(shù)轉(zhuǎn)化為整數(shù)進(jìn)行處理,同時(shí)乘以一個(gè)倍數(shù)(A),然后加起來(lái)后再除以這個(gè)倍數(shù)(A),這個(gè)倍數(shù)應(yīng)該是兩個(gè)數(shù)中最小的那個(gè)數(shù)的倍數(shù),比如 0.1 + 0.02 ,那么應(yīng)該同時(shí)乘以 100,變?yōu)?10 + 2,然后再將值除以 100。
17.1000000000 + 1000000000 允許返回字符串 處理大數(shù)
大數(shù)問(wèn)題就是通過(guò)字符串來(lái)處理,從后往前加,然后處理進(jìn)位的問(wèn)題。
二面
1.聊項(xiàng)目
項(xiàng)目基本是問(wèn):
項(xiàng)目難點(diǎn)以及怎么解決的
項(xiàng)目有哪些亮點(diǎn)?
2.寫一個(gè) es6 的繼承過(guò)程
這個(gè)題我覺(jué)得出得很好,很考察基本功。
// 這個(gè)是要實(shí)現(xiàn)的方法
createClass = fun(sons, super) {
// TODO
return fn;
}
// 這是個(gè) es6 的一個(gè)例子,要實(shí)現(xiàn) extends 的功能。
class Man extends Human {
cons (args) {
super(args)
// xxxxx
}
speak() {
console.log('')
}
}
3.寫一個(gè)大數(shù)相乘的解決方案。傳兩個(gè)字符串進(jìn)來(lái),返回一個(gè)字符串
function multi(str1, str2) {
}
這道題跟一面的時(shí)候思路差不多,只是進(jìn)位的時(shí)候不一定是 1。
三面
1.聊項(xiàng)目
2.寫一個(gè)防抖函數(shù)
3.算法題:https://leetcode-cn.com/problems/bu-ke-pai-zhong-de-shun-zi-lcof/
小節(jié)
字節(jié)果然是出了名的考算法題比較多的,基本每面都會(huì)算法題和編程題,對(duì)編程能力比較看重吧。
講道理一面還是比較常規(guī)的,二三面因?yàn)槎际菆F(tuán)隊(duì) leader 和更高級(jí)別的,問(wèn)的技術(shù)細(xì)節(jié)也比較少了,重點(diǎn)考察一些技術(shù)方案和項(xiàng)目的問(wèn)題。
轉(zhuǎn)載:桃翁
原文詳見:http://www.taoweng.site/index.php/archives/321/
加油,奧里給~~