前言
前端校招面試題主要內容包括html,css,前端基礎,前端核心,前端進階,移動端開發,計算機基礎,算法與數據結構,設計模式,項目等等。(本文資料 適合0-2年)
包含了騰訊、字節跳動、小米、阿里、滴滴、美團、58、拼多多、360、新浪、搜狐等一線互聯網公司面試被問到的題目,涵蓋了初中級前端技術點。
文章中所列主要為大綱部分,詳細內容可以在文末自行獲取哈!
第一章 HTML
1.瀏覽器頁面有哪三層構成,分別是什么,作用是什么?
2.HTML5的優點與缺點?
3.Doctype作用? 嚴格模式與混雜模式如何區分?它們有何意義?
4.HTML5有哪些新特性、移除了哪些元素?
5.你做的網頁在哪些瀏覽器測試過,這些瀏覽器的內核分別是什么?
6.每個HTML文件里開頭都有個很重要的東西,Doctype,知道這是干什么的嗎?
7.說說你對HTML5認識?(是什么,為什么)
8.對WEB標準以及W3C的理解與認識?
9.HTML5行內元素有哪些,塊級元素有哪些, 空元素有哪些?
10.什么是WebGL,它有什么優點?
11.請你描述一下 cookies,sessionStorage 和 localStorage 的區別?
12.說說你對HTML語義化的理解?
13.link
和@import的區別?
14.說說你對SVG理解?
15.HTML全局屬性(global attribute)有哪些?
16.說說超鏈接target屬性的取值和作用?
17.data-
屬性的作用是什么?
18.介紹一下你對瀏覽器內核的理解?
19.常見的瀏覽器內核有哪些?
20.iframe有那些缺點?
21.Label的作用是什么,是怎么用的?
22.如何實現瀏覽器內多個標簽頁之間的通信?
23.如何在頁面上實現一個圓形的可點擊區域?
24.title與h3的區別、b與strong的區別、i與em的區別?
25.實現不使用 border 畫出1px高的線,在不同瀏覽器的標準模式與怪異模式下都能保持一致的效果?
26.HTML5標簽的作用?(用途)
27.簡述一下src與href的區別?
28.談談你對canvas的理解?
29.WebSocket與消息推送?
30.mg的title和alt有什么區別?
31.表單的基本組成部分有哪些,表單的主要用途是什么?
32.表單提交中Get和Post方式的區別?
33.HTML5 有哪些新增的表單元素?
34.HTML5 廢棄了哪些 HTML4 標簽?
35.HTML5 標準提供了哪些新的 API?
36.HTML5 存儲類型有什么區別?
37.HTML5 應用程序緩存和瀏覽器緩存有什么區別?
38.HTML5 Canvas 元素有什么用?
39.除了 audio 和 video,HTML5 還有哪些媒體標簽?
40.HTML5 中如何嵌入視頻?
41.HTML5 中如何嵌入音頻?
42.新的 HTML5 文檔類型和字符集是?
第二章 CSS
1.解釋一下CSS的盒子模型?
2.請你說說CSS選擇器的類型有哪些,并舉幾個例子說明其用法?
3.請你說說CSS有什么特殊性?(優先級、計算特殊值)
4.要動態改變層中內容可以使用的方法?
5.常見瀏覽器兼容性問題與解決方案?
6.列出display的值并說明他們的作用?
7.如何居中div, 如何居中一個浮動元素?
8.CSS中 link 和@import 的區別是?
9.請列舉幾種清除浮動的方法(至少兩種)?
10.block,inline和inlinke-block細節對比?
11.什么叫優雅降級和漸進增強?
12.說說浮動元素會引起的問題和你的解決辦法
13.你有哪些性能優化的方法?
14.為什么要初始化CSS樣式?
15.解釋下浮動和它的工作原理?清除浮動的技巧?
16.CSS樣式表根據所在網頁的位置,可分為哪幾種樣式表?
17.談談你對CSS中刻度的認識?
18.請你說說em與rem的區別?
19.請你說說box-sizing屬性的的用法?
20.瀏覽器標準模式和怪異模式之間的區別是什么?
21.怪異Quirks模式是什么,它和標準Standards模式有什么區別?
22.說說你對邊距折疊的理解?
23.內聯與塊級標簽有何區別?
24.說說隱藏元素的方式有哪些?
25.為什么重置瀏覽器默認樣式,如何重置默瀏覽器認樣式?
26.談談你對BFC與IFC的理解?(是什么,如何產生,作用)
27.說說你對頁面中使用定位(position)的理解?
28.如何解決多個元素重疊問題?
29.頁面布局的方式有哪些?
30.overflow :hidden是否形成新的塊級格式化上下文?
第三章 前端基礎
1.說一下http和https
2.tcp三次握手,一句話概括
3.TCP和UDP的區別
4.WebSocket的實現和應用
5.HTTP請求的方式,HEAD方式
6.一個圖片url訪問后直接下載怎樣實現?
7.說一下web Quality(無障礙)
8.幾個很實用的BOM屬性對象方法?
9.說一下HTML5 drag api
10.說一下http2.0
11.補充400和401、403狀態碼
12.fetch發送2次請求的原因
13.Cookie、sessionStorage、localStorage的區別
14.說一下web worker
15.對HTML語義化標簽的理解
16.iframe是什么?有什么缺點?
17.Doctype作用?嚴格模式與混雜模式如何區分?它們有何意義?
18.Cookie如何防范XSS攻擊
19.Cookie和session的區別
20.一句話概括RESTFUL
21.講講viewport和移動端布局
22.click在ios上有300ms延遲,原因及如何解決?
23.addEventListener參數
24.cookie sessionStorage localStorage區別
25.cookie session區別
26.介紹知道的http返回的狀態碼
27.http常用請求頭
28.強,協商緩存
29.HTTP狀態碼說說你知道的
30.講講304
31.強緩存、協商緩存什么時候用哪個
32.前端優化
33.GET和POST的區別
34.301和302的區別
35.如何畫一個三角形
36.狀態碼304和 200
37.說一下瀏覽器緩存
38.HTML5新增的元素
39.在地址欄里輸入一個URL,到這個頁面呈現出來,中間會發生什么?
40.cookie和session的區別,localstorage和sessionstorage的區別
41.常見的HTTP的頭部
42.HTTP2.0 的特性
43.cache-control的值有哪些
44.瀏覽器在生成頁面的時候,會生成那兩顆樹?
45.csrf和xss的網絡攻擊及防范
46.怎么看網站的性能如何
47.介紹HTTP協議(特征)
48.說一下對Cookie和Session的認知,Cookie有哪些限制?
49.描述一下XSS和CRSF攻擊?防御方法?
50.知道304嗎,什么時候用304?
51.具體有哪些請求頭是跟緩存相關的
52.cookie和session的區別
53.cookie有哪些字段可以設置
54.cookie有哪些編碼方式?
55.既然你看過圖解http,那你回答下200和304的區別
56.除了cookie,還有什么存儲方式。說說cookie和localStorage的區別
57.瀏覽器輸入網址到頁面渲染全過程
58.HTML5和CSS3用的多嗎?你了解它們的新屬性嗎?有在項目中用過嗎?
59.http常見的請求方法
60.get和post的區別
61.說說302,301,304的狀態碼
62.web性能優化
63.瀏覽器緩存機制
64.post和get區別
65.說一下css盒模型
66.畫一條0.5px的線
67.link標簽和import標簽的區別
68.transition和animation的區別
69.Flex布局
70.BFC(塊級格式化上下文,用于清楚浮動,防止margin重疊等)
71.垂直居中的方法
72.關于js動畫和css3動畫的差異性
73.說一下塊元素和行元素
74.多行元素的文本省略號
75.visibility=hidden, opacity=0,display:none
76.雙邊距重疊問題(外邊距折疊)
77.position屬性
78.浮動清除
79.css3新特性
80.CSS選擇器有哪些,優先級呢
81.怎么樣讓一個元素消失
82.介紹一下盒模型
83.css動畫如何實現
84.如何實現圖片在某個容器中居中的?
85.如何實現元素的垂直居中
86.CSS3中對溢出的處理
87.float的元素,display是什么
88.隱藏頁面中某個元素的方法
89.三欄布局的實現方式,盡可能多寫,浮動布局時,三個div的生成順序有沒有影響
90.什么是BFC
91.calc屬性
92.有一個width300,height300,怎么實現在屏幕上垂直水平居中
93.display:table和本身的table有什么區別
94.position屬性的值有哪些及其區別
95.z-index的定位方法
96.CSS盒模型
97.如果想要改變一個DOM元素的字體顏色,不在它本身上進行操作?
98.對CSS的新屬性有了解過的嗎?
99.用的最多的css屬性是啥?
100.line-height和height的區別
101.設置一個元素的背景顏色,背景顏色會填充哪些區域?
102.知道屬性選擇器和偽類選擇器的優先級嗎
103.inline-block、inline和block的區別;為什么img是inline還可以設置寬高
104.用css實現一個硬幣旋轉的效果
105.了解重繪和重排嗎,知道怎么去減少重繪和重排嗎,讓文檔脫離文檔流有哪些方法
106.CSS畫正方體,三角形
107.overflow的原理
108.清除浮動的方法
109.box-sizing的語法和基本用處
110.使元素消失的方法有哪些?
111.兩個嵌套的div,position都是absolute,子div設置top屬性,那么這個top是相對于父元素的哪個位置定位的
112.說說盒子模型
113.display
114.怎么隱藏一個元素
115.display:none和visibilty:hidden的區別
116.相對布局和絕對布局,position:relative和obsolute
117.flex布局
118.block、inline、inline-block的區別
119.css的常用選擇器
120.css布局
121.css定位
122.relative定位規則
123.垂直居中
124.css預處理器有什么
125.get請求傳參長度的誤區
126.補充get和post請求在緩存方面的區別
127.說一下閉包
128.說一下類的創建和繼承
129.如何解決異步回調地獄
130.說說前端中的事件流
131.如何讓事件先冒泡后捕獲
132.說一下事件委托
133.說一下圖片的懶加載和預加載
134.mouseover和mouseenter的區別
135.js的new操作符做了哪些事情
136.改變函數內部this指針的指向函數(bind,apply,call的區別)
137.js的各種位置,比如clientHeight,scrollHeight,offsetHeight ,以及scrollTop, offsetTop,clientTop的區別?
138.js拖拽功能的實現
139.異步加載js的方法
140.Ajax解決瀏覽器緩存問題
141.js的節流和防抖
142.JS中的垃圾回收機制
143.eval是做什么的
144.如何理解前端模塊化
145.說一下Commonjs、AMD和CMD
146.對象深度克隆的簡單實現
147.實現一個once函數,傳入函數參數只執行一次
148.將原生的ajax封裝成promise
149.js監聽對象屬性的改變
150.如何實現一個私有變量,用getName方法可以訪問,不能直接訪問
151.和=、以及Object.is的區別
152.setTimeout、setInterval和requestAnimationFrame之間的區別
153.實現一個兩列等高布局,講講思路
154.自己實現一個bind函數
155.用setTimeout來實現setInterval
156.代碼的執行順序
157.如何實現sleep的效果(es5或者es6)
158.簡單的實現一個promise
159.Function.proto(getPrototypeOf)是什么?
160.實現js中所有對象的深度克隆(包裝對象,Date對象,正則對象)
161.簡單實現Node的Events模塊
162箭頭函數中this指向舉例
163.js判斷類型
164.數組常用方法
165.數組去重
166.閉包 有什么用
167.事件代理在捕獲階段的實際應用
168.去除字符串首尾空格
169.性能優化
170.能來講講JS的語言特性嗎
171.如何判斷一個數組
172.你說到typeof,能不能加一個限制條件達到判斷條件
173.JS實現跨域
174.Js基本數據類型
175.js深度拷貝一個元素的具體實現
176.之前說了ES6set可以數組去重,是否還有數組去重的
177.跨域的原理
178.不同數據類型的值的比較,是怎么轉換的,有什么規則
179.null == undefined為什么
180.this的指向 哪幾種
181.暫停死區
184.有一個游戲叫做Flappy Bird,就是一只小鳥在飛,前面是無盡的沙漠,上下不斷有鋼管生成,你要躲避鋼管。然后小明在玩這個游戲時候老是卡頓甚至崩潰,說出原因(3-5個)以及解決辦法(3-5個)
185.編寫代碼,滿足以下條件:
186.什么是按需加載
187.說一下什么是virtual dom
188.webpack用來干什么的
189.ant-design優點和缺點
190.JS中繼承實現的幾種方式
191.寫一個函數,第一秒打印1,第二秒打印2
192.vue的生命周期
193.簡單介紹一下symbol
194.什么是事件監聽
195.介紹一下promise,及其底層如何實現
196.bootstrap清除浮動的方法
197.說說C++,Java,JavaScript這三種語言的區別
198.js原型鏈,原型鏈的頂端是什么?Object的原型是什么?Object的原型的原型是什么?在數組原型鏈上實現刪除數組重復數據的方法
199.什么是js的閉包?有什么作用,用閉包寫個單例模式
200.promise+Generator+Async的使用
201.事件委托以及冒泡原理
202.寫個函數,可以轉化下劃線命名到駝峰命名
203.深淺拷貝的區別和實現
204.JS中string的startwith和indexof兩種方法的區別
205.js字符串轉數字的方法
206.let const var的區別 ,什么是塊級作用域,如何用ES5的方法實現塊級作用域(立即執行函數),ES6 呢
207.ES6箭頭函數的特性
208.setTimeout和Promise的執行順序
209.有了解過事件模型嗎,DOM0級和DOM2級有什么區別,DOM的分級是什么
210.平時是怎么調試JS的
211.JS的基本數據類型有哪些,基本數據類型和引用數據類型的區別,NaN是什么的縮寫,JS的作用域類型,undefined==null返回的結果是什么,undefined與null的區別在哪,寫一個函數判斷變量類型
212.setTimeout(fn,100);100毫秒是如何權衡的
213.JS的垃圾回收機制
214.寫一個newBind函數,完成bind的功能
215.怎么獲得對象上的屬性:比如說通過Object.key()
216.簡單講一講ES6的一些新特性
217.call和apply是用來做什么?
218.了解事件代理嗎,這樣做有什么好處
219.給出以下代碼,輸出的結果是什么?原因?
220.給兩個構造函數A和B,如何實現A繼承B?
221.如果已經有三個promise,A、B和C,想串行執行,該怎么寫?
222.知道private和public嗎
223.基礎的js
224.async和await具體該怎么用?
225.知道哪些ES6,ES7的語法
226.promise和await/async的關系
227.js的數據類型
228.js加載過程阻塞,解決方法
229.js對象類型,基本對象類型以及引用對象類型的區別
230.JavaScript中的輪播實現原理?假如一個頁面上有兩個輪播,你會怎么實現?
231.怎么實現一個計算一年中有多少周?
232.面向對象的繼承方式
233.引用類型常見的對象
234.es6的常用
235.class
236.call和apply的區別
237.es6的常用特性
238.箭頭函數和function有什么區別
239.new操作符原理
240.bind,apply,call
241.bind和apply的區別
242.promise實現
243.assign的深拷貝
244.說promise,沒有promise怎么辦
245.arguments
246.箭頭函數獲取arguments
247.Promise
248.事件代理
249.Eventloop
篇幅有限,需要更詳細的內容可以看文末獲取完整版PDF文檔
最后
今天的文章可謂是積蓄了我這幾年來的應聘和面試經歷總結出來的經驗,干貨滿滿呀!如果你能夠一直堅持看到這兒,那么首先我還是十分佩服你的毅力的。不過光是看完而不去付出行動,或者直接進入你的收藏夾里吃灰,那么我寫這篇文章就沒多大意義了。所以看完之后,還是多多行動起來吧!
可以非常負責地說,如果你能夠堅持把我上面列舉的內容都一個不拉地看完并且全部消化為自己的知識的話,那么你就至少已經達到了中級開發工程師以上的水平,進入大廠技術這塊是基本沒有什么問題的了。
248.事件代理
249.Eventloop
[外鏈圖片轉存中…(img-zD6B71H3-1623152835055)]
篇幅有限,需要更詳細的內容可以看文末獲取完整版PDF文檔
最后
今天的文章可謂是積蓄了我這幾年來的應聘和面試經歷總結出來的經驗,干貨滿滿呀!如果你能夠一直堅持看到這兒,那么首先我還是十分佩服你的毅力的。不過光是看完而不去付出行動,或者直接進入你的收藏夾里吃灰,那么我寫這篇文章就沒多大意義了。所以看完之后,還是多多行動起來吧!
可以非常負責地說,如果你能夠堅持把我上面列舉的內容都一個不拉地看完并且全部消化為自己的知識的話,那么你就至少已經達到了中級開發工程師以上的水平,進入大廠技術這塊是基本沒有什么問題的了。
資料領取方式:戳這里前往免費領取