前端常見的面試題

paragraph

5. hr如何面試web前端工程師，該問哪些技術問題

hr如何面試web前端工程師，該問哪些技術問題

一、基本知識
我們生活在網際網路時代，你想知道的任何事情幾乎都能在15分鍾內找到相關資訊。可是，能找到資訊並不等於你會使用它。我認為所有前端工程師至少都應 該掌握某些基本的知識，才能有效地完成自己的工作。如果一遇到問題，就停下工作上網四處搜尋解決方案，怎麼可能保證按期完成工作呢？聽聽，還有誰在說「我 不知道，但我可以上網搜到。」請這些同學把手舉起來，讓大家認識一下（immediately raises a flag for me.）。下面我列出一些基本的知識點，這些都是我認為一名前端工程師（無論工作年頭長短）在沒有任何外來幫助的情況應該知道的。
[list][*]
DOM結構——兩個節點之間可能存在哪些關系以及如何在節點之間任意移動。
[*]
DOM操作——怎樣新增、移除、移動、復制、建立和查詢節點。
[*]
事件——怎樣使用事件以及IE和DOM事件模型之間存在哪些主要差別。
[*]
XMLHttpRequest——這是什麼、怎樣完整地執行一次GET請求、怎樣檢測錯誤。
[*]
嚴格模式與混雜模式——如何觸發這兩種模式，區分它們有何意義。
[*]
盒模型——外邊距、內邊距和邊框之間的關系，IE 8以下版本的瀏覽器中的盒模型有什麼不同。
[*]
塊級元素與行內元素——怎麼用CSS控制它們、它們怎樣影響周圍的元素以及你覺得應該如何定義它們的樣式。
[*]
浮動元素——怎麼使用它們、它們有什麼問題以及怎麼解決這些問題。
[*]
HTML與XHTML——二者有什麼區別，你覺得應該使用哪一個並說出理由。
[*]
JSON——它是什麼、為什麼應該使用它、到底該怎麼使用它，說出實現細節來。
[/list]
重申一下，上述這些知識點都應該是你應該「想都不用想」的東西。我一開始問的所有問題都是想摸清你對所有這些領域知識的掌握程度。雖然上面列出的這些知識點並沒有面面俱到，但我覺得你至少應該掌握這些，才有可能跟我坐到一間辦公室里來。
二、少量提問
我非常贊同面試者問的問題越少越好。反復問應聘者各種問題既不公平，也很無聊。我在任何一次面試中，通常只問三個大問題，但每個問題又會涉及我所能想到的多個方面。回答每個大問題一般要經過幾個步驟，這樣我就可以在每個步驟中穿插著問一些小問題。比如說：

現在有一個正顯示著Yahoo!股票價格的頁面。頁面上有一個按鈕，你可以單擊它來重新整理價格，但不會重新載入頁面。請你描述一下實現這個功能的過程，假設伺服器會負責准備好正確的股票價格資料。
這個問題牽扯到一組我想要考察的基本知識點：DOM結構、DOM操作、事件處理、XHR和JSON。如果我要求你對換一種處理股票價格的方式，或者 讓你在頁面中顯示其他資訊，就可以把更多的知識點包括進來。對於經驗比較豐富應聘者，我也可以自如地擴充套件要考察的知識范圍，最簡單像JOSN與XML的區 別、安全問題、容量問題，等等。
我還希望應聘者給出的任何解決方案中都不要使用庫。我想看到最原生態的程式碼，你就當頁面中沒有包含任何庫。你說你對哪個庫了解多少多少，但我不能把 關於庫的知識作為評判能力的因素，因為庫是會隨時間變化的。我需要的是真正理解庫背後的機制，特別是能夠徒手寫出一個自己的庫的人。
三、解決問題
做為一名前端工程師，最值得高興的事莫過於解決同一個問題會有很多種不同的方法，而你要做的就是找出最合適的方法來。我在提問的時候，經常會在應聘 者解釋完一種方法後問他們還有沒有第二種方法。此時我會跟他們說，假設你的這個方法由於種種原因被否決了，那麼你還能不能給出另一種方法。這樣做可以達到 兩個目的。
首先，可以測試出他們是否在毫無意義地復述書本中的東西。不能不承認，某些人確實有過目不忘的天賦，聽他們在那裡滔滔不絕地講，你會覺得他們什麼都 明白。可是，只要一跟這些人談到怎麼查詢方案無效的原因，以及能否拿出一個新方案來，他們往往就傻眼了。這時候，如果我聽到「我不明白這個方案為什麼不夠 好」之類的反問，心裡立刻就明白我的問題已經超出了他們的能力范圍，而他們只是想拿自己死記硬背的結論來矇混過關。
其次，可以測試出他們已經掌握的（還是那句話，「想都不用想」）瀏覽器技術知識。如果他們對瀏覽器平台的核心知識有較好的理解，想出解決同一問題的不同方案根本沒有那麼難。
對一名前端工程師來說，這絕對是最重要的能力。前端工程師在工作中遇到本該如此卻並未如此的難題（說你啦，IE6），應該說是一件很平常的事。一個方案無效就無計可施的人，做不了前端工程師。
考核應聘者解決問題能力的另一層原因，與我的個人喜好有關。在搞清楚應聘者知道什麼不知道什麼之後，我就會想著問一個他們知識領域之外的問題。這樣 做的目的，就是想看看他們怎樣運用已有的知識解決新問題。在解決問題的每一步，我也准備了一些提示，以防有人會卡殼打艮（在我面前15分鍾一言不發，對我 評價這個人毫無幫助）。我真正感興趣的，是他們能夠從上一步前進到下一步。我希望看到一個人就在我眼前學到新知識。
注意：所有問題都與瀏覽器技術相關。我不相信出幾道抽象的邏輯題，就能夠考出某人解決Web技術問題的能力。在我看來，這無異於讓素描大師畫肖像（或者讓劉翔跟博爾特同場競技），沒有意義，也得不到任何有價值的資訊。

HR一般不會面試太深的問題，主要是了解一下你之前的工作經歷，更多的是你自己描述，中間可能會問一些初級的問題，比如，你為什麼從上一家單位離職等類似問題。

一道web前端工程師面試題，求解答。

這樣的布局用絕對定位實現最合適，ABC的外層用相對定位，里邊各列用絕對定位就可以。至於CBA且B寬度自適應，還是用絕對定位，但只定位C,A分部到兩側，中間的列margin設成左右列的寬度就可以。

web前端工程師如何才能硬氣的跳槽？

web前端開發工程師想要硬氣的跳槽，起碼應該達到以下幾點：
1.掌握扎實的技術基礎，
需要掌握技術包括：HTML、CSS、JavaScript;
HTML是Web程式設計的基礎，HTML也是一種規范，一種標准，它通過標記符號來標記要顯示的網頁中的各個部分。網頁檔案本身是一種文字檔案，通過在文字檔案中新增標記符，可以告訴瀏覽器如何顯示其中的內容。
維護大型的CSS程式碼庫並非易事，特別是那些隨意散漫未經組織的CSS程式碼極易變成一團亂麻，所以，應該掌握CSS命名規范，來幫助開發者編寫優質的程式碼。
2.深入理解前端工程化和元件開發;
需要熟悉web前端框架—— React、Vue.js等，
React為我們提供了直接易用的，以狀態為核心的前端應用開發方式，前端工程師應該會分析React內部工作原理，討論React中簡單元件、類元件等渲染流程。
Vue.js單元測試是應用開發中不可或缺的部分，日常開發中會用到的Vue.js單元測試的例子，所以應該掌握。
3.熟練掌握Web開發相關知識
至少熟悉一門後端語言，例如Node.js、Java、Go等;
Node.js內部原理視非常重要的，應該明白Node.js的主程序是如何啟動的、如何載入內建模組、os包如何實現等等。
4.對技術有熱情，有一定前端架構能力或者技術深度;具備團隊合作意識強，能夠多團隊協作開發;具備企業級大型前端應用開發經驗更佳。

如何識別一個人是web前端工程師

前端工程師需要懂得設計類程式碼和js，有需要了解一些後台語言，例如PHP等。

如何實現成為web前端工程師的夢想

1.入門階段：能夠解決一些問題的水平。有一定的基礎(比如最常見的HTML標簽及其屬性、事件、方法;最常見的CSS屬性;基礎的JavaScript程式設計能力)，能夠完成一些簡單的Web前端研發需求。
2.進階階段：將JavaScript、HTML、CSS之類的編碼幫助手冊里的每個方法/屬性都通讀幾遍!只有將基礎打好，以後的路才能走的順暢。
3.入室：最強程式碼，知道所有能夠解決需求的各種方案，能夠選擇使用最優秀的方案滿足需求。這個級別基本上產品開發程式設計中的程式碼主力。程式設計師應該能夠肯定的回答：對於這個需求而言，我的程式碼就是最優秀的程式碼。
4.注重細節，注意那些當前需求里沒有明文給出的細節：程式碼效能的差異、執行平台(瀏覽器)的差異、需求的隱性擴充套件、程式碼的向後相容等等。

如何了解web前端工程師和UI設計師

web前端工程師是不參與任何的設計，直接將網站美工製作的網站效果圖使用ps按照效果圖進行切片並使用、css、js等程式碼進行網頁的製作，最終編寫出符合w3c標準的相容各個主流瀏覽器的靜態頁面，同時還需要按照後台開發人員的要求留下一些後台資料的介面。所以說網站前端工程師更多的是程式設計而不是設計。
UI設計師一般是學美術或者設計出身，精通photoshop、AI、AE等平面設計工具，其在網站開發過程的中的職責就是按照客戶或者公司的需求設計出符合客戶需求和介面或者顏色符合大眾視覺的網站效果，如根據不同行業的需求設計顏色、設計介面風格等，其工作的最後成果就是網站的效果圖。

web前端工程師進階學習路線如何走

less和sass什麼時候學都行，1,2天就能學會。這個不著急，沒有什麼承上啟下的作用，可以單獨拿出來學。
bootstrap就是一個框架，把最主要的柵格系統看看就好。其他的大概了解能幹啥就行，很多公司，是不讓用bootstrap的，而是用原始碼自己寫。這個用一天的時間沒啥問題。
node.js和angular比較重要，如果學會，算是上了一個台階了。所以重點說說這個。
angular屬於mvvm框架，一開始覺得angular挺復雜的，所以想學一個簡單的，輕量級的，所以決定先學vue。但是在了解的過程中發現，很多的專業名詞，沒聽過，或者理解不透。所以又開始從頭學習node.js。在學習node.js的過程中又開始迷茫，發現了很多JS不懂的地方。
所以，又開始深入研究js的dom，函式，ajax，陣列等。總之用了很長的時間，浪費了很長時間。
最後總結一下啊。其實，沒必要鑽那麼多牛角尖。
先做著vue的例子，不懂的地方，直接略過，很多時候，不理解的不懂的東西，用著用著，突然就能明白。照貓畫虎先把VUE的例子跟著做一遍之後，同時梳理一下涉及到的JS知識點。能自己用vue做出幾個小成品的時候，開始結合js研究node.js。之後再去涉及angular。
angular差不多有個大概了解的時候，反過頭接著學vue，你會發現，又會發現很多新東西。
web前端這個東西特別有意思，當你達到一個高度，返回來再看以前的技術，會發現，哎呀，竟然又能發現新大陸。

廈門web前端工程師培訓哪家好

培訓學校很多，沒有具體的衡量標準的。但是可以從幾方面去選擇：
1 有很多優秀導師的
2 培養出很多優秀學員的
3 只做培訓的，沒有做其他的
4 做的比較久的。

北京WEB前端工程師培訓哪個好

建議找全程面授課程的地方學習，課程體系很重要，現在企業在用人方面講究全棧的前端工程師人才，所在在課程選擇上要慎重，學習內容要基於HTML5，要包含pc端+移動端+後端。這要才能學的系統，就業上才會有所保障。

6. WEB前端面試題

第二章 面試題基礎篇

2.1 HTML面試題

面試題：行內元素有哪些？塊級元素有哪些？ 空(void)元素有那些？

面試題：頁面導入樣式時，使用link和@import有什麼區別？

面試題：title與h1的區別、b與strong的區別、i與em的區別？

面試題：img標簽的title和alt有什麼區別？

面試題：png、jpg、gif 這些圖片格式解釋一下，分別什麼時候用？

2.2 CSS面試題

面試題：css背景紋路

面試題：介紹一下CSS的盒子模型

面試題：CSS選擇符有哪些？哪些屬性可以繼承？

面試題：CSS優先順序演算法如何計算？

面試題：用CSS畫一個三角形

面試題：一個盒子不給寬度和高度如何水平垂直居中？

面試題：display有哪些值？說明他們的作用。

面試題：對BFC規范(塊級格式化上下文：block formatting context)的理解？

面試題：清除浮動有哪些方式？

面試題：在網頁中的應該使用奇數還是偶數的字體？為什麼呢？

面試題：寫一個左中右布局占滿屏幕，其中左、右倆塊固定寬200，中間自適應寬，要求先載入中間塊，請寫出結構及樣式。

面試題：什麼是CSS reset？

面試題：css sprite是什麼,有什麼優缺點

面試題：display: none;與visibility: hidden;的區別

面試題：position有哪些值?有什麼作用? 【特別多公司問】

面試題：line-height和height有什麼區別？

面試題：opacity 和 rgba區別

2.3 JavaScript基礎面試題

面試題：延遲載入JS有哪些方式？

面試題：JS數據類型有哪些？

面試題：null和undefined的區別

面試題：JS數據類型考題

面試題：==和===有什麼不同

面試題：JS微任務和宏任務

面試題：JS作用域考題

面試題：JS對象考題

面試題：JS作用域+this指向+原型 考題

面試題：JS判斷變數是不是數組，你能寫出哪些方法？

面試題：slice是幹嘛的、splice是否會改變原數組

面試題：JS數組去重

面試題：找出多維數組最大值

面試題：給字元串新增方法實現功能

面試題：找出字元串出現最多次數的字元以及次數

2.4 真正移動端 —— H5/C3面試題

面試題：什麼是語義化標簽

面試題：::before 和 :after中雙冒號和單冒號 有什麼區別？解釋一下這2個偽元素的作用。

面試題：如何關閉iOS鍵盤首字母自動大寫

面試題：怎麼讓Chrome支持小於12px 的文字？

面試題：rem和em有什麼樣區別

面試題：ios系統中元素被觸摸時產生的半透明灰色遮罩怎麼去掉

面試題：webkit表單輸入框placeholder的顏色值能改變嗎？

面試題：禁止ios 長按時不觸發系統的菜單，禁止ios&android長按時下載圖片

面試題：禁止ios和android用戶選中文字

面試題：自適應 [淘寶無線適配]

面試題：響應式

第三章 面試題進階篇

3.1 JavaScript進階面試題

面試題：new操作符具體做了什麼

面試題：閉包 【必須會】

面試題：原型鏈 【必須會】

面試題： JS繼承有哪些方式

面試題：說一下call、apply、bind區別

面試題：sort背後原理是什麼？

面試題：深拷貝和淺拷貝

面試題：localstorage、sessionstorage、cookie的區別

3.2 ES6面試題

面試題：var、let、const區別

面試題：作用域考題

面試題：將下列對象進行合並

面試題：箭頭函數和普通函數有什麼區別？

面試題：Promise有幾種狀態

面試題：find和filter的區別 【大廠】

面試題：some和every的區別 【大廠】

3.3 webpack面試題

面試題：webpack插件

3.4 Git面試題

面試題：git常用命令

面試題：解決沖突

面試題：GitFlow

第四章 面試題框架篇

4.1 區分初中高級的 —— Vue面試題

面試題：Vue2.x 生命周期有哪些？

1.系統自帶八個

2.當一旦進入到某個組件會執行哪些生命周期

3.$el和$data在哪個階段有

4.如果使用keep-alive會多倆個生命周期

5.如果加入keep-alive第一次進入組件會執行哪些生命周期

6.如果加入keep-alive第二次或者第N進入該組件會執行哪些生命周期

面試題：談談你對keep-alive的了解

面試題：v-if和v-show區別

面試題：v-if和v-for優先順序 2.x

面試題：ref是什麼？

面試題：nextTick是什麼？

面試題：Vue中如何做樣式穿透

面試題：scoped原理

面試題：Vuex是單向數據流還是雙向數據流？

面試題：講一下MVVM

面試題：雙向綁定原理

面試題：什麼是虛擬DOM

面試題：key是干什麼？

面試題：diff演算法

面試題：Vue組件傳值

面試題：props和data優先順序誰高？

面試題：computed、methods、watch有什麼區別？

面試題：Vuex

面試題：Vue路由

面試題：Vue項目打包後出現空白頁

4.2 微信小程序面試題

面試題：如何自定義頭部？

面試題：如何自定義底部？

4.3 uni-app面試題

面試題：生命周期

面試題：條件編譯

第五章 面試題性能優化篇

7. 常見的web前端面試題及答案分享

1、 說下行內元素和塊級元素的區別?行內塊元素的兼容性使用?(IE8 以下)

答：行內元素：會在水平方向排列，不能包含塊級元素，設置width無效，height無效(可以設置line-height)，margin上下無效，padding上下無效。塊級元素：各占據一行，垂直方向排列。從新行開始結束接著一個斷行。兼容性：display:inline-block;*display:inline;*zoom:1。

2、box-sizing常用的屬性有哪些?分別有什麼作用?

答：box-sizing: content-box|border-box|inherit。content-box:寬度和高度分別應用到元素的內容框。在寬度和高度之外繪制元素的內邊距和邊框(元素默認效果)。

border-box:元素指定的任何內邊距和邊框都將在已設定的寬度和高度內進行繪制。通過從已設定的寬度和高度分別減去邊框和內邊距才能得到內容的寬度和高度。

3、Doctype作用?標准模式與兼容模式各有什麼區別?

答：告知瀏覽器的解析器用什麼文檔標准解析這個文檔。DOCTYPE不存在或格式不正確會導致文檔以兼容模式呈現。

標准模式的排版和JS運作模式都是以該瀏覽器支持的最高標准運行。在兼容模式中，頁面以寬松的向後兼容的方式顯示,模擬老式瀏覽器的行為以防止站點無法工作。

4、html5有哪些新特性?如何處理HTML5新標簽的瀏覽器兼容問題?如何區分 HTML 和 HTML5?

答：HTML5 現在已經不是 SGML 的子集，主要是關於圖像，位置，存儲，多任務等功能的增加。

(1)繪畫 canvas;

(2)用於媒介回放的 video 和 audio 元素;

(3)本地離線存儲 localStorage 長期存儲數據，瀏覽器關閉後數據不丟失;

(4)sessionStorage 的數據在瀏覽器關閉後自動刪除;

(5)語意化更好的內容元素，比如 article、footer、header、nav、section;

(6)表單控制項，calendar、date、time、email、url、search;

(7)新的技術webworker, websocket, Geolocation;

IE8/IE7/IE6支持通過document.createElement方法產生的標簽，可以利用這一特性讓這些瀏覽器支持HTML5新標簽，瀏覽器支持新標簽後，還需要添加標簽默認的樣式。當然也可以直接使用成熟的框架、比如html5shim。

以上就是環球青藤小編關於web前端面試題的相關分享，希望對大家有所幫助，想要了解更多相關內容，請及時關注本平台並進行查看!

8. 那些陌生又熟悉的前端面試題

過完年需要跳槽的小夥伴還是挺多的，又要開始刷前端面試題了！會不會有一種錯覺，看著這道面試題很熟，但是不知道該如何做？或者有答案又不知道是否正確？或者使用編輯器可以運行出來正確的答案，但是不知道怎麼得來的，這些你都中招了嗎？

JavaScript 語言是一門弱類型語言，存在許多類型錯誤，因此 ES6 引入了嚴格模式概念。

如果不加 『use strict』 常規模式下就是屬於非嚴格模式。

嚴格模式

在 js 文件頂部添加 『use strict』 就屬於嚴格模式，嚴格模式也可以指定在函數內部。

嚴格模式，是為 js 定義來了一種不同的解析與執行模型，在嚴格模式下，ECMAScipt 3 中一些不解和不確定的行為將得到處理，而且會對不安全的操作會拋出異常。『use strict』 會告訴瀏覽器引擎可以切換到嚴格模式執行。

嚴格模式與非嚴格模式區別

常見筆試題：

試試這道筆試題你會做嗎？

要說 js 的深淺拷貝，就不得不提 js 的兩大數據類型：基本數據類型和引用類型。

基本數據類型的變數名和值都存儲在棧中，對於引用類型的變數名存儲在棧中，而值存儲在堆中。由於存儲方式不同，所以導致了他們復制的時候方式不同。

賦值

基本數據類型賦值的時候，創建的基本數據類型會在內存中開辟一個新空間把值復制過來，而引用類型採用的是地址存儲，如果直接把一個引用數據直接賦值給另外一個數據，就相當於直接把自己存儲值的地址給了另外一個變數，所以改變一個的值，也會改變另外一個的值。

深淺拷貝是如何定義的？

假設有 p 和 P 兩個變數，如果P 是拷貝了 p 的，我們通過修改 P 來觀察 p 是否發生改變，如果跟著改變，就是淺拷貝，如果是不改變，就說明是深拷貝。

基本類型復制的時候會開辟新的內存空間，所以兩個值是相互獨立的，引用類型復制的時候就要看是復制的內存地址還是復制一個新的堆。所以深拷貝主要針對的是引用類型的數據。

淺拷貝的常見的方式：

1、直接賦值

2、Object.assign

深拷貝的常見方式：

引用數據類型最常用的就是 Object 和 Array ，引用數據內部的數據也可以是多樣化的，進行深拷貝時，也要適當地根據數據結構進行合適的復制方式，具體的深拷貝方法分別有：

1、數組中只包含基本數據類型

2、對象中只包含基本數據類型

3、對象或數組里含有一層或多層引用數據類型時

深淺拷貝的常見應用主要是數據的增刪改操作。

大廠筆試題：

這是一道關於 this 指向的面試題，接下來我們就說說 this 是如何指向的？

this 對象是運行時基於函數的執行環境綁定的：

看完上述 this 指向解釋，你就可以做上邊的那道面試題了。

如何改變 this 的指向？

call 、bind 和 apply 這三個函數都是用來改變 this 指向的，就是改變函數執行時的上下文。

修改上述面試題：

call 、bind 和 apply 改變 this 指向，最大作用就是實現代碼復用。

至於 call、bind 和 apply 的區別，可以自行去了解下。

有了上邊那個表，事情就變得簡單了！

關系運算符進行運算時，不同類型的值會自動轉化為相同類型值，然後進行

1、兩邊有一個是字元串一個是是數字時，字元串調用 Number 方法，將字元串轉為數字，所以：

2、如果兩邊都是字元串時，按照字元串的 unicode 編碼來轉換的，所以：

3、字元串進項比較時，先比較第一位，如果不相等直接得出結果，如果第一項相等，會繼續使用第二項進行比較。

4、轉為布爾值都為 false 的類型分別有：undefined 、null 、0、NaN、false、『』

5、NaN表示的是非數字，但是這個非數字也是不同的，因此 NaN 不等於 NaN，兩個NaN永遠不可能相等。

6、關系運算有一個數值，將另外一個值也轉為 number 類型。

7、有邏輯運算的，將其他數據類型轉為 boolean 值。

8、直接使用兩個空數組比較，數組地址不同，所以不相等。

評論區可以留下最近你想學習的知識點，或面試題類型！

9. 前端面試題整理（一）

進程是CPU資源分配的最小單位，線程是CPU調度的最小單位

其中GUI渲染線程和JS引擎是無法同時工作的

默認情況下, TCP 連接會啟用延遲傳送演算法 (Nagle 演算法), 在數據發送之前緩存他們. 如果短時間有多個數據發送, 會緩沖到一起作一次發送 (緩沖大小見 socket.bufferSize), 這樣可以減少 IO 消耗提高性能.

如果是傳輸文件的話, 那麼根本不用處理粘包的問題, 來一個包拼一個包就好了. 但是如果是多條消息, 或者是別的用途的數據那麼就需要處理粘包.

可以參見網上流傳比較廣的一個例子, 連續調用兩次 send 分別發送兩段數據 data1 和 data2, 在接收端有以下幾種常見的情況:

A. 先接收到 data1, 然後接收到 data2 .
B. 先接收到 data1 的部分數據, 然後接收到 data1 餘下的部分以及 data2 的全部.
C. 先接收到了 data1 的全部數據和 data2 的部分數據, 然後接收到了 data2 的餘下的數據.
D. 一次性接收到了 data1 和 data2 的全部數據.
其中的 BCD 就是我們常見的粘包的情況. 而對於處理粘包的問題, 常見的解決方案有:

多次發送之前間隔一個等待時間
關閉 Nagle 演算法
進行封包/拆包

通過滑動窗口協議（連續ARQ協議）實現，保證了分組無差錯、有序接收、流量控制。接收方返回的ACK中會包含自己的接收窗口的大小，並且利用大小來控制發送方的數據發送。

當發送者收到了一個窗口為0的應答，發送者便停止發送，等待接收者的下一個應答。如果這個窗口不為0的應答在傳輸過程中丟失，發送者一直等待，接收者以為發送者收到該應答，等待接收新數據，這樣雙方就相互等待，從而產生死鎖

TCP使用了持續計時器。每當發送者收到一個0窗口的應答後就啟動該計時器。計時器到時便主動發送報文詢問接收者的窗口大小。若接收者仍然返回0窗口，則重置該計時器繼續等待；若窗口不為0，則標識應答報文丟失了，此時重置發送窗口開始發送，這樣就避免了死鎖的產生

擁塞控制是作用於網路的，防止網路負載過大，常用的方法：1.慢啟動、擁塞避免 2.快重傳、快恢復。流量控制是作用於接收者的，控制發送者的發送速度使接收者來得及接收，防止分組丟失

發送方維持一個叫做擁塞窗口CWnd的狀態變數，控制著傳輸速度，TCP開始發送報文時CWnd=1。一個傳輸輪次所經歷的時間就是往返時間RTT，每經過一個RTT並且按時收到確認，就將擁塞窗口CWnd加倍。還有一個叫慢啟動門限ssthresh的狀態變數，當CWnd<ssthresh時，使用慢啟動，當CWnd>=ssthresh改用擁塞避免演算法

每經過一個往返時間RTT就把發送方的擁塞窗口cwnd加1而不是加倍。無論在慢啟動階段還是擁塞避免階段，只要發送方沒有按時收到確認，就把慢啟動門限設置為出現擁塞時的擁塞窗口cwnd的一半（但不小於2）。然後把擁塞窗口cwnd重置為1，執行慢啟動演算法

接收方收到一個失序的報文段後就立刻發出重復確認而不是等到自己發送數據時捎帶確認。只要發送方一連收到三個重復確認就立即重傳對方尚未收到的報文段，而不是等待重傳計時器到期

當發送方連續收到三個重復確認時，把慢啟動門限ssthresh減半，但是並不執行慢開始演算法，而是將擁塞窗口cwnd設置為ssthresh減半後的值，直接執行擁塞避免演算法。快重傳配合快恢復的TCP Reno版本是目前使用最廣的版本。

幀：HTTP/2 數據通信的最小單位消息：指 HTTP/2 中邏輯上的 HTTP 消息。例如請求和響應等，消息由一個或多個幀組成。
流：存在於連接中的一個虛擬通道。流可以承載雙向消息，每個流都有一個唯一的整數ID

HTTP/1.x會在請求和響應中中重復地攜帶不常改變的、冗長的頭部數據，給網路帶來額外的負擔。

服務端可以在發送頁面HTML時主動推送其它資源，而不用等到瀏覽器解析到相應位置，發起請求再響應。例如服務端可以主動把JS和CSS文件推送給客戶端，而不需要客戶端解析HTML時再發送這些請求。

服務端可以主動推送，客戶端也有權利選擇是否接收。如果服務端推送的資源已經被瀏覽器緩存過，瀏覽器可以通過發送RST_STREAM幀來拒收。主動推送也遵守同源策略，伺服器不會隨便推送第三方資源給客戶端。

HTTP 1.x 中，如果想並發多個請求，必須使用多個 TCP 鏈接，且瀏覽器為了控制資源，還會對單個域名有 6-8個的TCP鏈接請求限制。

HTTP2中：

同域名下所有通信都在單個連接上完成。
單個連接可以承載任意數量的雙向數據流。
數據流以消息的形式發送，而消息又由一個或多個幀組成，多個幀之間可以亂序發送，因為根據幀首部的流標識可以重新組裝

前端面試與進階指南
從輸入URL到頁面載入的過程？如何由一道題完善自己的前端知識體系！

10. 前端常見面試題-hr

因為前端是用戶最直觀能接觸和交互的地方，所有 「用戶體驗」最重要。

早期學習都是有點野路子，遇到問題解決問題，
後面發現有很多問題沒有系統的學習 很難分析出具體的問題，
然後會開始看一下比較基本和底層一點的書或者視頻，包括一些api。
有了系統的知識後，就可以去研究相關一些大神的源碼，當然也借鑒了很多人的學習心的再去慢慢消化。
如果單純看和聽 其實我覺得只能吸收10%左右。
我一般會把學習的內容和工作上解決了比較難的問題都通過 掘金或者的方式記錄下來。這樣我覺可以消化40%的內容。
最後最好的學習方法，當然是給別人說一遍，這也是我們前端組為什麼每個月做技術分享的原因。
這樣我覺得可以最整個知識跟深刻的思考和別人互動互相檢驗學習的質量。

首先我確實挺感謝我現在公司，因為我之前去過外包公司，我深刻的感受到企業文化對公司的重要性。倡導以員工的成長為主，
公司會定期給我們請外面的老師做管理幹部的培訓，有管理的有經驗的。確實讓我學習了很多成長了很多。
不過由於我們是傳統服裝製造業，對於技術的迭代和要求沒那麼高，我在這里也工作了6年多，我自身也感覺有點 開始進入舒適區的感覺，
我想在新的環境，跟更多行業優秀的人才一起學習，讓自己做一個T字型人才，把縱向的技術能力扎深扎穩。

應該就是capp項目，由於公司戰略要求，要在3個月內完成原來capp工時工序客戶端系統到web的切換，兩個前端，兩個後端，由於周期短，要在短時間交付項目成果，確實是一個很難解決的大難題。
（1）首先我覺得溝通很重要，在需求方面，我和後端組長積極與產品溝通，分析系統各個模塊的使用場景和優先順序。把最關鍵的核心模塊提取出來，優先開發，並與領導協商後面再繼續迭代其他基礎功能。 每個功能都討論仔細避免交付時才返工。
（2）在框架上，一個穩定的容用的框架是高效迭代開發所必須的，所以作為框架的搭建就刻不容緩，我和後端負責人也是溝通分析趕工，不斷打磨一個穩定有效的框架。制定了很多約定與規范。
（3）在時間上，打包比較花時間，為了解放不必要的投入，我引進入CI/CD工具，大量的節省了前端後端的部署時間。把精力都花在刀刃上。
（4）團隊的氛圍， 畢竟還有很多功能要開發，加班是再所難免。
其實我覺得人加班為什麼會累，一/般是一個人在奮戰，會感到孤獨和無助。所以我們採取在關鍵節點交付前集體加班的方式，由於大家都在，即保證了開發過程的效率，也可以避免007的噩夢。
（5）儀式感與明確的目標，跟上級申請項目立項，讓公司發起啟動會，讓每一個參與開發同事有儀式感，意識自己參與項目的重要性與意義。並申請項目獎金，在每個階段性節點按時交付，我們都給予員工及時的獎勵和認可，由於有了明確的目標和方向。

整體項目最終以2個半月交付核心業務功能，4個月後完成整個系統所有功能交付，並順利上線。

我們喜歡的運動是羽毛球，平時喜歡用碎片化的時間 聽得到的一些可能，有it類的有經濟學類的，可以擴充自身的視野。
還是在掘金寫寫博客。