[前端求職必看]前端開發面試題與答案精選_JavaScript

Question

JavaScript

JavaScript原型，原型鏈 ? 有什麼特色？

eval是做什麼的？

它的功能是把對應的字串解析成JS程式碼並執行；
應該避免使用eval，不安全，非常耗效能（2次，一次解析成js語句，一次執行）。

null，undefined 的差別？

寫一個通用的事件偵聽器函數。

   // event(事件)工具集，來源：github.com/markyun
   markyun.Event = {
       // 頁面載入完成後
   1  ready (fn==null) {
               fn=document;
           }
       # .onload != 'function') {
               window.onload = fn;
           } else {
               window.onload = function() {
            fn();
           fn();
               };
           }
) #        // 視能力分別使用dom0||dom2||IE方式來綁定事件
       // 參數： 操作的元素,事件名稱,事件處理程序
       addEvent : function(element)
       addEvent : function(element)
  , c
           if (element.addEventListener) {
               //事件類型、需要執行的函數、是否捕捉下 p.         } else if (element.attachEvent) {
               element.attachEvent('on' type, function() {
                 # handler.call(element))              } else {
               element['on' type] = handler;
           }
       },
       //移除事件
     .removeEnentListener) {
               element.removeEnentListener( type, handler, false);
           } else if (element.datachEvent) {
               element.dachleas('on') type, coo                 element['on' type] = null;
           }
},
       // 阻止事件(主要為事件冒泡，因為IE不支援事件擷取)
       stopPropagation : function(ev) {
    問題   觸 ev.stopPropagation( );
           } else {
               ev.cancelBubble = true;
    1  事件的預設行為
       preventDefault : function(event) {
           if 。     }
       },
       // 取得事件目標
getTarget : function(event) {
           return event.target || event.srcElement;
       },
       ///使用##        getEvent : function(e) {
           var ev = e || window.event;
       ;
               while (c) {
                   ev = c.arguments[0];
                        break;
                   }
               
           }
             }
           return ev;
       時
# 的適用場景下使用場景？

高並發、聊天、即時訊息推送


介紹js的基本資料類型。

number,string,boolean,object,undefined


Javascript如何實作繼承？

透過原型與建構器

["1", "2", "3"].map(parseInt) 答案是多少？

[1, NaN, NaN] 因為 parseInt 需要兩個參數 (val, radix) 但 map 傳了 3 個 (element, index, array)

#

如何建立一個物件?（畫出此物件的記憶體圖）

 function Person(name, age) {
   this.name = name;
   this.age = age;
   this.sing = function() { alert(this.name) }
 }

談談This物件的理解。

this是js的一個關鍵字，隨著函數使用場合不同，this的值會改變。

但是有一個總原則，那就是this指的是呼叫函數的那個物件。

this一般情況下：是全域物件Global。作為方法調用，那麼this就是指這個物件

事件是？ IE與火狐的事件機制有什麼不同？如何阻止冒泡？

1. 我們在網頁中的某個操作（有的操作對應多個事件）。例如：當我們點擊一個按鈕就會產生一個事件。是可以被 JavaScript 偵測到的行為。
2. 事件處理機制：IE是事件冒泡、火狐是事件捕獲；
3. ev.stopPropagation();

什麼是閉包（closure），為什麼要用它？

執行say667()後,say667()閉包內部變數會存在,而閉包內部函數的內部變數不會存在.使得Javascript的垃圾回收機制GC不會收回say667()所佔用的資源，因為say667()的內部函數的執行需要依賴say667()中的變數。這是對閉包作用的非常直白的描述.

 function say667() {
   // Local variable that ends up within closure
   var saynum = 666;##   ==##  function() { alert(num); }
   num ;
   return sayAlert;
}

var sayAlert = say667();
sayAlert()//執行結果應該要彈出的667  

"use strict";是什麼意思? 使用它的好處和壞處分別是什麼？

如何判斷一個物件是否屬於某個類別？

 使用instanceof （待完善）

  if(a instanceof Person){
      alert('yes');
  }

new作業符具體做了什麼?

    1、創建一個空對象，並且this 變數引用該對象，同時也繼承了該函數的原型。

    2、屬性和方法加入 this 引用的物件。
    3、新建立的物件由 this 所引用，並且最後隱式的回傳 this 。

var obj  = {};
obj.__proto__ = Base.prototype;
Base.call(obj);

Javascript中，有一個函數，執行時物件尋找時，永遠不會去找原型，這個函數是？

hasOwnProperty

JSON 的了解？

JSON(JavaScript Object Notation) 是一種輕量級的資料交換格式。

它是基於JavaScript的子集。資料格式簡單, 易於讀寫, 佔用頻寬小
{'age':'12', 'name':'back'}

js延遲載入的方式有哪些？

defer和async、動態創建DOM方式（用得最多）、按需異步載入js

#ajax 是什麼?

##同步和異步的區別?

如何解決跨域問題?

jsonp、iframe、window.name、window.postMessage、伺服器上設定代理頁面

模組化怎麼做？

立即執行函數，不暴露私有成員

   var module1 = (function(){

   　　　　var _count = 0;
  　　　　var〠.　/ /...
   　　　　};
   　　　　var m2 = function(){
   　　　　〠　　〠  　　　　　return {
   　　　　　　m1 : m1,
   　　　　　　m2 : m2
   　　　　};
   　　})();



AMD（Modules/Asynchronous-Definition）、CMD（Common Module Definition）規範差異？

非同步載入的方式有哪些？

 (1) defer，只支援IE

 (2) async：

 (3) 建立script，插入DOM中，載入完畢後callBack


#documen.write和innerHTML的差異

document.write只能重繪整個頁面

innerHTML可以重繪頁面的一部分

#.call()和.apply() 的差別？

 範例中用add 來取代sub，add.call(sub,3,1) == add(3,1) ，所以運行結果為：alert(4);

 注意：js 中的函數其實是對象，函數名稱是對Function 物件的參考。

   function add(a,b)
   {
       alert(a b);
   }

  (a-b);
   }

   add.call(sub,3,1);  



Jquery與jQuery UI 有啥區別？

*jQuery是js庫，主要提供的功能是選擇器，屬性修改和事件綁定等等。

*jQuery UI則是在jQuery的基礎上，利用jQuery的擴充性，設計的外掛。

提供了一些常用的介面元素，像是對話方塊、拖曳行為、改變大小行為等等

JQuery的原始碼看過嗎？能不能簡單說一下它的實作原理？

jquery 中如何將陣列轉換為json字串，然後再轉換回來？

jQuery中沒有提供這個功能，所以你需要先寫兩個jQuery的擴充：

   $.fn.stringifyArray = function(array) {

       return JSON.stringify(array )

   }

   $.fn.parseArray = function(array) {

       return JSON.parse(array)

  }


##> # 然後呼叫： "").stringifyArray(array)


針對jQuery 的最佳化方法？

*基於Class的選擇性的效能相對於Id選擇器開銷很大，因為需遍歷所有DOM元素。

*頻繁操作的DOM，先快取起來再操作。用Jquery的鍊式呼叫更好。
例如：var str=$("a").attr("href");

*for (var i = size; i < arr.length; i ) {}
for 迴圈每一次迴圈都找了陣列(arr) 的.length 屬性，在開始迴圈的時候設定一個變數來儲存這個數字，可以讓迴圈跑得更快：
for (var i = size, length = arr.length; i < length; i ) {}

JavaScript中的作用域與變數宣告提升？

如何寫高效能的Javascript？

那些操作會造成記憶體洩漏？

記憶體洩漏是指任何物件在您不再擁有或需要它之後仍然存在。
垃圾回收器定期掃描對象，並計算引用了每個對象的其他對象的數量。如果一個物件的參考數量為 0（沒有其他物件引用過該物件），或對該物件的惟一引用是循環的，那麼該物件的記憶體即可回收。

setTimeout 的第一個參數使用字串而非函數的話，會引發記憶體洩漏。
閉包、控制台日誌、循環（在兩個物件彼此引用且彼此保留時，就會產生一個循環）

#JQuery一個物件可以同時綁定多個事件，這是如何實現的？