自己總結web前端面試題之javascript

1.js的幾種數據類型?

字符串、數字、布爾、對象、Null、Undefined

2.typeof下的類型都有什麼?

stringnumberbooleanfunctionobjectUndefined

3.js的常見內置對象類?

Date,Array,Math、Number、Boolean、String、Array、RegExp、Function...

4.創建一個對象

      function Person(name, age) {

        this.name = name;

        this.age = age;

        this.sing = function() { alert(this.name) }

      }

5.談談This對象的理解。

this是js的一個關鍵字,隨着函數使用場合不同,this的值會發生變化。

但是總有一個原則,那就是this指的是調用函數的那個對象。

this一般情況下是全局對象Global。 作爲方法調用,那麼this就是指這個對象

6.十六進制與RGB值轉化?

十六進制轉化成RGB

# A9 D3 5E

R:A9=9*16^0+10*16^1=169

G:D3=3*16^0+13*16^1=211

B:5E=14*16^0+5*16^1=94

rgb(169,211,94)

RGB轉化成十六進制

169/16=10餘9 A9

211/16=13餘3 D3

94/16=5餘14 5E

#A9D35E

7.null和undefined的區別?

    null和undefined都表示沒有內容,是空值,null是數值類型當中最小的,可以和其他數值進行轉化,它的類型屬於object,而undefined不可以進行轉化,一般用作語義提示,表示控制,屬於undefined類型

8.++和後++的區別?

++表示本身變量自行加1,前++是先自身加1,再執行其他運算;後++是先執行其他運算,後自身加1

9.while和do-while的區別

while是先判斷條件是否滿足,在執行循環語句;do-while是先執行語句,再判斷條件;條件不滿足情況下,do-while比while多走一次

10.結束語句的區別

break:結束所有循環,當多層循環時,可以指定跳出某層循環

    continue:結束當前循環

return 跳出函數體,如果函數裏有多層循環,會跳出所有循環,並且返回值給調用者

11.什麼是變量的作用域

全局變量:是定義在方法體外面,可以再任何表達式或函數裏使用,在頂層代碼中我們使用this關鍵字和window對象都可以訪問到它

局部變量:是定義在方法體裏,只能在當前函數裏使用,函數執行完畢時局部變量即刻銷燬

JS變量沒有塊級作用域,函數中的變量在整個函數都中有效

基本數據類型:定義簡單的數據字段

引用數據類型:可以定義多個值,或者包含屬性和方法

12.js的垃圾回收機制?

js具有自動回收垃圾的機制,不用程序員手動調用,而c或c++需要自己回收,js的垃圾回收機制有固定的時間間隔和週期。引用數據類型沒有固定大小,例如,定義數組時,當程序知道已知大小時,纔在內存中分配空間,如果初始沒給大小,則定義值時才分配空間。局部變量只在函數運行過程中存在,但是全局變量在頁面加載時就已經存在了,並且全局變量會在頁面關閉時纔回收。

手動回收,例如:var x=new Number();

x=null;//清空內存

13.函數聲明和匿名函數的區別?

 函數聲明:又叫做函數表達式,函數聲明要定義函數名稱,並且通過標籤裏的事件進行調用,函數聲明被調用時纔會存在,用過之後會在內存中清空

匿名函數:屬於閉包的一種,不用定義函數名稱,更體現了頁面的表現與結構相分離,匿名函數在頁面加載時就存在,在頁面關閉時進行清空。用匿名函數可以更好的封裝js

14.解釋一下閉包?

是指有權訪問另一個函數的作用域中的變量的函數

優點:在頁面加載時在內存中存在,調用速度快,並閉包的變量也會始終保存在內存中

缺點:造成內存消耗過大,頁面性能降低,需要手動清空才能釋放內存

閉包的表現形式:函數的嵌套,遞歸,匿名函數等。

15.new操作符具體幹了什麼呢?

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

  2、屬性和方法被加入到 this 引用的對象中。

  3、新創建的對象由 this 所引用,並且最後隱式的返回 this 。

16.如何判斷一個對象是否屬於某個類?

使用instanceof (待完善)

       if(a instanceof Person){

           alert('yes');

       }

17.模塊化怎麼做?

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

var module1 = (function(){

var _count = 0;

var m1 = function(){

//...

};

var m2 = function(){

//...

};

return {

m1 : m1,

m2 : m2

};

})();

18.繼承有幾種方法?

1、原型鏈繼承

function Cat(){

}

Cat.prototype = new Animal();

Cat.prototype.name = 'cat';

2、構造繼承

function Cat(name){

   Animal.call(this);

   this.name = name ;

}

3.組合繼承

function SuperType(name) {

this.name = name;

this.colors = ["red","blue","green"];

}

SuperType.prototype.sayName = function() {

  console.log(this.name); }

function SubType(name, age) {

SuperType.call(this,name);//繼承屬性

this.age = age;

}

4.原型式繼承

  function object(o) {

  function F(){}

  F.prototype = o;

return new F();

}

5.寄生式繼承

function createAnother(original) {

var clone = object(original);

clone.sayHi = function () { alert("hi"); };

return clone;

}

var person = {

name:"EvanChen";

};

var anotherPerson = createAnother(person);

anotherPerson.sayHi();

6.寄生組合式繼承

function inheritProperty(subType, superType) {

var prototype = object(superType.prototype);//創建對象

prototype.constructor = subType;//增強對象

subType.prototype = prototype;//指定對象

  }

19.什麼是原型鏈?

原型鏈:作爲繼承的主要方法,用一個引用類型的原型,調用原型裏的屬性和方法,實現子類繼承父類進行調用,每一個原型對象包含一個指向構造器的指針,通過指針孩子可以找到父類裏屬性和方法,那麼prototype就是這個指針,當指向父類,在內存中就構成了一個原型鏈。

20.怎麼提高節點操作性能?

文檔碎片相當於一個口袋,用來提高DOM的操作性能,使操作節點的速度更快。

var frag=document.createDocumentFragment();//創建口袋

 frag.appendChild(l);//往口袋放對象

 對象.appendChild(frag);//把口袋執行

21事件、IE與火狐的事件機制有什麼區別? 如何阻止冒泡?

 1. 我們在網頁中的某個操作(有的操作對應多個事件)。例如:當我們點擊一個按鈕就會產生一個事件。是可以被 JavaScript 偵測到的行爲。  

 2. 事件處理機制:IE是事件冒泡、火狐是事件捕獲;

 3.  第一種:event.stopPropagation();

     第二種:return false;

     第三種:event.preventDefault(); 

     第四種:event.cancelable=true; 只支持IE8以下瀏覽器

22.事件綁定用什麼?

1.addEventListenter("事件名稱",調用函數,true/false)

true表示捕獲事件false在冒泡階段調用(支持高版本)

2.attachEvent()綁定事件(IE8以下) IE低版本下只支持冒泡事件

23.js是單線程還是多線程

JS是單線程,同理js所有寫的框架也都是單線程。

js裏有異步函數和延遲函數,會在其他函數調用完成後執行,所以這兩種函數在隊列末尾處加載

24.js的運行機制

簡單來說js有2種機制,一個是事件機制,一個是io機制。

事件機制是通過網頁標籤所操作的事件流程,用來調用DOM和BOM對象的;io機制簡單來說是處理文件的,例如:上傳下載,讀寫文件,操作數據庫等

25.瀏覽器存儲都有哪些?

cookie :cookie值是存在用戶電腦裏,用來存儲文本框的值,窗體圖標等一些小圖片,存在電腦磁盤下,所以刷新頁面不會被清空,它所存在瀏覽器相應的文件夾裏,由你訪問的頁面設置信息的保存週期,但是在頁面上顯示cookie值需要在服務器上設置js,一個cookie值最多隻能存儲4kB,如果網絡連接不通,cookie也不會進行顯示

sessionStorage:存儲數據在頁面關閉之後,數據會被刪除,信息存儲在本地磁盤下

localStorage:沒有時間限制,除非手動刪除,一個本地存儲可多達5MB以上

26.告訴我答案是多少?

(function(x){

     delete x;

     alert(x);

})(1+5);

函數參數無法delete刪除,delete只能刪除通過for in訪問的屬性。

當然,刪除失敗也不會報錯,所以代碼運行會彈出“1”。

27.JS中的call()和apply()方法的區別?

call方法:

語法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]])

定義:調用一個對象的一個方法,以另一個對象替換當前對象。

說明: call 方法可以用來代替另一個對象調用一個方法。call 方法可將一個函數的對象上下文從初始的上下文改變爲由 thisObj 指定的新對象。 如果沒有提供 thisObj 參數,那麼 Global 對象被用作 thisObj。

apply方法: 

語法:apply([thisObj[,argArray]])

定義:應用某一對象的一個方法,用另一個對象替換當前對象。

說明: 如果 argArray 不是一個有效的數組或者不是 arguments 對象,那麼將導致一個 TypeError。 如果沒有提供 argArray 和 thisObj 任何一個參數,那麼 Global 對象將被用作 thisObj, 並且無法被傳遞任何參數。

28.JSON 的瞭解

JSON(JavaScript Object Notation) 是一種輕量級的數據交換格式。它是基於JavaScript的一個子集。數據格式簡單, 易於讀寫, 佔用帶寬小

{'age':'12', 'name':'back'}

29.如何解決跨域問題?

1.通過動態加載script標籤

2.通過動態生成iframe

document.domain + iframe

location.hash + iframe

window.name + iframe

3.postMessage html5 跨域技術

var ifr = document.getElementById('ifr');

var targetOrigin = 'http://b.com';  

ifr.contentWindow.postMessage('I was there!', targetOrigin);

4.CORS 自定義http頭

var xdr = new XDomainRequest();

  console.log(xdr.responseText);

5.JSONP 回調函數和json數據

script.src = 'http://www.baidu.com/json/?callback=handleResponse';

6. web sockets html5 web通信技術

var socket = new WebSockt('ws://www.baidu.com');

30.http狀態碼有那些?分別代表是什麼意思?

    100-199 用於指定客戶端應相應的某些動作。

    200-299 用於表示請求成功。

    300-399 用於已經移動的文件並且常被包含在定位頭信息中指定新的地址信息。

    400-499 用於指出客戶端的錯誤。400    1、語義有誤,當前請求無法被服務器理解。401   當前請求需要用戶驗證 403  服務器已經理解請求,但是拒絕執行它。

    500-599 用於支持服務器錯誤。 503 – 服務不可用

31.那些操作會造成內存泄漏?

內存泄漏指任何對象在您不再擁有或需要它之後仍然存在。

垃圾回收器定期掃描對象,並計算引用了每個對象的其他對象的數量。如果一個對象的引用數量爲 0(沒有其他對象引用過該對象),或對該對象的惟一引用是循環的,那麼該對象的內存即可回收。

setTimeout 的第一個參數使用字符串而非函數的話,會引發內存泄漏。

閉包、控制檯日誌、循環(在兩個對象彼此引用且彼此保留時,就會產生一個循環)

32.對Node的優點和缺點提出了自己的看法:

    *(優點)因爲Node是基於事件驅動和無阻塞的,所以非常適合處理併發請求,

    因此構建在Node上的代理服務器相比其他技術實現(如Ruby)的服務器表現要好得多。

    此外,與Node代理服務器交互的客戶端代碼是由javascript語言編寫的,

    因此客戶端和服務器端都用同一種語言編寫,這是非常美妙的事情。

    *(缺點)Node是一個相對新的開源項目,所以不太穩定,它總是一直在變,

    而且缺少足夠多的第三方庫支持。看起來,就像是Ruby/Rails當年的樣子。

33.異步加載的方式

  (1) defer,只支持IE

<script type="text/javascript" defer="defer">

alert(document.getElementById("p1").firstChild.nodeValue);

</script>

  (2) async

var scriptEle = document.createElement("script");

         scriptEle.async = true;

  (3) XHR Injection(XHR 注入):通過XMLHttpRequest來獲取javascript,然後創建一個script元素插入到DOM結構中。ajax請求成功後設置script.text爲請求成功後返回的responseText。

34.ajax的缺點

1、ajax不支持瀏覽器back按鈕。

2、安全問題 AJAX暴露了與服務器交互的細節。

3、對搜索引擎的支持比較弱。

4、破壞了程序的異常機制。

5、不容易調試。 

35.ajax 是什麼?ajax 的交互模型?同步和異步的區別?

1. 通過異步模式,提升了用戶體驗

2. 優化了瀏覽器和服務器之間的傳輸,減少不必要的數據往返,減少了帶寬佔用

3. Ajax在客戶端運行,承擔了一部分本來由服務器承擔的工作,減少了大用戶量下的服務器負載。

4.同步是一個進程正在運行,其他進程必須等待該進程執行完之後才執行,異步是線程並行加載互不影響。

36. Ajax的最大的特點是什麼。

Ajax可以實現動態不刷新(局部刷新)

readyState屬性 狀態 有5個可取值: 0=未初始化 ,1=正在加載 2=以加載,3=交互中,4=完成

37.css/js代碼上線之後開發人員經常會優化性能,從用戶刷新網頁開始,一次js請求一般情況下有哪些地方會有緩存處理?

瀏覽器緩存,dns緩存,cdn緩存,服務器緩存

38.http請求頭有哪些?

Accept:瀏覽器可接受的MIME類型。

Accept-Charset:瀏覽器可接受的字符集

Accept-Encoding:瀏覽器能夠進行解碼的數據編碼方式,比如gzipServlet能夠向支持gzip的瀏覽器返回經gzip編碼的HTML頁面。許多情形下這可以減少510倍的下載時間。

Accept-Language:瀏覽器所希望的語言種類,當服務器能夠提供一種以上的語言版本時要用到。

Authorization:授權信息,通常出現在對服務器發送的WWW-Authenticate頭的應答中。

Connection:表示是否需要持久連接。如果Servlet看到這裏的值爲“Keep-Alive”,或者看到請求使用的是HTTP 1.1HTTP 1.1默認進行持久連接),它就可以利用持久連接的優點,當頁面包含多個元素時(例如Applet,圖片),顯著地減少下載所需要的時間。要實現這一點,Servlet需要在應答中發送一個Content-Length頭,最簡單的實現方法是:先把內容寫入ByteArrayOutputStream,然後在正式寫出內容之前計算它的大小。

Content-Length:表示請求消息正文的長度。

Cookie:這是最重要的請求頭信息之一

From:請求發送者的email地址,由一些特殊的Web客戶程序使用,瀏覽器不會用到它。

Host:初始URL中的主機和端口。

If-Modified-Since:只有當所請求的內容在指定的日期之後又經過修改才返回它,否則返回304“Not Modified”應答。

Pragma:指定“no-cache”值表示服務器必須返回一個刷新後的文檔,即使它是代理服務器而且已經有了頁面的本地拷貝。

Referer:包含一個URL,用戶從該URL代表的頁面出發訪問當前請求的頁面。

User-Agent:瀏覽器類型,如果Servlet返回的內容與瀏覽器類型有關則該值非常有用。

UA-PixelsUA-ColorUA-OSUA-CPU:由某些版本的IE瀏覽器所發送的非標準的請求頭,表示屏幕大小、顏色深度、操作系統和CPU類型。

  

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章