# 面試問題
HTML and CSS
---
- [什麼是 semantic HTML?](/fFc9SmwuQWKQ6MYI-gHj1Q)
- [display: inline 和 display: block 的差異?](/yMjEDx9GSN6rGylhWIapEg)
- [display: none 和 visibility: hidden 的差異?](/pBjbJBb4QdeUEH_FWWtzSw)
- [div 和 span 的差異?](/-gdtAPNnTPqMRayxfemfZw)
- [試著說明 Flex Box 的用法](/SCG66BGaS7aGHugnWp7Yng)
- [如何優化網頁的載入速度?有哪些可能的做法和考量?](/DNK85eZ6SCezIlToh1ruRw)
- [如何知道一個新的 HTML、CSS、或 JavaScript 功能是否相容於所有瀏覽器?如果你要用的新功能只能相容於 Chrome 的話怎麼處理?](/aaGPpxp6QxmAoyU4gicGLA)
- [請解釋 px、em、rem 使用在 font-size 上的差異?](/N37HtmZUTgeUUCTUaabBog)
- [什麼是 CSS 預處理器?](/ZEIDskCIQDCW83vVqAJezQ)
- [* { box-sizing: border-box; } 是做什麼的?](/OcaNmE1nTMmBLv_G70EE9w)
- [flex-box](/7uobhsy3QkKiUNLONFnPfg)
- [N種使元素水平/垂直居中的方法](/oEBn_B4mRSCtXjfnSwAqtg)
JavaScript Basic
---
- [Explain the mechanism of the ““event loop”” in browser.](/UO8iXjvJT_y67A2NZZJZTg)
- [Spread Sytnax ... 怎麼用?](/PVs01vJBRvOJ55s3ihZA7g)
- [null 和 undefined 的差異?](/YPTVNZyvT8m3lGcqxEwoWw)
- [什麼是 NaN?在什麼情況下會出現 NaN?如何偵測變數中的資料是 NaN?](/qxviBBueSWSNm0FnD7AYPw)
- [解釋 Primitive Data Type 和 Reference Data Type 的差別。](/vIenW05KRAitgRshHhPHBg)
- [解釋一下變數 scope 的概念、使用 let 和 var 宣告變數有什麼差別?](/FBddUzgATzKVcQHDWzlb3A)
- [什麼是 Closure?能否舉例說明?](/f3DVA4kpTc-5bNI1L76sFg)
- [試說明 Hoisting 的現象?](/JpUmJHUjSq-2ZEqueVWJAQ)
- [什麼是 this?](/DPWfFcQ2RAWEOasByrkNiA)
- [什麼是 Pure Function?](/Bko3kxfvR0eneUddlktxWg)
- [什麼是 Higher-Order Function?](/s4-jKoOeS_2LxMkuLbENCA)
- [解釋一下什麼是非同步的程式?如何運用 callback 或 promise 或 async await 包裝非同步程式?](/vfGZdV0aSKKqfbcVgjXrCw)
- [有寫過箭頭函式嗎?箭頭函式和其他函式的寫法除了語法之外,還有什麼差異?(特別是 this 的差異)](/Ucxv2cH-R1-Y66I2hiZ6lg)
- [解釋一下你對原型鍊的理解?](/YbCVwqhkSyaKGR9BkaVPUg)
- [== 和 === 的差別?](/-xTLaen0Rqm9UfZRJvcyCA)
- [請解釋 deep copy 與 shallow 的差異?](/jpFfS7jvRQyz__WeqShPjw)
- [什麼是事件傳遞 (event propagation) ?試說明事件處理中 bubble 和 capture 的差別](/rNA8RQeOTXeb-Y72vp93Wg)
- [什麼是事件物件 (event object),你在程式中如何取得與使用?試說明 target 和 currentTarget 的差別](/sQkEC4hTScSvkDBMf_9Jfw)
- [有遇過效能問題嗎?如何改善它?](/Y-zjknFHSva_xbDKTcw4Rw)
- [ES6語法有哪些](/PSYpjNf4S2m1yuqai3q8qw)
React / Redux / Styled Component
---
- [試著說明 React 的核心概念。(component、props、state)](/UvrH1tQSTtWmGr-Amcpsgg)
- [試著比較 React Class 和 Function Component 的生命週期](/Ps6rsxvAQ6mw7NkmFA3K3A)
- [有使用過 Redux 嗎?Redux 的出現是為了解決什麼樣的問題?Redux 的基本架構為何?](/Z_IQ-qVhQ2SC3Qzv-NJluA)
- [有使用過 React Router 嗎?React Router 的轉址和多頁式網頁的轉址有什麼差別?](/6-U0UnX3Sz2AA1hdn4o-wQ)
- [有使用過任何 React 相關的套件嗎?你如何選擇以及如何使用?](/82XAC9fMQjmmbcZTqLaqXg)
- [模擬面試題 - React-router-dom](/W0DFnOXqRoyGuSSrIl-8dQ)
- [為什麼選擇 Styled Component ? 和其他 CSS-in-JS 方法的差異在哪?](/kGAZ5FVRRXiH4Lx6YRxL_A)
- [reportWebVitals](/NBPtuEw2TdOkgQsURt4E9A)
網路和瀏覽器
---
- [什麼是 RESTful API,能否分享你串接 RESTful API 的經驗?](/TXhTUyROTo-oDl7JRguzZQ)
- [什麼是 Cookie?試說明 Cookie 的運作方式?](/2N3XhLK0RqidjsQNXME79g)
- [什麼是 Web Storage?和 Cookie 的特性有什麼差別?](/wvZFdI3-RB-FuXHIAZsC_A)
- [Websocket 通訊協定和 HTTP 通訊協定的關鍵差異是?](/i8IjrOI_SRmC2z6qeuFCcQ)
- [什麼是 CDN?](/ptJkYXx1SfSUYcgmLOUeLA)
- [模擬面試題 - 請解釋 CORS Issue](/d1iv67OsTveZMPonxF6zZA)
Git
---
- [知道 Git Flow 嗎?你如何在開發過程中使用 Git 做版本控制?](/oKPy1bVDQ0aqoeSe2S3xwA)
Code Quality
---
- [你有聽過 eslint 嗎?你用的是哪一套 rule?有沒有遇過哪一條規則讓你覺得綁手綁腳的經驗?你如何處理?](/m1DhD6NPS1Kc49X2Hksu0w)
- [你對重構的瞭解?](/fV5ncAaLQMCKOJqmE3fyzA)
程式碼考題
---
- [程式碼考題](/mvtYPfWjRzuHqdU_hl2XJQ)
其他
---
- [Personality](/uoOKmPD0QNuJjZu_D8tFhg)
- [個人專案問題](/-5HVEQtzSHOu24Fkwy2qlQ)
- [網路上蒐集到的各種面試問題](/tF16m9LcTuirDV6qE1BjZQ)
{"metaMigratedAt":"2023-06-16T15:37:35.745Z","metaMigratedFrom":"YAML","title":"前端面試問題","breaks":true,"contributors":"[{\"id\":\"ab003423-a251-46fe-91ff-a5efee1c0bf1\",\"add\":344,\"del\":71},{\"id\":\"28ff94c6-bf5d-4782-bf3f-c12f67196fc5\",\"add\":201,\"del\":0},{\"id\":\"151af890-3dd6-4043-a086-c8d3305df4cf\",\"add\":96,\"del\":0},{\"id\":\"f7331390-ea11-407a-809b-a23ff5ebdf05\",\"add\":5770,\"del\":3030},{\"id\":\"7d219cc8-0ee1-4b61-b3e5-8c14c752cba3\",\"add\":43,\"del\":0},{\"id\":\"a8b4eceb-9163-42c3-a81e-45fccafad37d\",\"add\":60,\"del\":94}]"}