記錄一組面試題 近期較忙,慢慢會把答案全部補齊

css

  • 1、盒模型

  • 2、flex

  • 3、css單位

  • 4、css選擇器

  • 5、bfc 清除浮動

  • 6、層疊上下文

  • 7、常見頁面佈局

  • 8、響應式佈局

  • 9、css預處理,後處理

  • 10、css3新特性

    • animation和transiton的相關屬性

    • animate和translate

  • 11、display哪些取值

  • 12、相鄰的兩個inline-block節點爲什麼會出現間隔,該如何解決

  • 13、meta viewport 移動端適配

  • 14、CSS實現寬度自適應100%,寬高16:9的比例的矩形

  • 15、rem佈局的優缺點

  • 16、畫三角形

  • 17、1像素邊框問題

 

html

  • 1、語義化

  • 2、新標籤新特性

  • 3、input和textarea的區別

  • 4、用一個div模擬textarea的實現

  • 5、移動設備忽略將頁面中的數字識別爲電話號碼的方法

 

JS

  • 1、原型/原型鏈/構造函數/實例/繼承

  • 2、有幾種方式可以實現繼承

  • 3、用原型實現繼承有什麼缺點,怎麼解決

  • 4、arguments

  • 5、數據類型判斷

  • 6、作用域鏈、閉包、作用域

  • 7、Ajax的原生寫法

  • 8、對象深拷貝、淺拷貝

  • 9、圖片懶加載、預加載

  • 10、實現頁面加載進度條

  • 11、this關鍵字

  • 12、函數式編程

  • 13、手動實現parseInt

  • 14、爲什麼會有同源策略

  • 15、怎麼判斷兩個對象是否相等

  • 16、事件模型

    • 事件委託、代理

    • 如何讓事件先冒泡後捕獲

  • 17、window的onload事件和domcontentloaded

  • 18、for...in迭代和for...of有什麼區別

  • 19、函數柯里化

  • 20、call apply區別,原生實現bind

    • call,apply,bind 三者用法和區別:角度可爲參數、綁定規則(顯示綁定和強綁定),運行效率、運行情況。

  • 21、async/await

  • 22、立即執行函數和使用場景

  • 23、設計模式(要求說出如何實現,應用,優缺點)/單例模式實現

  • 24、iframe的缺點有哪些

  • 25、數組問題

    • 數組去重

    • 數組常用方法

    • 查找數組重複項

    • 扁平化數組

    • 按數組中各項和特定值差值排序

  • 26、BOM屬性對象方法

  • 27、服務端渲染

  • 28、垃圾回收機制

  • 29、eventloop

    • 進程和線程

    • 任務隊列

  • 30、如何快速讓字符串變成已千爲精度的數字

 

ES6

  • 1、聲明 let、const

  • 2、解構賦值

  • 3、聲明類與繼承:class、extend

  • 4、Promise的使用與實現

  • 5、generator(異步編程、yield、next()、await 、async)

  • 6、箭頭函數this指向問題、拓展運算符

  • 7、map和set有沒有用過,如何實現一個數組去重,map數據結構有什麼優點?

  • 8、ES6怎麼編譯成ES5,css-loader原理,過程

  • 9、ES6轉成ES5的常見例子

    • 使用es5實現es6的class

 

瀏覽器

  • 1、輸入url到展示頁面過程發生了什麼?

  • 2、重繪與迴流

    • 重繪(repaint): 當元素樣式的改變不影響佈局時,瀏覽器將使用重繪對元素進行更新,此時由於只需要UI層面的重新像素繪製,因此 損耗較少

    • 迴流(reflow): 當元素的尺寸、結構或觸發某些屬性時,瀏覽器會重新渲染頁面,稱爲迴流。此時,瀏覽器需要重新經過計算,計算後還需要重新頁面佈局,因此是較重的操作。會觸發迴流的操作:
      * 頁面初次渲染
      * 瀏覽器窗口大小改變
      * 元素尺寸、位置、內容發生改變
      * 元素字體大小變化
      * 添加或者刪除可見的 dom 元素
      * 激活 CSS 僞類(例如::hover)
      * 查詢某些屬性或調用某些方法
      * clientWidth、clientHeight、clientTop、clientLeft
      * offsetWidth、offsetHeight、offsetTop、offsetLeft
      * scrollWidth、scrollHeight、scrollTop、scrollLeft
      * getComputedStyle()
      * getBoundingClientRect()
      * scrollTo()
      迴流必定觸發重繪,重繪不一定觸發迴流。重繪的開銷較小,迴流的代價較高。

  • 3、防抖與節流

  • 4、cookies、session、sessionStorage、localStorage

  • 5、瀏覽器內核

 

服務端與網絡

  • 1、常見狀態碼

  • 2、緩存

    • 200 From cache和200 ok

    • 400,401,403狀態碼分別代表什麼

    • 瀏覽器緩存

  • 3、cookie, session, token

  • 4、前端持久化的方式、區別

  • 5、DNS是怎麼解析的

  • 6、cdn

  • 7、計算機網絡的相關協議

  • 8、http/https/http2.0

  • 9、get post區別

  • 10、ajax、 axios庫

  • 11、tcp三次握手,四次揮手流程

  • 12、跨域

  • 13、前端安全XSS、CSRF

  • 14、websocket

  • 15、Http請求中的keep-alive有了解嗎

  • 16、網絡分層

  • 17、即時通信,除了Ajax和websocket

  • 18、模塊化,commonJS,es6,cmd,amd

 

Vue

  • 1、vue解決了什麼問題

  • 2、MVVM的理解

  • 3、如何實現一個自定義組件,不同組件之間如何通信的?

  • 4、nextTick

  • 5、生命週期

  • 6、虛擬dom的原理

  • 7、雙向綁定的原理?數據劫持?

  • 8、組件通信

    • 父->子

    • 子->父

    • 非父子組件

  • 9、Proxy 相比於 defineProperty 的優勢

  • 10、watch computed區別

  • 11、virtual dom 原理實現

  • 12、vue-router(hash, HTML5 新增的 pushState

    • 單頁應用,如何實現其路由功能---路由原理

    • vue-router如何做用戶登錄權限等

    • 你在項目中怎麼實現路由的嵌套

  • 13、vuex的理解

 

前端性能優化

  • 頁面DOM節點太多,會出現什麼問題?如何優化?

  • 如何做性能監測

 

SEO和語義化

這個沒被問過

 

微信小程序

微信小程序和h5差異,如果有開發weex的經驗,可能會加上weex

git

一些基本命令

打包工具webpack

  • 1、打包原理

  • 2、打包插件

  • 3、webpack熱更新原理

  • 4、優化構建速度

 

算法

  • 1、排序算法

  • 2、動態規劃,參見揹包問題

  • 3、二叉樹

  • 4、加油站問題(貪心算法)

  • 5、二分法

  • 6、二叉樹遍歷

  • 7、單鏈表反轉

  • 8、取1000個數字裏面的質數

  • 9、找出數組中和爲給定值的兩個元素,如:[1, 2, 3, 4, 5]中找出和爲6的兩個元素。

  • 10、線性順序存儲結構和鏈式存儲結構有什麼區別?以及優缺點

 

移動端

  • 1、自適應

  • 2、pwa

  • 3、移動端手勢

 

附加題

  • 1、無限滾動方案

  • 2、如何處理兼容性問題

  • 3、你遇到過最難的問題是什麼

  • 4、ES6 class與ES5 function區別及聯繫

  • 5、vue怎麼監聽數組

  • 6、寫過webpack loader嗎

  • 7、微信網頁版登錄機制思考

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章