1.如何用原生js給一個按鈕系結兩個onclick事件？
q：btn.addEventListener("click",hello);
2.document.write和innerHTML的區別；
q：document.write是直接寫入到頁面的內容流，會導致頁面被重寫。innerHTML將內容寫入某個DOM節點，不會導致頁面全部重繪；
3.ajax的步驟；
q：(1) 創建XMLHttpRequest物件,也就是創建一個異步呼叫物件.
?? (2) 創建一個新的HTTP請求,并指定該HTTP請求的方法、URL及驗證資訊.
?? (3)設定回應HTTP請求狀態變化的函式.
?? (4)發送HTTP請求.
?? (5)獲取異步呼叫回傳的資料.
?? (6)使用JavaScript和DOM實作區域重繪.
4.xml和json的區別；
q：json資料體積小，傳遞速度快，JSON與JavaScript的互動更加方便，更容易決議處理，更好的資料互動，XML對資料描述性比較好；
5.清楚浮動的方法；（常見）
q：(1).父級div定義 height ;(如果高度和父級div不一樣時，會產生問題) (2).結尾處加空div標簽 clear:both; (2).父級div定義 偽類:after 和 zoom;(IE8以上和非IE瀏覽器才支持:after) (2).父級div定義 overflow:hidden;(不能和position配合使用)
6.box-sizing常用的屬性;
q：· box-sizing：content-box；(默認屬性值，W3C) · box-sizing：border-box;(IE盒模型) · box-sizing：inherit;
(box-sizing屬性在FireFox中存在兼容問題，所以需要使用-moz-box-sizing做一下兼容)
7.undefined 和 null 區別；
q：null： Null型別，代表“空值”代表一個空物件指標，使用typeof運算得到 “object” undefined： Undefined型別，當一個宣告了一個變數未初始化時，得到的就是undefined。(null 和 undefined 都表示“值的空缺”，你可以認為undefined是表示系統級的、出乎意料的或類似錯誤的值的空缺，而null是表示程式級的、正常的或在意料之中的值的空缺。)
8.常見的HTTP狀態碼；
q：2開頭 （請求成功）、3開頭 （請求被重定向）、4開頭 （請求錯誤）、5開頭（服務器錯誤）
9.網站性能優化；
q：1. JavaScript 壓縮和模塊打包 2. 按需加載資源 3. 快取 4. 使用索引加速資料庫查詢 5. 使用更快的轉譯方案 6. 避免或最小化 JavaScript 和 CSS 的使用而阻塞渲染 7. 圖片編碼優化
10.JS哪些操作會造成記憶體泄露；
q：1）意外的全域變數引起的記憶體泄露； 2）閉包引起的記憶體泄露； 3）沒有清理的DOM元素參考； 4）被遺忘的定時器或者回呼； 5）子元素存在引起的記憶體泄露；
11.什么是閉包，如何使用它，為什么要使用它；
q：閉包就是能夠讀取其他函式內部變數的函式。由于在Javascript語言中，只有函式內部的子函式才能讀取區域變數，因此可以把閉包簡單理解成“定義在一個函式內部的函式”；由于閉包會使得函式中的變數都被保存在記憶體中，記憶體消耗很大，所以不能濫用閉包，否則會造成網頁的性能問題，在IE中可能導致記憶體泄露。解決方法是，在退出函式之前，將不使用的區域變數全部洗掉。
12.JavaScript的同源策略；
q：同源策略規定跨域之間的腳本是隔離的，一個域的腳本不能訪問和操作另外一個域的絕大部分屬性和方法。
13.瀏覽器是如何渲染頁面的；
q：1.決議HTML檔案，創建DOM樹。
? ?自上而下，遇到任何樣式（link、style）與腳本（script）都會阻塞（外部樣式不阻塞后續外部腳本的加載）。 2.決議CSS。優先級：瀏覽器默認設定<用戶設定<外部樣式<行內樣式<HTML中的style樣式； 3.將CSS與DOM合并，構建渲染樹（Render Tree）； 4.布局和繪制，重繪（repaint）和重排（reflow）；
14.從輸入url到顯示頁面，都經歷了什么；
q：1、首先，在瀏覽器地址欄中輸入url 2、瀏覽器先查看瀏覽器快取-系統快取-路由器快取，如果快取中有，會直接在螢屏中顯示頁面內容。若沒有，則跳到第三步操作。 3、在發送http請求前，需要域名決議(DNS決議)，決議獲取相應的IP地址。 4、瀏覽器向服務器發起tcp連接，與瀏覽器建立tcp三次握手。（TCP即傳輸控制協議。TCP連接是互聯網連接協議集的一種。） 5、握手成功后，瀏覽器向服務器發送http請求，請求資料包。 6、服務器處理收到的請求，將資料回傳至瀏覽器 7、瀏覽器收到HTTP回應 8、讀取頁面內容，瀏覽器渲染，決議html原始碼 9、生成Dom樹、決議css樣式、js互動 10、客戶端和服務器互動 11、ajax查詢
15.對<meta></meta>標簽有什么理解，meta的作用
q：可用于瀏覽器（如何顯示內容或重新加載頁面），搜索引擎（關鍵詞），或其他 web 服務；meta里的資料是供機器解讀的，告訴機器該如何決議這個頁面，還有一個用途是可以添加服務器發送到瀏覽器的http頭部內容
16.怎么去設計一個組件封裝；
q：1)組件封裝的目的是為了重用，提高開發效率和代碼質量 2)低耦合，單一職責，可復用性，可維護性 3)前端組件化設計思路
17.執行緒，行程
q： 1)執行緒是最小的執行單元，行程是最小的資源管理單元 2)一個執行緒只能屬于一個行程，而一個行程可以有多個執行緒，但至少有一個執行緒
18.vue資料的雙向資料系結；
q：vue資料雙向系結是通過資料劫持結合發布者-訂閱者模式的方式來實作的，通過Object.defineProperty()來劫持各個屬性的setter，getter，在資料變動時發布訊息給訂閱者，觸發相應的監聽回呼。
19.get與post 通訊的區別；
q：1).Get 請求能快取，Post 不能； 2).Post 相對 Get 安全一點點，因為Get 請求都包含在 URL 里，且會被瀏覽器保存歷史紀錄，Post 不會，但是在抓包的情況下都是一樣的； 3).Post 可以通過 request body來傳輸比 Get 更多的資料，Get 沒有這個技術； 4).URL有長度限制，會影響 Get 請求，但是這個長度限制是瀏覽器規定的，不是 RFC 規定的； 5).Post 支持更多的編碼型別且不對資料型別限制；
20.頁面匯入樣式時，使用link和@import有什么區別；
q：（1）link屬于XHTML標簽，除了加載CSS外，還能用于定義RSS, 定義rel連接屬性等作用；而@import是CSS提供的，只能用于加載CSS; （2）頁面被加載的時，link會同時被加載，而@import參考的CSS會等到頁面被加載完再加載; （3）import是CSS2.1 提出的，只在IE5以上才能被識別，而link是XHTML標簽，無兼容問題。
21.this物件的理解；
q：this總是指向函式的直接呼叫者（而非間接呼叫者）； 如果有new關鍵字，this指向new出來的那個物件； 在事件中，this指向觸發這個事件的物件，特殊的是，IE中的attachEvent中的this總是指向全域物件Window。
22.eval是做什么的；
q：它的功能是把對應的字串決議成JS代碼并運行； 應該避免使用eval，不安全，非常耗性能（2次，一次決議成js陳述句，一次執行）。 由JSON字串轉換為JSON物件的時候可以用eval，var obj =eval('('+ str +')')。
23.--------------什么叫優雅降級和漸進增強-------------------
q：優雅降級：一開始就構建完整的功能，然后再針對低版本瀏覽器進行兼容。 漸進增強：針對低版本的瀏覽器進行構建頁面，保證最基本的功能，然后再針對高級瀏覽器進行效果、互動等改進和追加功能達到更好的體驗效果。
24.如果解決ajax無法后退的問題；
q：1).html5里引入了新的API，即：history.pushState,history.replaceState 2).可以通過pushState和replaceSate介面瀏覽器歷史，并且改變當前頁面的URL 3).onpopstate監聽后退
25.事件委托；
q：利用冒泡原理，把事件加到父級上，觸發執行效果 可以大量節省記憶體占用，減少事件注冊 可以方便地動態添加和修改元素，不需要因為元素的改動而修改事件系結
26.let和const的區別；
q：let宣告的變數可以改變，值和型別都可以改變，沒有限制； const宣告的變數不得改變值；
27.常見的ES6語法；
q：let，const，箭頭函數，字串模板，class類，模塊化，promise
28.介紹promise；
q：就是一個物件，用來傳遞異步操作的訊息。有三種狀態：pending(進行中)，resolved(已完成)和rejected(失敗) 有了promise物件，就可以將異步操作以同步操作的流程表示出來，避免了層層嵌套的回呼函式
29.vue父子組件通信；
q：父組件是通過props屬性給子組件通信，在子組件里面emit，在父組件監聽；
30.移動端兼容問題；
q：IOS移動端click時間300ms的延遲回應； 一些情況下對非可點擊元素如（label,span）監聽click時間，ios下不會觸發，css增加cursor:poiner就搞定了；
31.cookie和session有什么聯系和區別；
q：cookie資料存放在客戶的瀏覽器上，session資料放在服務器上 session比cookie更安全 單個cookie保存的資料不能超過4k，很多瀏覽器都限制一個站點最多保存20個cookie 一般用cookie來存盤sessionid
32.移動端性能優化；
q：1_ 盡量使用css3影片，開啟硬體加速 2_ 適當使用touch事件代替click事件 3_ 避免使用css3漸變陰影效果 4_ 可以用transform: translateZ(0) 來開啟硬體加速 5_ 不濫用float。float在渲染時計算量比較大，盡量減少使用 6_ 不濫用web字體。web字體需要下載，決議，重繪當前頁面 7_ 合理使用requestAnimationFrame影片代替setTimeout
33.Cookie的弊端；
q： cookie雖然在持久保存客戶端資料提供了方便，分擔了服務器存盤的負擔，但是有很多局限性； 第一：每個特定的域名下最多生成20個cookie 第二：IE和Opera 會清理近期最少使用的cookie，Firefox會隨機清理cookie
34.常見兼容性問題；
q：1_ png24位的圖片在ie6瀏覽器上出現背景，解決方案是做成png8，也可以參考一段腳本處理； 2_ 瀏覽器默認的margin和padding不同，解決方案是加一個全域的*{margin: 0;padding:0;}來統一； 3_ IE6雙邊距BUG：塊屬性標簽float后，又有橫行的margin情況下，在ie6顯示margin得比設定的大； 4_ IE5-8不支持opacity； 5_ IE6只支持a標簽的:hover偽類；（使用js為元素監聽mouseenter,mouseleave事件，添加類實作效果） 6_ ol內的序號全為1，不遞增；（為li設定樣式display: list-item）
uj5u.com熱心網友回復：
建議寫到 個人博客 ， 謝謝！
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/91943.html
標籤：非技術版
上一篇：mysql版本優劣問題