我經(jīng)常會聽到一些想入行前端的人問，前端開發(fā)需要學習哪些技術？其實，除了核心的HTML、CSS、JavaScript技術外，像CSS預編譯、前端框架，如Vue，React、Node、Angular；代碼管理工具，如git，代碼編輯器，sublime text，還有測試，網(wǎng)絡安全等相關技術也是需要會一些。當然要求可能不會那么高，但至少要懂一些。所有今天準備了一些其他于前端相關的面試題供大家學習參考。希望對大家有所幫助。在大型項目中，為了提高CSS的可維護性，人們開始使用CSS預編譯技術。
CSS預編譯部分的面試題主要考察開發(fā)者對CSS預編譯技術的使用。當然，CSS預編譯技術中的變量、混合、方法、繼承、作用域、語句、插值等也是應試者需要了解的。目前CSS預編譯器主要有3種，分別是Less、 Sass、Stylus，應試者可以選擇一種，了解它的使用方式。sass是CSS預處理語言，scss是Sass語言中一套語法的拓展名。scss的特征是可以將CSS當作函數(shù)編寫，可以定義變量，可以嵌套定義，可以使用語句等。（1）通過npm安裝css-loader、 node-loader、sass- loader等加載器模塊。（2）在 webpack .config. js配置文件中定義Sass加載器。（1）編譯環(huán)境不一樣。Sass的安裝需要Ruby環(huán)境，是在服務器端處理的。而Less需要引入 less.js來處理，然后Less代碼輸岀CSS到瀏覽器中；也可以在開發(fā)環(huán)境中使用Less，然后編譯成CSS文件，直接放到項目中運行。（2）變量名不一樣。Less中使用@，而Sass中使用$。（3）插值語法不同，Less中使用@{key}，Sass中使用#{$key}。（4）Sass的混合相當于Less的方法，Sass的繼承相當于Less的混合。（5）輸出設置不同。Less沒有輸出設置。Sass提供4種輸出選項：nested、compact、 compressed和 expanded。nested選項用于嵌套縮進的CSS代碼（默認）， expanded選項用于展開多行CSS代碼， compact選項顯示簡潔格式的CSS代碼， compressed選項顯示壓縮后的CSS代碼。（6）Sass支持條件語句，如if…else、for循環(huán)等，而Less不支持。（7）引用外部CSS文件的方式不同。Sass引用外部文件時必須以“ _”開頭，文件名如果以下劃線“_”命名，Sass會認為該文件是一個引用文件，不會將其編譯為CSS文件。Less引用外部文件和CSS中的@ import沒什么差異。（8）Sass和Less的工具庫不同。Sass有工具庫 Compass。簡單說，Sass和 Compass的關系有點像 JavaScript和 jQuery的關系， Compass是Sass的工具庫。在它的基礎上，封裝了一系列有用的模塊和模板，補充和強化了Sass的功能。Less有UI組件庫 Bootstrap, Bootstrap是Web前端開發(fā)中一個比較有名的前端UI組件庫， Bootstrap中樣式文件的部分源碼就是采用Less語法編寫的。總之，不管是Sass，還是Less，都可以將它們視為一種基于CSS之上的高級語言，其目的是使得CSS開發(fā)更靈活和更強大。Sass的功能比Less強大，可以認為Sass是種真正的編程語言；Less則相對清晰眀了，易于上手，對編譯環(huán)境的要求比較寬松。預處理器（例如，Less、Sass、 Stylus）是用來把Sass或Less預編譯成CSS的工具，増強了CSS代碼的復用性。它有層級、 mixin、變量、循環(huán)、函數(shù)等，具有很方便的UI組件模塊化開發(fā)能力，能極大地提高工作效率。后處理器（如 PostCSS）通常被視為在完成的樣式表中根據(jù)CSS規(guī)范處理CSS，讓其更有效。目前最常做的是給CSS屬性添加瀏覽器私有前綴，解決跨瀏覽器兼容性的問題。在多人開發(fā)中，勢必要有一個理想的工具來管理每個人開發(fā)的代碼，Git、SVN等就是這類版本控制工具的代表。版本控制工具部分的面試題主要考察應試者對版本控制工具的了解，例如，使用Git提交代碼、解決沖突、發(fā)布到服務器端的方式，以及Git的架構理念、文件狀態(tài)等。
SVN是集中式版本控制系統(tǒng)，版本庫是集中放在中央服務器的，而開發(fā)的時候，用的都是自己的PC端。所以，首先要從中央服務器那里得到最新的版本，然后開發(fā)，旦開發(fā)任務完成后，需要把自己開發(fā)的文件推送到中央服務器。集中式版本控制系統(tǒng)必須聯(lián)網(wǎng)才能工作，如果在局城網(wǎng)環(huán)境下帶寬夠大，速度夠快，還是很方便的。但如果在互聯(lián)網(wǎng)環(huán)境下網(wǎng)速很慢，就會嚴重影響開發(fā)效率Gⅱt是分布式版本控制系統(tǒng)，它沒有中央服務器，每個人的PC就是一個完整的版本庫，這樣，工作的時候就不需要聯(lián)網(wǎng)了，因為版本庫都是在自己的PC上。每個人的PC都有一個完整的版本庫，當多人協(xié)作開發(fā)的時候，只須把各自的修改文件推送給對方，就可以互相看到對方的修改了。2、說說Git中 merge和 rebase的區(qū)別。在Git中， merge和 rebase從最終效果來看沒有任何區(qū)別，都是將不同分支的代碼融合在一起，但是生成的代碼樹稍有不同。rebase操作不會生成新的節(jié)點，而是將兩個分支融合成一個線性的提交。而 merge操作生成的代碼樹會顯得比較亂。4、如何管理你的項目代碼？管理項目代碼的過程中，大多數(shù)情況下使用命令行還是工具？在項目開發(fā)階段就使用Git。在項目開始階段，通常會單獨拉取一個分支，在這個分支上開發(fā)新功能。做好之后讓經(jīng)理審核一下代碼，如果代碼沒問題，他會把分支合并到主干上。當沒有沖突的時候用命令行比較多。首先，在每次提交之前我會使用 Git pull拉取線上的代碼，獲取最新的代碼。然后通過Git add，把新的代碼寫入緩沖區(qū)，再用 Git commit-m“備注”生成一個本地的版本，最后用 Git push推到線上庫。5、Git fetch和Git pull的區(qū)別是什么？Git pull相當于從遠程獲取最新版本并合并到本地；Git fetch相當于從遠程獲取最新版本并存放到本地，而不會自動合并。網(wǎng)絡安全是網(wǎng)站能夠正常運行的保證，因此越來越多的人開始關注網(wǎng)絡安全這一部分的內(nèi)容。網(wǎng)絡安全部分的面試題主要考察應試者對網(wǎng)絡的認知，開發(fā)者需要了解常見的網(wǎng)絡攻擊方式，并在開發(fā)中避免漏洞。網(wǎng)絡漏洞無法預知（如果能夠預知新的漏洞就不會再有攻擊者了），但是屏蔽掉已知的漏洞還是十分必要的。SQL注入就是把SQL命令插入Web表單、輸入域名或頁面請求的查詢字符串中，最終達到欺騙服務器執(zhí)行惡意的SQL命令。（1）始終不要信任用戶的輸入，要對用戶的輸入進行校驗，可以通過正則表達式或限制長度，對單引號和雙“-”進行轉(zhuǎn)換等。（2）始終不要使用動態(tài)拼裝SQL，可以使用參數(shù)化的SQL或者直接使用存儲過程進行數(shù)據(jù)查詢與存取。（3）始終不要使用管理員權限的數(shù)據(jù)庫連接，為每個應用使用單獨的權限和有限的權限數(shù)據(jù)庫連接，（4）不要把機密信息用明文存放，應通過加密或者散列處理密碼和敏感的信息。XSS（ Cross Site Scripting）攻擊指的是攻擊者向Web頁面里插入惡意HTML標簽或者 JavaScript代碼。比如，攻擊者在論壇中放一個看似安全的鏈接，騙取用戶單擊并竊取 cookie中的用戶私密信息；或者攻擊者在論壇中加一個惡意表單，當用戶提交表單的時候，卻把信息傳送到攻擊者的服務器中，而不是用戶原本以為的信任站點。要防范XSS攻擊，首先，在代碼里對用戶輸入的地方和變量都需要仔細檢查長度和對“<” “>” “;” “ ' ”等字符做過濾。其次，在把任何內(nèi)容寫到頁面之前都必須進行編碼，避免泄露 htmltag。在這一個層面做好，至少可以防止超過一半的XSS攻擊。首先，避免直接在 cookie中泄露用戶隱私，例如E-mai、密碼等。其次，使 cookie和系統(tǒng)ip綁定，降低 cookie泄露后的危險。這樣攻擊者得到的cookie沒有實際價值，不可能拿來重放。如果網(wǎng)站不需要在瀏覽器端對 cookie進行操作，可以在 Set-Cookie末尾加上 HttpOnly防止 JavaScript代碼直接獲取 cookie。最后，盡量采用POST請求方式而非GET請求方式提交表單。XSS攻擊用于獲取信息，不需要提前知道其他用戶頁面的代碼和數(shù)據(jù)包。CSRF攻擊用于代替用戶完成指定的動作，需要知道其他用戶頁面的代碼和數(shù)據(jù)包。要完成一次CSRF攻擊，受害者必須依次完成兩個步驟。（1）登錄受信任網(wǎng)站A，并在本地生成 cookie。（2）在不登出A的情況下，訪問危險網(wǎng)站B防范服務器端的CSRF攻擊有很多種方法，但總的思想都是一致的，就是在客戶端頁面中增加偽隨機數(shù)。（1）XSS攻擊：通過存在安全漏洞的Web網(wǎng)站，注冊到用戶的瀏覽器內(nèi)，渲染非法的HTML標簽或者運行非法的 JavaScript進行攻擊的一種行為。（2）SL注入攻擊：通過把SQL命令插入Web表單、輸入域名或頁面請求的查詢字符串中，最終達到欺騙服務器執(zhí)行惡意的SQL命令。（3）CSRF攻擊：攻擊者通過設置陷阱，強制對已完成的認證用戶進行非預期的個人信息或設定信息等狀態(tài)的更新。推薦閱讀
【前端面試題】—18道有關混合開發(fā)的面試題(附答案)
【前端面試題】—21道有關移動端的面試題(附答案)
【前端面試題】—19道有關前端測試的面試題(附答案)
【前端面試題】—26道HTTP和HTTPS的面試題(附答案)
【前端面試題】—18道有關模塊化開發(fā)的面試題(附答案)
【前端面試題】—21道關于性能優(yōu)化的面試題(附答案)
【前端面試題】—44道常見Augluar基礎面試題（附答案）
下載APP