1、H5有哪些新特性，如何區分HTML和HTML5：H5主要是圖像，位置，存儲，多任務等功能的增加；繪製canvas，用於媒介回放的video和audio元素，本地離線存儲localStorage長期存儲數據，瀏覽器關閉後數據不丟失；sessionStorage數據在瀏覽器關閉後自動刪除；語意化內容元素：比如article、footer/header/nav/seciotn，表單控件calendar/date/time/email/ulr;Geolocation/webworker/websockt;
2/iframe有哪些缺點：iframe會阻塞主頁面的Onload事件；iframe與主頁面共享連接池，而瀏覽器對相同域的連接有限制，所以會影響頁面的並行加載；需要使用iframe最後通過js動態給iframe添加src屬性值，可以避免上述問題；
3、img標籤上title與alt屬性區別是什麼？
alt 當圖片不顯示時，用文字表示；title爲該屬性提供信息；
4、如何對網站的文件和資源進行優化：文件合併；文件最小化（文件壓縮）；緩存
5、語義話HTML：直觀的認識標籤，方便搜索引擎的抓取
6、字符串數組轉換：split():切割成數組形式；join()降數組轉換成字符串；數組的操作函數：pop（）尾部刪除、push（）尾部增加、unshift()頭部添加、shift（）頭部刪除；
7、js在頁面中的引用，一般原則上是把js和css都方正head中，但是瀏覽器是子上到下順序執行，意味着必須等到全部js都被下載、解析、執行完成後，才能開始呈現頁面的內容，所以現在爲了避免這種明顯的延遲，都是把js放在body元素中內容的後面；
用戶會因爲顯示空白內容的時間縮短而認爲頁面速度加快；
8、垃圾收集：js具有自動垃圾收集機制，執行環境會負責管理代碼執行過程中使用的內存；有兩種機制：常用的一種標記清除：可以使用任何方式來標記變量，比如可以通過翻轉某個特殊的位來記錄一個變量何時進入環境或者使用一個進入環境的變量表以及一個離開環境的變量表來跟蹤哪個變量發送了變化。另一種不常用的是引用計數：跟蹤記錄每個值被引用的次數。當聲明瞭一個變量並將一個引用類型值賦值給這個變量的時候，則這個值的引用次數就是1；如果同一個值又被賦值給另一個變量，則該值的引用次數加1；包含這個值引用的變量又取得了另一個值的時候，則這個值的引用次數減1；當這個值的引用次數變成0的時候，則說明沒有辦法再訪問這個值了，它佔用的內存就可以回收回來了；但是引用計數會導致死循環，比如相互引用，這樣引用次數永遠不會變爲0，如果多次調用就會導致大量內存被佔用；IE中有一部分對象並不是原生js對象，其中BOM和DOM中的對象就是C++以COM（組件對象模型）對象的形式實現的，而COM對象的垃圾收集機制採用的就是引用計數策略。因此使用過程中會導致部分內存不能釋放，爲了避免這種情況，可以把不用的對象設置爲null，
可以用下面的代碼來消除循環引用：
myObject.element=null;
element.someObject=null;
將變量設置爲空，意味着切斷變量和它之前引用的值直接的連接；當垃圾收集器下次運行的時候，就可以回收他們了。爲了更好的提升性能，最好養成在變量不用的時候設置爲null，這種做法適用於大多數全局變量和全局對象的屬性。對於局部變量則會在它們離開執行環境時自動被解除引用。
9、混合使用原型模式和構造函數模式：
10、寄生構造函數：構造函數在不返回值的情況下，默認會返回新對象實例，而通過在構造函數的末尾加上return語句，可以重寫構造函數返回的值。例如我們想創建一個具有額外方法的特殊數組，由於不能直接修改Array構造函數，因此可以使用這個模式：
由於寄生函數返回的對象和構造函數直接沒有關係，不能依賴instanceof操作符來確定對象的類型；
11、繼承：如果面向對象編程語言都支持兩種繼承方式：接口繼承和實現繼承；由於函數沒有簽名，所以在ES中無法實現接口繼承，只支持實現繼承，而且實現繼承主要依靠原型鏈來實現。
12、閉包：是指有權訪問另一個函數作用域中的變量 的函數。創建閉包常見的方式就是在一個函數內部創建另一個函數；因爲作用域問題導致閉包存在的問題：被包含的函數可以訪問其外部函數中定義的所有變量，當外部函數執行完畢後，其活動對象不會銷燬，因爲被包含的匿名函數的作用域鏈仍然在引用這個活動對象，直到匿名函數被銷燬後，活動東西纔會被銷燬。所以匿名函數使用後，外部函數完成使命後要即使釋放內存，置爲null。
因爲閉包會攜帶包含它的函數的作用域，因此回比其他函數佔用更多的內存，所以過度使用閉包會導致內存佔用過多。
13、關於this對象：this對象是在運行時基於函數的執行環境綁定的，在全局函數中，this等於window，而當函數被作爲某個對象的方法調用時，this等於那個對象；不過匿名函數的執行環境具有全局性，因此this通常代表的是window。
第二個在閉包中賦值了that=this,閉包的作用域還沒有消除，所以還可以訪問object中的name,而不是訪問的全局變量。
14、由於閉包的存在，會導致對DOM元素的引用無法銷燬，在IE中會導致內存泄漏；如下代碼：
閉包會引用包含函數的整個活動對象，即使閉包不直接引用element，包含函數的活動對象中也會報錯一個引用，因此非常有必要吧element設置爲null。
15、事件冒泡：
事件捕獲：與事件冒泡正好相反，事件的順序從不太具體的節點開始傳播，最好到達具體的節點。
事件流：事件捕獲、處於目標階段、事件冒泡；
HTML事件處理程序：
由於這個值是js,因此不能使用未經轉義的HTML語法字符，如和（&），雙引號，小於號、大於號。可以使用單引號，如果想要使用雙引號，就需要如下：
事件處理程序在代碼執行時，有權訪問全局作用域中的任何代碼；
16、H5<canvas>元素：要使用<canvas>元素，必須先設置其width、height屬性，指定可繪製區域的大小。要在這塊canvas上繪圖，需要取得繪圖上下文，通過getContext()方法獲取上下文，並傳入上下文名字（"2d"），就可以取得2D上下文對象；
var drawing=$("#drawing");
if(drawing.getContext){//確定支持canvas
var context=drawing.getContext("2d");
}
使用toDataURL()方法，可以導出在<canvas>元素上繪製的圖像，可以接受一個參數，即圖像的MIME類型格式；比如要取得畫布中歐冠一副PNG格式的圖像，可以使用下面的代碼：
var drawing=$("#drawing");
if(drawing.getContext){//確定支持canvas
var imgURL=drawing.toDataURL("image/png");//取得圖像的數據URL
var image=document.creatElement("img");//顯示圖像
image.src=imgURL;
document.body.appendChild(image);
}
2D 上下文：通過2D上下文提供的方法，可以繪製簡單的2D圖形，如矩形、弧形、路徑。2D上下文的座標開始於<canvas>元素的左上角，原點座標是（0,0），所有的座標都是基於這個原點計算，x越大越靠右，y越大越靠下。2D上下文的兩種基本繪圖操作是填充和描邊；操作的結果取決於兩個屬性：fillStyle和strokeStyle；可以設置樣式：
var drawing=$("#drawing");
if(drawing.getContext){//確定支持canvas
var context=drawing.getContext("2d");
context.strokeStyle="red";
context.fillStyle-"blue";
}
設置後所有涉及描邊和填充的操作都將使用這兩個樣式。
17、WebGL：WebGL有兩種着色器，頂點着色器和片段（像素）着色器。頂點着色器用於將3D頂點轉換爲需要渲染的2D點；片段着色器用於精確計算要繪製的每個像素的顏色。着色器是GLSL寫的，完全不同於c和JS。因爲WebGL是OpenGL 實現的，所以OpenGL中使用的着色器可以直接在WebGL中使用。每個着色器都有一個main()方法，該方法在繪圖期間會重複執行，爲着色器傳遞數據的方式有兩種：Attribute和Uniform。通過Attribute可以向頂點着色器中傳入頂點信息，通過Uniform可以向任何着色器傳入常量值。Attribute和Uniform在main()方法外面定義，分別使用關鍵字attribute和uniform。如下是一個簡單的頂點着色器：
//OpenGL着色語言
attribute vec2 aVertexPosition;
void main(){
gl_Postion=vec4(aVertexPosition,0.0,1.0);
}
這個頂點着色器定義了一個名爲aVertexPosition的Attribute，這個Attitude是一個數組，包含兩個元素（類型爲vec2）,表示x和y座標。即使只接受到包含連個座標，頂點着色器也必須把一個包含四面信息的頂點賦值給特殊變量gl_Postion。這個着色器新創建了一個包含四個元素的數組（vec4）,填補缺失的座標，就可以把2D座標變換成3D座標；
片段着色器和頂點着色器類似：
uniform vec4 uColor;
void main(){
gl_FragColor=uColor;
}
WebGL只能繪製三種形狀：點、線、三角；其它所有形狀都是由着三種基本形狀合成之後再繪製到三維空間中；執行繪圖操作要調用gl.drawArrays()或者gl.drawElements()方法。第一個參數都是一個常量，表示要繪製的形狀，包括以下這些：
gl.POINTS:將每個頂點當成一個點來繪製；
gl.LINES:將數組當成一系列頂點，在這些頂點直接畫線。每個頂點即時起點，也是終點，因此這個數組必須包含偶數個頂點；
gl.LINE_LOOP:將數組當成一系列頂點，在這些頂點間畫線，從第一個頂點到第二個頂點，一次類推，只到最後一個頂點，然後再從最後一個頂點到第一個頂點畫一條線，結果就是一個形狀的輪廓；
gl.TRINGGLES:將數組當成一系列頂點，在這些頂點間繪製三角形，除非明確指定，每個三角形都單獨繪製，不與其他三角形共享頂點；
gl.TRIANGLES_STRIP:將前三個頂點之後的頂點當做第三個頂點與前兩個頂點共同構成一個新三角形，其他與gl.TRIANGLES一樣。如數組中包含ABCD四個頂點，則第一個三角形連接ABC，第二個三角形連接BCD；
gl.TRIANGLES_FAN:將前三個頂點之後的頂點當做第三個頂點，與前一個頂點以及第一個頂點共同構成一個新三角形，其他與TRANFLES一樣。如ABCD四個頂點，則第一個三角形是ABC，第二個三角形是ACD；
gl.drawArrays()方法接收第一個參數是上面的常量，接收數組緩衝區中的起始索引作爲第二個參數，數組緩衝區中包含的頂點數（點的集合數）作爲第三個參數。如下就是gl.drawArrays()繪製一個三角形：
定義三個頂點，以及每個頂點的x和y的座標：
WebGL的紋理：可以使用DOM中的圖像，要創建一個新的紋理，可以調用gl.creatTexture();然後將一張圖像綁定到該紋理；如果圖像 尚未加載到內存中，需要創建一個Image對象的實例，以便動態加載圖像。圖像加載完成之前，紋理不會初始化，因此必須在load事件觸發後才能設置紋理：
gl.UNPACK_FLIP_Y_WEBGL是WebGL獨有的常量，因爲GIF、JPEG、PNG圖像與WebGL使用的座標系不一樣，所以在加載web中的圖像時，必須設置這個標誌，否則解析的時候就會發生混亂；
圖像、加載到<video>元素中的視頻，甚至其他<canvas>元素都可以用作紋理；如果是外部視頻，在服務器上啓用跨域資源共享；
20、Comet:也稱爲服務器推送，Ajax是從頁面向服務器請求數據，而Comet是服務器向頁面推送數據。Comet能夠讓信息近乎實時的被推送到頁面上。非常適合處理體育比賽的分數和股票的報價。兩種實現Comet的方法：長輪詢和流；長輪詢是瀏覽器定時向服務器發送請求，看有沒有更新的數據。長輪詢是頁面發起一個到服務器的請求，然後服務器一直保持連接打開，直到有數據可以發送，發送完數據後，瀏覽器關閉連接，隨即又發起一個到服務器的新請求。輪詢的優勢是所有瀏覽器都支持，可以使用XHR對象和setTimeout()就能實現。
第二種Comet實現是http流，在頁面的整個生命週期內只使用一個http連接。就是瀏覽器向服務器發送一個請求，服務器保持連接打開，然後週期性的向瀏覽器發送數據。
21、服務端發送事件：
Web Sockets：在js中創建了WebSocket之後，會有一個http請求發送到瀏覽器已發起連接，在取得服務器響應後，建立的連接會使用HTTP升級從HTTP協議交換爲WebSocket協議。由於WebSocket使用了自定義的協議，所以未加密的是ws://；加密的連接是wss://；使用自定義協議的好處是能夠在客戶端和服務器直接發送非常少量的數據，而不必擔心HTTP那種字節級的開銷。由於傳遞的數據包非常小，所以WebSocket非常適合移動應用，畢竟對於移動應用來說，帶寬和網絡延遲都是關鍵問題；當然自定義協議存在一致性和安全性問題。
首先是建立連接：
WebSocket只能發送純文本數據，所以發送json等複雜數據時，要先序列化：
服務器端發送數據，客戶端接收數據：
SSE與WebSocket選擇：首先看是否有自由度建立和維護WebSocket服務器，第二個看是不是需要雙向通信，如果只是讀取服務器數據（如比賽成績），那SSE比較容易實現；如果是雙向通信（比如聊天室），那肯定是WebSocket更好。當然SSE與XHR（ajax）共用也可以實現雙向通信。通源策略是對XHR（ajax）的一個主要約束，爲通信設置了相同的域、相同的端口、相同的協議。跨域解決方案：cors,瀏覽器基本都支持CORS，圖像Ping和JSONP。
Comet是對Ajax的進一步擴展，讓服務器幾乎能夠實時的向客戶端推送數據；SSE（server send events）是一種實現Comet交互的瀏覽器API，及支持長輪詢也支持http流。
22、安全類型檢測：
js內置的類型檢測機制並非完全可靠，如typeof,由於一些無法預知的行爲會導致檢測數據類型的時候不太靠譜。instanceof操作符存在多個全局操作符（像一個頁面包含多個框架）的情況下也會出問題。
23、性能優化：優化循環：是性能優化過程中很重要的一個部分，由於他們會反覆運行同一段代碼，從而自動的增加執行時間。優化的基本步驟：減值迭代：大多數循環都是從0開始，在很多情況下，從最大值開始，在循環中不斷減值的迭代器更加高效；簡化終止條件:由於每次循環都會計算終止條件，必須保證它儘可能的快；簡化循環體：循環體是執行最多的，確保沒有某些可以被很容易移出循環體的密集計算；展開循環：當循環的次數是確定的，消除循環使用多次調用函數往往更快，使用Duff裝置技術，可以提升大數據集的處理速度，如果處理的不是大數據，一般來說沒必要；使用原生方法較快，js中最容易被忘記的就是可以在Math對象中找到複雜的數學運算，這些方法比任何用js寫的同樣的方法快的多；switch語句較快，避免一系列複雜的if-else，case語句塊按照最可能到最不可能的順序進行組織；最小化語句數：多個變量聲明，用一個var來聲明多個變量；插入迭代值：var name=values[i++];
使用數組和對象字面量：var values=[1,2,3,5,7]; var person={name:"NIco",age:23,sayName:function(){alert(this.name)}};
優化DOM操作：最小化現場更新；使用innerHTML，對於大的DOM更改，使用innerHTML比使用標準的DOM方法要快的多；
HTTP請求是web中主要的性能瓶頸之一。
24、模塊：ES6對如何創建和管理模塊給出了標準的定義，模塊在自己的頂級執行環境中運行，不會污染導入它的全局執行環境，默認情況下，模塊中聲明的所有變量、函數、類等都是該模塊私有的，對於應該向外公開的成雨，在前面加上export關鍵字。
可以在頁面或者其他模塊中使用這個模塊，也可以只導入模塊中的一個成員或者兩個成員，導入模塊使用import命令：
總之，模塊就是一種組織相關功能的手段，而且能夠保護全局作用域不受污染；
25、JavaScript庫：
YUI：一個開源的js與css庫，以組件方式設計，可以按需載入；
Prototype:爲js提供類定義和繼承；
JQuery：提供函數式編程接口的開源庫；核心是構建於CSS選擇器上，用來操作DOM元素；
動畫和特效庫：script.aculo.us:是prototype的同伴，必須在prototype之後載入；
