題目和答案來自於網路，不保證準確性哦！

1，介紹js的基本資料型別，引用型別

    基本資料型別：1數值型別 Number    2.布林型別 Boolean 3.字元型別 String    4.未定義 Undefined    5.空型別 Null。這些型別在記憶體中佔有固定大小的空間，值儲存在棧空間。

    引用型別：1.陣列 Array  2.物件 Object   3.函式 Function。引用型別記憶體中佔有的空間不固定，但是記憶體地址大小是固定的，因此儲存的實際是資料的記憶體地址。

    typeof( )方法用來返回當前變數的型別

2，例舉幾種強制型別轉換和幾種隱式型別轉換?  

   強制：比如parseInt，parseFloat，Number()，Boolean()，String()

   隱式:①3 + true; // 4 ②1 + 2 + "3"; // "33" ③var x = NaN;x === NaN; // false

   上面只是簡單列舉了幾種情況，由於型別轉換內容較多，這裡就不詳細解釋了。

3，繫結事件和普通事件有什麼區別？ 

   事件繫結就是針對dom元素的事件，繫結在dom元素上；普通事件即為非針對dom元素的事件；普通事件只支援單個事件，而事件繫結可以新增多個事件，都執行。

   普通事件分兩種方式：

   ①直接在html標籤裡面新增“onclick”等事件，然後在js裡面撰寫事件的執行函式

   ②通過DOM方式獲取物件，然後為物件新增onclick事件

   繫結事件又分為標準W3C繫結事件和IE繫結事件： 

   ①標準W3C繫結，採用addEventListener()方式繫結

   ②IE繫結，採用attachEvent()方式繫結

4，ajax請求的時候get 和post方式的區別  

    1、get是把引數資料佇列加到提交表單的ACTION屬性所指的URL中，值和表單內各個欄位一一對應，在URL中可以看到；post是通過HTTP post機制，將表單內各個欄位與其內容放置在HTML HEADER內一起傳送到ACTION屬性所指的URL地址。使用者看不到這個過程；

    2、Get請求有如下特性：它會將資料新增到URL中，通過這種方式傳遞到伺服器，通常利用一個問號？代表URL地址的結尾與資料引數的開端，後面的引數每一個數據引數以“名稱=值”的形式出現，引數與引數之間利用一個

連線符&來區分。Post請求有如下特性：資料是放在HTTP主體中的，其組織方式不只一種，有&連線方式，也有分割符方式，可隱藏引數，傳遞大批資料，比較方便。

    3、get傳送的資料量較小，不能大於2KB；

    post傳送的資料量較大，一般被預設為不受限制。但理論上，因伺服器的不同而異.

    4、get安全性非常低，post安全性較高；

  （總結：

    一個在url後面 一個放在虛擬載體裡面

    有大小限制

    安全問題

    應用不同 一個是論壇等只需要請求的，一個是類似修改密碼的）

5，call和apply的區別  

    相同點:兩個方法產生的作用是完全一樣的

    不同點:方法傳遞的引數不同

    Object.call(this,obj1,obj2,obj3,...)第一個引數是函式執行時this的值，其後所有的引數都是需要被傳入函式的引數。

    Object.apply(this,arguments)第一個引數也是this的值,第二個引數是一個數組或偽陣列，內含函式需要被傳入的引數。

6，常用的繼承的方法   

 1，使用物件冒充方式

 2，call和apply方法方式（也可以算是物件冒充方式）

 3，原型鏈方式

 4，混合方式，混合了call方式、原型鏈方式

 原型prototype機制或apply和call方法去實現較簡單，建議使用混合方式。

7，JavaScript this指標、閉包、作用域？

    閉包就是能夠讀取其他函式內部變數的函式上下文物件(this指標)是指被呼叫函式所處的環境。其作用是在一個函式內部引用呼叫它的物件本身。

    this所指向的物件是函式呼叫時刻呼叫該函式的物件。this指標是靜態作用域的一個補充。

    作用域就是變數與函式的可訪問範圍，即作用域控制著變數與函式的可見性和生命週期。在JavaScript中，變數的作用域有全域性作用域和區域性作用域兩種。

8，事件委託是什麼？  

    也叫事件代理，JavaScript高階程式設計上講：事件委託就是利用事件冒泡，只指定一個事件處理程式，就可以管理某一型別的所有事件。比如給最外面的div加點選事件，那麼裡面的ul、li、a做點選事件的時候，都會冒泡到最外層的div上，所以都會觸發，這就是事件委託，委託它們父級代為執行事件。

好處：

    ①管理的函式變少了，不需要為每個元素都新增監聽函式，只需對父級物件進行操作，減少記憶體使用。

    ②可以方便地動態新增和修改元素，不需要因為元素的改動而修改事件繫結。

    ③JavaScript和DOM節點之間的關聯變少了，這樣也就減少了因迴圈引用而帶來的記憶體洩漏發生的概率。另外與dom的操作就只需要互動一次，這樣就能大大的減少與dom的互動次數，提高效能；

9，請描述下事件冒泡機制，如何阻止事件冒泡和預設事件 

    我們都知道冒泡就像水底氣泡浮到水面這一過程。冒泡事件即是事件從最底層逐個經過上面一級級事件的過程，就是冒泡事件。那麼如何有效的阻止冒泡事件的發生？其實在非IE瀏覽器中提供了一個事件物件stopPropagation，

那麼在IE瀏覽器中有沒有一個物件去阻止冒泡事件呢，答案是肯定的，通過cancelBubble事件物件可以阻止。

11，javascript的本地物件，內建物件和宿主物件  

ECMA-262把本地物件（native object）定義為“獨立於宿主環境的ECMAScript實現提供的物件”。本地物件就是ECMAScript中定義好的物件，如Object、Function、String、Array、Boolean、Number、Date、 RegExp等；

    內建物件是本地物件中比較特殊的一種，根據定義，所有內建物件都是本地物件；它不用例項化，ECMA只定義了兩個內建物件，即Global和Math；

    所有非本地物件都是宿主物件（host Object），即由ECMAScript實現的宿主環境提供的物件。宿主物件就是BOM、DOM和自己定義的物件，比如document、window等。

    總結：本地物件是ECMA官方定義好的物件；內建物件也是本地物件，只包括Global物件和Math物件；宿主物件包括BOM和DOM物件。

12，怎樣新增、移除、移動、複製、建立和查詢節點？

（1）建立新節點

 createDocumentFragment()    //建立一個DOM片段

 createElement()   //建立一個具體的元素

 createTextNode()   //建立一個文字節點

（2）新增、移除、替換、插入

 appendChild()

 removeChild()

 replaceChild()

 insertBefore() //在已有的子節點前插入一個新的子節點

（3）查詢

 getElementsByTagName()    //返回帶有指定標籤名的所以元素

 getElementsByName()    //返回帶有指定Name屬性的所以元素

getElementsByClassName()  //返回帶有指定類名的所有元素

 getElementById()    //返回帶有指定 ID 的元素

13，js面向物件的幾種方式。

 JavaScript中物件的建立有以下幾種方式：

（1）使用本地物件，通過JavaScript語言原生物件的構造方法，比如Array、Object等,例項化出一個新的物件。

（2）使用JSON符號，JavaScript預設將JSON當做一個物件處理。我們不但可以將一個JSON字串轉化為物件，也可以反過來將一個物件“編譯”為一個JSON字串，以方便JavaScript中的物件的傳輸。

（3）自定義物件構造，建立高階物件構造有兩種方式：使用“this”關鍵字構造、使用原型prototype構造。

14、IE和標準下有哪些相容性的寫法？

比如：

 Var ev = ev || window.event

 document.documentElement.clientWidth || document.body.clientWidth

 Var target = ev.srcElement||ev.target

15，jq幾種事件繫結方法，各有什麼不同？

    1，bind()是最直接的繫結方法 ，會繫結事件型別和處理函式到DOM element上, 這個方法是存在最久的，而且也很好的解決了瀏覽器在事件處理中的相容問題。但是這個方法有一些performance方面的問題

    2，live()方法用到了事件委託的概念來處理事件的繫結。它和用.bind()來繫結事件是一樣的。.live()方法會繫結相應的事件到你所選擇的元素的根元素上，即是document元素上。那麼所有通過冒泡上來的事件都可以用這個相同的handler來處理了

    3，delegate()有點像.live(),不同於.live()的地方在於，它不會把所有的event全部繫結到document,而是由你決定把它放在哪兒。而和.live()相同的地方在於都是用event delegation

    4，其實.bind() ,live(), delegate()都是通過on()來實現的，unbind(),die(),undelegate(),也是一樣的都是通過off()來實現的

   用bind()的代價是非常大的，它會把相同的一個事件處理程式hook到所有匹配的DOM元素上；

   不要再用live()了，它已經不再被推薦了，而且還有許多問題；

   delegate()會提供很好的方法來提高效率，同時我們可以新增一事件處理方法到動態新增的元素上；

   我們可以用on()來代替上述的3種方法。

16，==和===的區別

  "==" 只要求值相等; "===" 要求值和型別都相等

17，$(document).ready()和window.onload的區別

   1.執行時間不同。

     window.onload必須等到頁面內包括圖片的所有元素載入完畢後才能執行；

     $(document).ready()是DOM結構繪製完畢後就執行，不必等到載入完畢。

   2.編寫個數不同。

     window.onload不能同時編寫多個，如果有多個window.onload方法，只會執行一個；

     $(document).ready()可以同時編寫多個，並且都可以得到執行。

   3.簡化寫法。

     window.onload沒有簡化寫法；

     $(document).ready(function(){})可以簡寫成$(function(){})。

18，eval是做什麼的？

    eval()，這個函式可以把一個字串當作一個JavaScript表示式一樣去執行它。在實際中，eval（）很少被用到，eval()是一個危險的函式，程式碼可能被惡意方（不懷好意的人）影響,通過在使用方的機器上使用惡意程式碼，可能讓你失去在網頁或者擴充套件程式上的許可權。常規用例的安全會被eval()改變。

19，怎麼實現一個輪播。

 1，利用CSS3動畫(animation)；

 2，利用myfous；

 3，利用jquery輪播效果；

 4，通過CSS3過渡(transition)；

 具體過程就不詳細介紹了。

20，你有哪些效能優化的方法？

（1）減少http請求次數：CSS Sprites, JS、CSS原始碼壓縮、圖片大小控制合適；網頁Gzip，CDN託管，data快取 ，圖片伺服器。

（2）前端模板JS+資料，減少由於HTML標籤導致的頻寬浪費，前端用變數儲存AJAX請求結果，每次操作本地變數，不用請求，減少請求次數

（3） 用innerHTML代替DOM操作，減少DOM操作次數，優化javascript效能。

（4） 當需要設定的樣式很多時設定className而不是直接操作style。

（5） 少用全域性變數、快取DOM節點查詢的結果。減少IO讀取操作。

（6） 避免使用CSS Expression（css表示式)又稱Dynamic properties(動態屬性)。

（7） 圖片預載入，將樣式表放在頂部，將指令碼放在底部  加上時間戳。

21，JavaScript原型，原型鏈?有什麼特點？

    每個物件都會在其內部初始化一個屬性，就是prototype(原型)，當我們訪問一個物件的屬性時，如果這個物件內部不存在這個屬性，那麼他就會去prototype裡找這個屬性，這個prototype又會有自己的prototype，於是就這樣一直找下去，也就是我們平時所說的原型鏈的概念。

    關係：instance.constructor.prototype = instance.__proto__

    特點：

    JavaScript物件是通過引用來傳遞的，我們建立的每個新物件實體中並沒有一份屬於自己的原型副本。當我們修改原型時，與之相關的物件也會繼承這一改變。

22，怎麼提升網站效能，

（1）合併壓縮JS/CSS     （2）使用CSS sprites （3）避免使用CSS表示式  （4）精簡HTML CSS JS程式碼大小

（5）避免JS的複雜計算和DOM操作，減少頁面的重繪重排（6）JS儘量放到頁面底部  （7）合併AJAX請求

（8）TAB頁非同步或延遲載入  （9）非關鍵圖片儘量延遲載入，如頭像  （10）壓縮圖片質量

（11）設定較長的客戶端快取過期時間 （12）設定GZIP壓縮（13）cookie隔離 （14）適當使用多域名增加並行載入

（15）重點優化首屏，減少使用者等待時間  （16）避免重定向 （17）條件允許時使用CDN加速

23,請給出非同步載入js方案，不少於兩種。

 1.defer（只支援IE）

 2.async規定一旦指令碼可用，則會非同步執行，只適用於外部指令碼

 3.建立script，插入到DOM中，載入完畢後callBack

24，請寫出繫結事件的方法，不少於兩種

 Javascript事件繫結的幾種方式：

 1、直接在元素上繫結回撥函式 <button id="btn" onclick="clickBtn()">clickme</button>

 2、JS獲取DOM元素物件後，對onclick屬性賦值，繫結事件：

      document.getElementById('btn').onclick=clickBtn;

 3、JS獲取DOM物件後，呼叫物件的addEventListener函式繫結事件：

      document.getElementById('btn').addEventListener('click',clickBtn);

25,請解釋 CSS 動畫和 JavaScript 動畫的優缺點。

 CSS3的動畫

 優點：

 1.在效能上會稍微好一些，瀏覽器會對CSS3的動畫做一些優化（比如專門新建一個圖層用來跑動畫）

 2.程式碼相對簡單

 缺點：

 1.在動畫控制上不夠靈活

 2.相容性不好

 3.部分動畫功能無法實現（如滾動動畫，視差滾動等）

 JavaScript的動畫

 優點：

 1.控制能力很強，可以單幀的控制、變換

 2.相容性好，寫得好完全可以相容IE6，且功能強大。

 缺點：

 計算沒有css快，另外經常需要依賴其他的庫。

 結論：

 所以，不復雜的動畫完全可以用css實現，複雜一些的，或者需要互動的時候，用js會靠譜一些~

26,當一個DOM節點被點選時候，我們希望能夠執行一個函式，應該怎麼做？

①直接在DOM裡繫結事件：<E onclick=”test()”></E>；

 ②在JS裡通過onclick繫結：xxx.onclick = test；

 ③通過事件新增進行繫結：xxx.addEventListener('click',test, false);

                         IE：xxx.attachEvent('onclick', test);

27,Javascript的事件流模型都有什麼？

(1).冒泡型事件：指事件按照從最精確的物件到最不精確的物件的順序逐一觸發 

(2).捕獲型事件：它與冒泡型事件相反，指事件按照從最不精確到最精確的物件的順序逐一觸發

28,什麼是Ajax和JSON，它們的優缺點。

 Ajax是非同步JavaScript和XML，用於在Web頁面中實現非同步資料互動。

 優點：

　 可以使得頁面不過載全部內容的情況下載入區域性內容，降低資料傳輸量

　 避免使用者不斷重新整理或者跳轉頁面，提高使用者體驗

 缺點：

　 對搜尋引擎不友好（

　 要實現ajax下的前後退功能成本較大

　 可能造成請求數的增加

　 跨域問題限制

 JSON是一種輕量級的資料交換格式，ECMA的一個子集

 優點：輕量級、易於人的閱讀和編寫，便於機器（JavaScript）解析，支援複合資料型別（陣列、物件、字串、數字）

 缺點：

   沒有XML格式這麼推廣的深入人心和喜用廣泛，沒有XML那麼通用性；

   JSON格式目前在Web Service中推廣還屬於初級階段。

29,一次完整的HTTP事務是怎樣一個過程？HTTP狀態碼

 1xx表示請求已被接受，但需要後續處理。如：100，客戶端應繼續傳送請求。

 2xx請求已成功被伺服器接收、理解、並接受。如：200，請求已成功

 3xx這類狀態碼代表需要客戶端採取進一步的操作才能完成請求。如：301，被請求的資源已永久移動到新位置，

 4xx這類的狀態碼代表了客戶端看起來可能發生了錯誤，妨礙了伺服器的處理。 如：404，由於包含語法錯誤，當前請求無法被伺服器理解。400通常在伺服器端表單驗證失敗時返回。

 5xx這類狀態碼代表了伺服器在處理請求的過程中有錯誤或者異常狀態發生，也有可能是伺服器意識到以當前的軟硬體資源無法完成對請求的處理。並且響應訊息體中應當給出理由，除非是HEAD請求。

如：500，通常是程式碼出錯，後臺Bug。

30、 this物件的理解

 ①this總是指向函式的直接呼叫者（而非間接呼叫者）；

 ②如果有new關鍵字，this指向new出來的那個物件；

 ③在事件中，this指向觸發這個事件的物件，特殊的是，IE中的attachEvent中的this總是指向全域性物件Window。

31、null和undefined的區別？

 null是一個表示"無"的物件，轉為數值時為0；undefined是一個表示"無"的原始值，轉為數值時為NaN。

 undefined：

（1）變數被聲明瞭，但沒有賦值時，就等於undefined。

（2) 呼叫函式時，應該提供的引數沒有提供，該引數等於undefined。

（3）物件沒有賦值的屬性，該屬性的值為undefined。

（4）函式沒有返回值時，預設返回undefined。

 null：

（1） 作為函式的引數，表示該函式的引數不是物件。

（2） 作為物件原型鏈的終點。

32、new操作符具體幹了什麼呢?

（1）建立一個空物件，並且 this 變數引用該物件，同時還繼承了該函式的原型。

（2）屬性和方法被加入到 this 引用的物件中。

（3）新建立的物件由 this 所引用，並且最後隱式的返回 this 。

33、哪些常見操作會造成記憶體洩漏？

    記憶體洩漏指任何物件在您不再擁有或需要它之後仍然存在。

    垃圾回收器定期掃描物件，並計算引用了每個物件的其他物件的數量。如果一個物件的引用數量為 0（沒有其他物件引用過該物件），或對該物件的惟一引用是迴圈的，那麼該物件的記憶體即可回收。

    setTimeout 的第一個引數使用字串而非函式的話，會引發記憶體洩漏。

    閉包、控制檯日誌、迴圈（在兩個物件彼此引用且彼此保留時，就會產生一個迴圈）

34、split() join() 的區別

 split()方法：用於把一個字串分割成字串陣列. 

 join() 方法用於把陣列中的所有元素放入一個字串。

 （總結：前者是切割成陣列的形式，後者是將陣列轉換成字串）；

35、陣列方法pop() push() unshift() shift()

 push()尾部新增； pop()尾部刪除；

 unshift()頭部新增； shift()頭部刪除；

36、javascript的記憶體管理應注意什麼？

 ①避免不必要的定義全域性變數

 ②及時解除不在使用的變數引用，將其賦值為null

 ③合理的使用函式，函式中的區域性變數執行結束後就會自動釋放記憶體

 ④合理使用回撥函式、閉包等

37、JS物件與JSON格式的互相轉換

     eval( ) 函式（使用的是 JavaScript 編譯器）可編譯並執行任何 JavaScript 程式碼，但這隱藏了一個潛在的安全問題。使用 JSON 解析器將 JSON 轉換為 JavaScript 物件是更安全的做法。JSON 解析器只能識別 JSON 文字，而不會編譯指令碼。在瀏覽器中，這提供了原生的 JSON 支援，而且 JSON 解析器的速度更快。

     ①JSON的解析（json資料轉換成JS物件）：

      var myObject=JSON.parse(myJSONtext)；

    JSON的序列化（JS物件轉換成JSON資料）：

     ②var myJSONtext=JSON.stringify(myObject)；

39、為什麼減少DOM操作是效能優化的主要思想之一？

在JavaScript中，新增到頁面上的事件處理程式數量將直接關係到頁面的整體執行效能，因為需要不斷的與dom節點進行互動，訪問dom的次數越多，引起瀏覽器重繪與重排的次數也就越多，就會延長整個頁面的互動就緒時間

40、在css/js程式碼上線之後開發人員經常會優化效能，從使用者重新整理網頁開始，一次js請求一般情況下有哪些地方會有快取處理？ 

答案：dns快取，cdn快取，瀏覽器快取，伺服器快取

41、javascript的同源策略 

    一段指令碼只能讀取來自於同一來源的視窗和文件的屬性，這裡的同一來源指的是主機名、議和埠號的組合 

42、列舉瀏覽器物件模型BOM裡常用的至少4個物件，並列舉window物件的常用方法至少5個 

    物件：Window document location screen history navigator 

    方法：Alert() confirm() prompt() open() close() 

43、documen.write和 innerHTML 的區別？ 

    document.write 只能重繪整個頁面；innerHTML 可以重繪頁面的一部分

44、在Javascript中什麼是偽陣列？如何將偽陣列轉化為標準陣列？ 

    偽陣列（類陣列）：無法直接呼叫陣列方法或期望length屬性有什麼特殊的行為，但仍可以對真正陣列遍歷方法來遍歷它們。典型的是函式的argument引數，還有像呼叫getElementsByTagName,document.childNodes之類的,它們都返回NodeList物件都屬於偽陣列。可以使用Array.prototype.slice.call(fakeArray)將陣列轉化為真正的Array物件。

45、Javascript中，有一個函式，執行時物件查詢時，永遠不會去查詢原型，這個函式是？ 

    hasOwnProperty