前端面試知識點錦集 JavaScript

 

 

 

哪些地方會出現css阻塞，哪些地方會出現js阻塞?

　　js的阻塞特性：

　　全部瀏覽器在下載JS的時候，會阻止一切其餘活動，好比其餘資源的下載，內容的呈現等等。直到JS下載、解析、執行完畢後纔開始繼續並行下載其餘資源並呈現內容。爲了提升用戶體驗，新一代瀏覽器都支持並行下載JS，可是JS下載仍然會阻塞其它資源的下載(例如.圖片，css文件等)。

　　因爲瀏覽器爲了防止出現JS修改DOM樹，須要從新構建DOM樹的狀況，因此就會阻塞其餘的下載和呈現。

　　嵌入JS會阻塞全部內容的呈現，而外部JS只會阻塞其後內容的顯示，2種方式都會阻塞其後資源的下載。也就是說外部樣式不會阻塞外部腳本的加載，但會阻塞外部腳本的執行。

　　CSS怎麼會阻塞加載?

　　CSS原本是能夠並行下載的，在什麼狀況下會出現阻塞加載了(在測試觀察中，IE6下CSS都是阻塞加載)

　　當CSS後面跟着嵌入的JS的時候，該CSS就會出現阻塞後面資源下載的狀況。而當把嵌入JS放到CSS前面，就不會出現阻塞的狀況了。

　　根本緣由：由於瀏覽器會維持html中css和js的順序，樣式表必須在嵌入的JS執行前先加載、解析完。而嵌入的JS會阻塞後面的資源加載，因此就會出現上面CSS阻塞下載的狀況。

　　JS應該放在什麼位置?

　　(1)、放在底部，雖然放在底部照樣會阻塞全部呈現，但不會阻塞資源下載。

　　(2)、若是嵌入JS放在head中，請把嵌入JS放在CSS頭部。

　　(3)、使用defer(只支持IE)

　　(4)、不要在嵌入的JS中調用運行時間較長的函數，若是必定要用，能夠用setTimeout來調用

　　Javascript無阻塞加載具體方式

　　將腳本放在底部。\仍是放在head中，用以保證在js加載前，能加載出正常顯示的頁面。\

　　此技術的重點在於：不管在何處啓動下載，文件額下載和運行都不會阻塞其餘頁面處理過程。即便在head裏(除了用於下載文件的http連接)。

　　1九、對比Flash與ajax哪一個好?

　　Ajax的優點：

　　(1)、可搜索性

　　普通的文本網頁會更有利於SEO。文本內容是搜索引擎容易檢索的，而繁瑣的swf字節碼倒是搜索引擎不肯觸及的。雖然Google等一些大型的搜索引擎能夠檢索SWF內部的內容，可是仍然有不少麻煩存在。

　　(2)、開放性

　　Flash常年以來被Macromedia看的很死。包括Flex、FMS等輔佐技術一直都須要昂貴的安裝、維護費用。而JS則沒有這樣的麻煩。沒有人願意承擔法律和版權的風險。

　　費用

　　Flash開發是很昂貴的，由於FlashIDE等環境都是要收費的.而Ajax則不一樣.雖然有一些便宜的生成swf的工具，可是他們的工能實在沒法知足複雜需求。

　　(3)、易用性

　　Ajax程序有更好的易用性。因爲中間有一層Flashplayer代理層，所以許多輔助功能沒法被Flash靈活利用。並且Flash在一些方面有着很差的口碑。好比彈出廣告、好比惡意代碼。

　　(http://awflasher.com我的認爲這八成是亂上xx網站形成的)

　　(4)、易於開發

　　人們開發複雜的Ajax和Flash應用程序時，都會藉助一些高級的開發工具。廣泛來講，Ajax的開發包比Flash簡便、容易。

　　Flash的優點：

　　(1)、多媒體處理

　　Flash在音頻、視頻等多媒體領域相比HTML有絕對的優點。如今幾乎全部的網站都包含有Flash內容。

　　(2)、兼容性

　　兼容性好：因爲經過了惟一的FlashPlayer「代理」。人們沒必要像調試JS那樣，在不一樣的瀏覽器中調試程序。

　　(3)、矢量圖型

　　這是Flash最大的優點，一樣處在這一領域的SVG、Canvas element以及Direct徹底不能與Flash相比。

　　(4)、客戶端資源調度

　　Flash可以更容易的調用瀏覽器之外的外部資源。好比攝像頭、麥克風等。然而這是普通的HTML沒法完成的。可是這也許是一個缺點(爲何呢?)



　　Ajax的劣勢：

　　(1)、它可能破壞瀏覽器的後退功能

　　(2)、使用動態頁面更新使得用戶難於將某個特定的狀態保存到收藏夾中 ，不過這些都有相關方法解決。

　　Flash的劣勢：

　　(1)、二進制格式

　　(2)、格式私有

　　(3)、flash 文件常常會很大，用戶第一次使用的時候須要忍耐較長的等待時間

　　(4)/性能問題

　　ajax與flash各有利弊，到底哪一個好，這取決於你的需求

　　20、請你解釋一下事件冒泡機制

　　a、在一個對象上觸發某類事件(好比單擊onclick事件)，若是此對象定義了此事件的處理程序，那麼此事件就會調用這個處理程序，若是沒有定義此事件處理程序或者事件返回true，那麼這個事件會向這個對象的父級對象傳播，從裏到外，直至它被處理(父級對象全部同類事件都將被激活)，或者它到達了對象層次的最頂層，即document對象(有些瀏覽器是window)。

　　b、冒泡型事件：事件按照從最特定的事件目標到最不特定的事件目標(document對象)的順序觸發

　　c、js冒泡機制是指若是某元素定義了事件A，如click事件，若是觸發了事件以後，沒有阻止冒泡事件，那麼事件將向父級元素傳播，觸發父類的click函數。

　　//阻止冒泡時間方法，兼容ie(e.cancleBubble)和ff(e.stopProgation)function stopBubble(e){var evt =e||window.event;evt.stopPropagation?evt.stopPropagation():(evt.cancelBubble=true);//阻止冒泡evt.preventDefault

　　2一、請你說說split()與join() 函數的區別?

　　前者是切割成數組的形式，後者是將數組轉換成字符串Join 函數獲取一批字符串，而後用分隔符字符串將它們聯接起來，從而返回一個字符串。Split 函數獲取一個字符串，而後在分隔符處將其斷開，從而返回一批字符串。可是，這兩個函數之間的主要區別在於 Join 可使用任何分隔符字符串將多個字符串鏈接起來，而 Split 只能使用一個字符分隔符將字符串斷開。 簡單地說，若是你用split，是把一串字符(根據某個分隔符)分紅若干個元素存放在一個數組裏。而Join是把數組中的字符串連成一個長串，能夠大致上認爲是split的逆操做。

　　2二、說說你對Promise的理解?

　　ES6 原生提供了 Promise 對象。

　　所謂 Promise，就是一個對象，用來傳遞異步操做的消息。它表明了某個將來纔會知道結果的事件(一般是一個異步操做)，而且這個事件提供統一的 API，可供進一步處理。Promise 對象有如下兩個特色。

　　(1)、對象的狀態不受外界影響。Promise 對象表明一個異步操做，有三種狀態：Pending(進行中)、Resolved(已完成，又稱Fulfilled)和 Rejected(已失敗)。只有異步操做的結果，能夠決定當前是哪種狀態，任何其餘操做都沒法改變這個狀態。這也是 Promise這個名字的由來，它的英語意思就是「承諾」，表示其餘手段沒法改變。

　　(2)、一旦狀態改變，就不會再變，任什麼時候候均可以獲得這個結果。Promise 對象的狀態改變，只有兩種可能：從 Pending 變爲Resolved 和從 Pending 變爲 Rejected。只要這兩種狀況發生，狀態就凝固了，不會再變了，會一直保持這個結果。就算改變已經發生了，你再對 Promise 對象添加回調函數，也會當即獲得這個結果。這與事件(Event)徹底不一樣，事件的特色是，若是你錯過了它，再去監聽，是得不到結果的。

　　有了 Promise 對象，就能夠將異步操做以同步操做的流程表達出來，避免了層層嵌套的回調函數。此外，Promise 對象提供統一的接口，使得控制異步操做更加容易。

　　Promise 也有一些缺點。首先，沒法取消 Promise，一旦新建它就會當即執行，沒法中途取消。其次，若是不設置回調函數，Promise 內部拋出的錯誤，不會反應到外部。第三，當處於 Pending 狀態時，沒法得知目前進展到哪個階段(剛剛開始仍是即將完成)。

　　2三、談談你對Javascript垃圾回收機制的理解?

　　(1)、標記清除(mark and sweep)

　　這是JavaScript最多見的垃圾回收方式，當變量進入執行環境的時候，好比函數中聲明一個變量，垃圾回收器將其標記爲「進入環境」，當變量離開環境的時候(函數執行結束)將其標記爲「離開環境」。

　　垃圾回收器會在運行的時候給存儲在內存中的全部變量加上標記，而後去掉環境中的變量以及被環境中變量所引用的變量(閉包)，在這些完成以後仍存在標記的就是要刪除的變量了

　　(2)、引用計數(reference counting)

　　在低版本IE中常常會出現內存泄露，不少時候就是由於其採用引用計數方式進行垃圾回收。引用計數的策略是跟蹤記錄每一個值被使用的次數，當聲明瞭一個 變量並將一個引用類型賦值給該變量的時候這個值的引用次數就加1，若是該變量的值變成了另一個，則這個值得引用次數減1，當這個值的引用次數變爲0的時 候，說明沒有變量在使用，這個值無法被訪問了，所以能夠將其佔用的空間回收，這樣垃圾回收器會在運行的時候清理掉引用次數爲0的值佔用的空間。

　　在IE中雖然JavaScript對象經過標記清除的方式進行垃圾回收，但BOM與DOM對象倒是經過引用計數回收垃圾的，也就是說只要涉及BOM及DOM就會出現循環引用問題。

　　2四、說說你對原型(prototype)理解?

　　JavaScript是一種經過原型實現繼承的語言與別的高級語言是有區別的，像java，C#是經過類型決定繼承關係的，JavaScript是的動態的弱類型語言，總之能夠認爲JavaScript中全部都是對象，在JavaScript中，原型也是一個對象，經過原型能夠實現對象的屬性繼承，JavaScript的對象中都包含了一個」 prototype」內部屬性，這個屬性所對應的就是該對象的原型。

　　「prototype」做爲對象的內部屬性，是不能被直接訪問的。因此爲了方便查看一個對象的原型，Firefox和Chrome內核的JavaScript引擎中提供了」proto「這個非標準的訪問器(ECMA新標準中引入了標準對象原型訪問器」Object.getPrototype(object)」)。

　　原型的主要做用就是爲了實現繼承與擴展對象。

　　2五、typeof與instanceof的區別是什麼?

　　在 JavaScript 中，判斷一個變量的類型能夠用typeof

　　(1)、數字類型， typeof 返回的值是 number。好比說：typeof(1)，返回值是number

　　(2)、字符串類型， typeof 返回的值是 string。好比typeof(「123」)返回值是string。

　　(3)、布爾類型， typeof 返回的值是 boolean 。好比typeof(true)返回值是boolean。

　　(4)、對象、數組、null 返回的值是 object 。好比typeof(window)，typeof(document)，typeof(null)返回的值都是object。

　　(5)、函數類型，返回的值是 function。好比：typeof(eval)，typeof(Date)返回的值都是function。

　　(6)、不存在的變量、函數或者undefined，將返回undefined。好比：typeof(abc)、typeof(undefined)都返回undefined。

　　在 JavaScript 中,instanceof用於判斷某個對象是否被另外一個函數構造。

　　使用 typeof 運算符時採用引用類型存儲值會出現一個問題，不管引用的是什麼類型的對象，它都返回 「object」。ECMAScript 引入了另外一個 Java 運算符 instanceof 來解決這個問題。instanceof 運算符與 typeof 運算符類似，用於識別正在處理的對象的類型。與typeof 方法不一樣的是，instanceof 方法要求開發者明確地確認對象爲某特定類型。

　　2六、說說你對node.js的理解

　　a、Node.js 是一個基於Google Chrome V8 引擎的 JavaScript 運行環境。Node.js 使用了一個事件驅動、非阻塞式 I/O 的模型，使其輕量又高效。Node.js 的包管理器 npm，是全球最大的開源庫生態系統。

　　b、能方便地搭建響應速度快、易於擴展的網絡應用，Node.js 使用事件驅動，非阻塞I/O 模型而得以輕量和高效，很是適合在分佈式設備上運行的數據密集型的實時應用。

　　c、 簡單說Node.js就是運行在服務器端的JavaScript，是如今流行的語言中能同時運行在前端與後臺的程序語言

　　2七、NPM(包管理器)做用是什麼?

　　NPM是隨同NodeJS一塊兒安裝的包管理工具，能解決NodeJS代碼部署上的不少問題，常見的使用場景有如下幾種：

　　a、容許用戶從NPM服務器下載別人編寫的第三方包到本地使用。

　　b、容許用戶從NPM服務器下載並安裝別人編寫的命令行程序到本地使用。

　　c、容許用戶將本身編寫的包或命令行程序上傳到NPM服務器供別人使用。
更多前端信息，加羣434623999，
若是須要獲取前端就業課程，直接用QQ登陸http://www.kgc.cn/index.php?tuin=7124 ，不用下載app，就能夠領取課程了