2018前端我的面試總結

時間 2019-11-08

標籤前端我的面試總結欄目快樂工作简体版

原文原文鏈接

　前言：css

　　最近一直在面試，我把面試的5家公司面試題，選擇了一些來總結說明，若有問題，歡迎各位小夥伴給與指正
html

　　有些題的答案是百度，有些則是我本身的理解，有些題是開放題，沒有標準答案，根據本身實際狀況回答便可前端

　 下面這些題都很基礎，更多更全的面試題我會在最後把連接發出來，那些連接是我準備面試收集的不錯的面試題合集vue

　　HTML程序員

　　 問題1：你怎麼理解web語義化？es6

　　　　要合理使用語義化的標籤，好比，段落用P標籤，標題用H1-H6；這樣不只利於SEO，也利於後期維護
web

　　　 問題2：HTML5新增語義化 / 結構元素有哪些？面試

　　　　header, main, nav, side, article, section, footer編程

　　　 問題3：<img>標籤的title和alt屬性有什麼區別？小程序

　　　前者是在圖片正常加載，鼠標指上去顯示的文本值；後者是在圖片加載失敗之後顯示的提示文字信息

　　CSS

　　　問題1：display:none和visibility:hidden;的區別？

　　　前者讓元素從DOM樹中消失，不佔據任何空間；後者不會讓元素從DOM樹中消失，仍佔據空間，只是內容不可見。

　　　 問題2：css定位有幾種方式？分別是什麼？有什麼區別？

　　　 4種；static,relative,absolute,fixed；

　　　 static：是默認值（靜態定位）;

　　 relative：相對定位，相對於自身偏移，不會脫離文檔流

　　　 absolute：絕對定位，相對於父元素偏移，脫離文檔流

　　　 fixed：固定定位，相對於瀏覽器可視區域定位，脫離文檔流

　　　問題3：什麼是css的盒子模型？

　　盒子模型是指：外邊距（margin）+ border（邊框） + 內邊距（padding）+ content（內容）

　　能夠把每個容器，好比div，都看作是一個盒子模型

　　好比你給一個div設置寬高爲500px，但實際你設置的只是content

　　　以後你又設置了padding:10px;border:1px solid red;

　　這時div的寬高就會變爲544px（content 500px + padding 40px + border 4px）

　　 至關於一個元素的實際寬高是由：　padding + border + content 組成

　　問題1：location.replace()和location.assign()有什麼區別？

　　前者是直接替換原來的URL地址，沒有返回；後者是在原來的URL地址後面插入新的URL地址，有返回

　　問題2：建立JavaScript對象的三種方法？

　　1️⃣：建立一個空對象

　　　var obj = {};

　　2️⃣：對象字面量

　　var obj = {

　　name: "Tom",

　　age: 21

　}

　　3️⃣：使用new關鍵字（不推薦，儘可能不要用這種方式建立對象）

　　var obj = new Object();

　　問題3：事件綁定的三種方法？

　　1️⃣：直接綁定在HTML元素上，不推薦這種，耦合過高

　 2️⃣： 經過DOM獲取到元素，而後綁定事件（綁定多個事件時不適用）

　　　var ele = document.getElementById("element");

　　　ele.click = function(){}

　 3️⃣：綁定多個事件時推薦這種方式

　　addEventListener('click'，'element'，function(){})

　　問題4：說一說你對閉包的理解（什麼是閉包，用處）　　

　個人理解是閉包能夠看做是一種方法，這個方法能夠幫助咱們從外部獲取到函數內部的變量

　閉包的用處主要有2個

　一是能夠從外部獲取到函數內部的變量；

　二是讓變量一直存在，不被js的回收機制回收，但濫用閉包會形成內存泄漏

　　問題5：typeof null 和 typeof undefiind 的結果是什麼？它們的區別？

　　結果都是object

　　前者表示一個空值，是一個特殊的對象，但null成爲對象是歷史遺留形成的（感興趣的小夥伴可自行百度）

　後者的出現也是爲了和null作區分，表示未定義，好比一個變量只聲明沒有賦值 var x;

　 問題6：es6的 let 和 const 的區別？

　 let用於聲明變量，至關於es5裏的 var，而且有塊級做用域

　 const用於聲明常量

　　問題7：說一說你對promise對象的認識（es6）

　　Promise是 CommonJS 提出來的這一種規範，有多個版本，在 ES6 當中已經歸入規範，原生支持 Promise 對象；

　　非 ES6 環境能夠用相似 Bluebird、Q 這類庫來支持。

　　詳見：http://es6.ruanyifeng.com/?search=promise&x=4&y=2#docs/promise （阮一峯）

　　問題8：在瀏覽器輸入地址按回車之後，發生了什麼？（簡述）

　　 1：DNS服務器對該域名進行解析（這個域名解析出來的IP地址就是要請求資源的服務器地址）

　　 2：嘗試向該服務器創建鏈接，通過三次握手成功創建鏈接

　　 3：向服務器發送 HTTP 請求

　　 3：服務器收到、處理並返回 HTTP 請求

　　 4：瀏覽器獲得返回內容（這個時候返回的內容都是字符串，須要瀏覽器解析，也就是瀏覽器渲染的過程）

　　問題9：簡述瀏覽器渲染的過程？（這個提及來文字較多，因此就說幾個要點）

　　 1：根據 HTML 結構生成 DOM 樹

　　2：根據 CSS 生成 CSSOM

　　3：將 DOM 和 CSSOM 整合造成 RenderTree（渲染樹）

　　4：根據 RenderTree 開始渲染和展現

　　5：遇到<script>時，會執行並阻塞渲染

　　注：這也是爲何link引入的CSS文件要放在<head>頭部，這樣便於瀏覽器快速解析完成css樣式，生CSSOM；

　　　　而引入的js文件要放在底部就是爲了不阻塞頁面加載，致使頁面空白

　　問題10：new操做符到底作了什麼？

　　1：建立一個空對象，用來返回實例對象

　　2：把這個空對象的原型指向構造函數的prototype屬性

　 3：讓構造函數的this指向實例對象

　　4：返回建立的實例對象

　 性能優化

　　　什麼是SEO？SEO要怎麼作？

　　　http://www.javashuo.com/article/p-twbnioja-mo.html 這是我以前寫的一篇關於seo基礎的博客

　　　 若是讓你從前端的角度作性能優化，你會怎麼作

　　　 https://www.cnblogs.com/tu-0718/p/6170463.html 這是我以前寫的一篇關於前端性能優化的博客

　　HTTP

　　　　問題1：說一說狀態碼301和302的區別？

　　　　301：永久重定向，訪問的地址永久被遷移到其它地址

　　　　302：臨時重定向，訪問的地址臨時被遷移到其它地址

　　　　詳見：https://blog.csdn.net/u013474436/article/details/48138707

　　　 問題2：cookie 和 localStorage 有何區別？

　　　 cookie

　　　　　 1：存儲量過小，只有 4KB

　　　　　　2：全部 HTTP 請求都帶着，會影響獲取資源的效率

　　　　　　 3：API 簡單，須要封裝才能用

　　　　localStorage

　　　　　 1：存儲量增大到 5MB

　　　　　　2：不會帶到 HTTP 請求中

　　　　　　3：API 適用於數據存儲 localStorage.setItem(key, value)localStorage.getItem(key)

　　　　問題3：sessionStorage和 localStorage 有何區別？

　　　　前者爲臨時存儲，當網頁或瀏覽器關閉時，緩存會自動清除

　　　後者爲永久存儲，除非手動自行清除緩存，不然，緩存永久有效

　　　 問題4：什麼是同源策略？

　　　同源策略就是指協議，端口，域名所有都要相同。這是瀏覽器爲安全性考慮實施的安全策略　

　　　詳見：http://www.ruanyifeng.com/blog/2016/04/same-origin-policy.html　

　　開放性問題（沒有答案）

　　1：你以爲JS有哪些優勢？你怎麼理解JS的面向對象編程？

　　2：可否一我的獨立開發？

　　3：若是和另外一我的一塊兒開發，怎麼讓工做效率更高？

　　4：若是和另外一我的一塊兒開發，他技術比你好，你會怎麼辦？

　　5：若是和另外一我的一塊兒開發，你技術比他好，你會怎麼辦？

　　6：有沒有了解太小程序，說說你對小程序的認識？

　　7：你以爲vue和原生js相比有什麼好處？

　　8：說一說你遇到過的兼容性問題（PC和移動端各說一個）

　　9：使用過flex佈局嗎，有什麼優勢？

　　10：你對加班是怎麼看的？

附：我的收集的不錯的面試題連接分享

　　 1：http://www.javashuo.com/article/p-wuxucrdi-dw.html　　2018面試題

　　　　2：http://www.javashuo.com/article/p-fnbljxtu-s.html 　　2017年前端面試題最新彙總

　　　　3：http://www.javashuo.com/article/p-xulgnctl-bb.html 　　2017年前端面試題整理彙總100題

　　　　5：http://www.javashuo.com/article/p-kaaztzka-s.html 　　前端面試題300道~~熬夜吐血整理

　　　　6：http://www.javashuo.com/article/p-gvizxzrh-hz.html 　　我遇到的前端面試題2017

　　　　7：http://www.javashuo.com/article/p-cqjshfgy-k.html 　　 JavaScript面試

　　　　8：http://www.javashuo.com/article/p-dzpvgzet-cw.html 　　你不能錯過的前端面試題合集

　　　　9：http://www.javashuo.com/article/p-riwvmnzo-kv.html 　　VUE合集面試題

　　　　10：https://www.jianshu.com/p/e54a9a34a773 　　VUE合集面試題

　　　 11： https://www.qdfuns.com/article/47855/dad8d910a0a6ea455a8319a827aaad7b.html 　　（沒有答案）

　　　　12： http://www.javashuo.com/article/p-hrkoxhma-mo.html 　　別的程序員是怎樣讀你的簡歷的（僅供參考）

　　　　13：http://www.javashuo.com/article/p-vaqbplam-eb.html 　　如何準備一次技術面試（附一套前端面試題）

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。

2018前端我的面試總結

1： 你以爲JS有哪些優勢？你怎麼理解JS的面向對象編程？

2：可否一我的獨立開發？

3：若是和另外一我的一塊兒開發，怎麼讓工做效率更高？

4：若是和另外一我的一塊兒開發，他技術比你好，你會怎麼辦？

5：若是和另外一我的一塊兒開發，你技術比他好，你會怎麼辦？

6：有沒有了解太小程序，說說你對小程序的認識？

7：你以爲vue和原生js相比有什麼好處？

8：說一說你遇到過的兼容性問題（PC和移動端各說一個）

9：使用過flex佈局嗎，有什麼優勢？

10：你對加班是怎麼看的？

2：http://www.javashuo.com/article/p-fnbljxtu-s.html 2017年前端面試題最新彙總

3：http://www.javashuo.com/article/p-xulgnctl-bb.html 2017年前端面試題整理彙總100題

6：http://www.javashuo.com/article/p-gvizxzrh-hz.html 我遇到的前端面試題2017

7：http://www.javashuo.com/article/p-cqjshfgy-k.html JavaScript面試

8：http://www.javashuo.com/article/p-dzpvgzet-cw.html 你不能錯過的前端面試題合集

9：http://www.javashuo.com/article/p-riwvmnzo-kv.html VUE合集面試題

10：https://www.jianshu.com/p/e54a9a34a773 VUE合集面試題

11： https://www.qdfuns.com/article/47855/dad8d910a0a6ea455a8319a827aaad7b.html （沒有答案）

12： http://www.javashuo.com/article/p-hrkoxhma-mo.html 別的程序員是怎樣讀你的簡歷的（僅供參考）

　　1：你以爲JS有哪些優勢？你怎麼理解JS的面向對象編程？

　　2：可否一我的獨立開發？

　　3：若是和另外一我的一塊兒開發，怎麼讓工做效率更高？

　　4：若是和另外一我的一塊兒開發，他技術比你好，你會怎麼辦？

　　5：若是和另外一我的一塊兒開發，你技術比他好，你會怎麼辦？

　　6：有沒有了解太小程序，說說你對小程序的認識？

　　7：你以爲vue和原生js相比有什麼好處？

　　8：說一說你遇到過的兼容性問題（PC和移動端各說一個）

　　9：使用過flex佈局嗎，有什麼優勢？

　　10：你對加班是怎麼看的？

　　　　2：http://www.javashuo.com/article/p-fnbljxtu-s.html 　　2017年前端面試題最新彙總

　　　　3：http://www.javashuo.com/article/p-xulgnctl-bb.html 　　2017年前端面試題整理彙總100題

　　　　6：http://www.javashuo.com/article/p-gvizxzrh-hz.html 　　我遇到的前端面試題2017

　　　　7：http://www.javashuo.com/article/p-cqjshfgy-k.html 　　 JavaScript面試

　　　　8：http://www.javashuo.com/article/p-dzpvgzet-cw.html 　　你不能錯過的前端面試題合集

　　　　9：http://www.javashuo.com/article/p-riwvmnzo-kv.html 　　VUE合集面試題

　　　　10：https://www.jianshu.com/p/e54a9a34a773 　　VUE合集面試題

　　　 11： https://www.qdfuns.com/article/47855/dad8d910a0a6ea455a8319a827aaad7b.html 　　（沒有答案）

　　　　12： http://www.javashuo.com/article/p-hrkoxhma-mo.html 　　別的程序員是怎樣讀你的簡歷的（僅供參考）