https://www.cnblogs.com/autismtune/p/5210116.html
HTML&CSS：? 對Web標準的理解捣鲸、瀏覽器內(nèi)核差異、兼容性、hack荧关、CSS基本功：布局、盒子模型褂傀、選擇器優(yōu)先級及使用忍啤、HTML5、CSS3仙辟、移動端適應(yīng)同波。JavaScript：? 數(shù)據(jù)類型、面向?qū)ο蟮⒗^承未檩、閉包、插件粟焊、作用域冤狡、跨域孙蒙、原型鏈、模塊化悲雳、自定義事件挎峦、內(nèi)存泄漏、事件機制合瓢、異步裝載回調(diào)坦胶、模板引擎、Nodejs晴楔、JSON顿苇、ajax等。
其他：? HTTP滥崩、安全岖圈、正則、優(yōu)化钙皮、重構(gòu)蜂科、響應(yīng)式、移動端短条、團隊協(xié)作导匣、可維護、SEO茸时、UED贡定、架構(gòu)、職業(yè)生涯
cookie
1.IE6或更低版本最多20個cookie2.IE7和之后的版本最后可以有50個cookie可都。3.Firefox最多50個cookie4.chrome和Safari沒有做硬性限制
Opera會清理近期最少使用的Firefox會隨機清理?4096字節(jié)缓待，為了兼容性，一般不能超過?IE 提供了一種存儲可以持久化用戶數(shù)據(jù)渠牲，叫做IE5.0就開始支持旋炒。每個數(shù)據(jù)最多128K，每個域名下最多1M签杈。這個持久化數(shù)據(jù)放在緩存中瘫镇，如果緩存沒有清理，那么會一直存在答姥。
1.通過良好的編程铣除，控制保存在cookie中的session對象的大小。
2.通過加密和安全傳輸技術(shù)（SSL）鹦付，減少cookie被破解的可能性尚粘。
3.只在cookie中存放不敏感數(shù)據(jù)，即使被盜也不會有重大損失敲长。
4.控制cookie的生命期背苦，使之不會永遠有效互捌。偷盜者很可能拿到一個過期的cookie。
1.`Cookie`數(shù)量和長度的限制行剂。每個domain最多只能有20條cookie，每個cookie長度不能超過4KB钳降，否則會被截掉厚宰。2.安全性問題。如果cookie被人攔截了遂填，那人就可以取得所有的session信息铲觉。即使加密也與事無補，因為攔截者并不需要知道cookie的意義吓坚，他只要原樣轉(zhuǎn)發(fā)cookie就可以達到目的了撵幽。3.有些狀態(tài)不可能保存在客戶端。例如礁击，為了防止重復(fù)提交表單盐杂，我們需要在服務(wù)器端保存一個計數(shù)器。如果我們把這個計數(shù)器保存在客戶端哆窿，那么它起不到任何作用链烈。
在較高版本的瀏覽器中，sessionStorage和HTML5中提供了globalStorage挚躯。
Web Storage包括了兩種存儲方式：localStorage强衡。
sessionStorage不是一種持久化的本地存儲，僅僅是會話級別的存儲码荔。
cookie相似漩勤，區(qū)別是它是為了更大容量存儲設(shè)計的。Cookie都會被發(fā)送過去缩搅，這樣無形中浪費了帶寬越败，另外?除此之外，setItem,getItem,removeItem,clear等方法誉己，不像setCookie眉尸，getCookie。
但是Cookie的作用是與服務(wù)器進行交互巨双，作為Web Storage僅僅是為了在本地“存儲”數(shù)據(jù)而生
瀏覽器的支持除了UserData其實就是web storage噪猾。
sessionStorage都具有相同的操作方法，例如removeItem等
display:none和visibility:hidden的區(qū)別筑累？
display:none? 隱藏對應(yīng)的元素袱蜡，在文檔布局中不再給它分配空間，它各邊的元素會合攏慢宗，就當他從來不存在坪蚁。visibility:hidden? 隱藏對應(yīng)的元素奔穿，但是在文檔布局中仍保留原來的空間。
CSS中 link 和@import 的區(qū)別是敏晤？
A：(1)link屬于HTML標簽贱田，而@import是CSS提供的; (2) 頁面被加載的時，link會同時被加載嘴脾，而@import引用的CSS會等到頁面被加載完再加載;(3) import只在IE5以上才能識別男摧，而link是HTML標簽，無兼容問題; (4)link方式的樣式的權(quán)重 高于@import的權(quán)重.
position的absolute與fixed共同點與不同點
A：共同點：1.改變行內(nèi)元素的呈現(xiàn)方式译打，display被置為block耗拓；2.讓元素脫離普通流，不占據(jù)空間奏司；3.默認會覆蓋到非定位元素上B不同點：absolute的”根元素“是可以設(shè)置的乔询，而fixed的”根元素“固定為瀏覽器窗口。當你滾動網(wǎng)頁韵洋，fixed元素與瀏覽器窗口之間的距離是不變的竿刁。?
1）有兩種麻献， IE 盒子模型们妥、標準 W3C 盒子模型；IE的content部分包含了 border 和 pading;
2）盒模型： 內(nèi)容(content)勉吻、填充(padding)监婶、邊界(margin)、 邊框(border).
CSS 選擇符有哪些齿桃？哪些屬性可以繼承惑惶？優(yōu)先級算法如何計算？ CSS3新增偽類有那些短纵？
*? 1.id選擇器（ #myid）? ? ? ? 2.類選擇器（.myclassname）? ? ? ? 3.標簽選擇器（div,h1,p）? ? ? ? 4.相鄰選擇器（h1 +p）? ? ? ? 5.子選擇器（ul >li）? ? ? ? 6.后代選擇器（lia）? ? ? ? 7.通配符選擇器（ * ）? ? ? ? 8.屬性選擇器（a[rel = "external"]）? ? ? ? 9.偽類選擇器（a:hover,li:nth-child）? ? *? 可繼承的樣式：font-sizefont-familycolor,text-indent;? ? *? 不可繼承的樣式：borderpaddingmarginwidthheight ;? ? *? 優(yōu)先級就近原則带污，同權(quán)重情況下樣式定義最近者為準;? ? *? 載入樣式以最后載入的定位為準;優(yōu)先級為:? !important >id >class >tagimportant 比 內(nèi)聯(lián)優(yōu)先級高,但內(nèi)聯(lián)比id 要高CSS3新增偽類舉例：p:first-of-type 選擇屬于其父元素的首個
元素的每個
元素。p:last-of-type? 選擇屬于其父元素的最后
元素的每個
元素香到。p:only-of-type? 選擇屬于其父元素唯一的
元素的每個
元素鱼冀。p:only-child? ? 選擇屬于其父元素的唯一子元素的每個
元素。p:nth-child(2)? 選擇屬于其父元素的第二個子元素的每個
元素悠就。:enabled:disabled 控制表單控件的禁用狀態(tài)千绪。:checked? ? ? ? 單選框或復(fù)選框被選中。
列出display的值梗脾，說明他們的作用荸型。position的值， relative和absolute分別是相對于誰進行定位的炸茧？
1.? ? block 象塊類型元素一樣顯示瑞妇。inline 缺省值稿静。象行內(nèi)元素類型一樣顯示。inline-block 象行內(nèi)元素一樣顯示辕狰，但其內(nèi)容象塊類型元素一樣顯示改备。list-item 象塊類型元素一樣顯示，并添加樣式列表標記柳琢。2.? *absolute? ? ? ? 生成絕對定位的元素绍妨，相對于static 定位以外的第一個祖先元素進行定位。? *fixed （老IE不支持）? ? ? ? 生成絕對定位的元素柬脸，相對于瀏覽器窗口進行定位。? *relative? ? ? ? 生成相對定位的元素毙驯，相對于其在普通流中的位置進行定位倒堕。? *static? 默認值。沒有定位爆价，元素出現(xiàn)在正常的流中
? *（忽略 top, bottom, left, right z-index 聲明）垦巴。
? * inherit 規(guī)定從父元素繼承 position 屬性的值。
CSS3實現(xiàn)圓角（border-radius）骤宣，陰影（box-shadow），對文字加特效（text-shadow序愚、）憔披，線性漸變（gradient），旋轉(zhuǎn)（transform）transform:rotate(9deg) scale(0.85,0.90) translate(0px,-30px) skew(-9deg,0deg);//旋轉(zhuǎn),縮放,定位,傾斜增加了更多的CSS選擇器? 多背景 rgba 在CSS3中唯一引入的偽元素是::selection.
媒體查詢爸吮，多欄布局
border-image
因為瀏覽器的兼容問題，不同瀏覽器對有些標簽的默認值是不同的形娇，如果沒對CSS初始化往往會出現(xiàn)瀏覽器之間的頁面顯示差異锰霜。? ? 當然，初始化樣式會對SEO有一定的影響桐早，但魚和熊掌不可兼得癣缅，但力求影響最小的情況下初始化。*最簡單的初始化方法就是： *{padding:0;margin:0;} （不建議）? ? 淘寶的樣式初始化：body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td{margin:0;padding:0;}body,button,input,select,textarea{font:12px/1.5tahoma, arial, \5b8b\4f53;}h1,h2,h3,h4,h5,h6{font-size:100%;}address,cite,dfn,em,var{font-style:normal;}code,kbd,pre,samp{font-family:couriernew, courier, monospace;}small{font-size:12px;}ul,ol{list-style:none;}a{text-decoration:none;}a:hover{text-decoration:underline;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}legend{color:#000;}fieldset,img{border:0;}button,input,select,textarea{font-size:100%;}table{border-collapse:collapse;border-spacing:0;}
? ? ? BFC友存，塊級格式化上下文，一個創(chuàng)建了新的BFC的盒子是獨立布局的炫七，盒子里面的子元素的樣式不會影響到外面的元素爬立。在同一個BFC中的兩個毗鄰的塊級盒在垂直方向（和布局方向有關(guān)系）的margin會發(fā)生折疊。
? ? （W3C CSS 2.1 規(guī)范中的一個概念万哪，它決定了元素如何對其內(nèi)容進行布局侠驯，以及與其他元素的關(guān)系和相互作用抡秆。）
解釋下 CSS sprites，以及你要如何在頁面或網(wǎng)站中使用它吟策。
CSS Sprites其實就是把網(wǎng)頁中一些背景圖片整合到一張圖片文件中儒士，再利用CSS的“background-image”，“background- repeat”檩坚，“background-position”的組合進行背景定位着撩，background-position可以用數(shù)字能精確的定位出背景圖片的位置。這樣可以減少很多圖片請求的開銷匾委，因為請求耗時比較長拖叙；請求雖然可以并發(fā)，但是也有限制赂乐，一般瀏覽器都是6個薯鳍。對于未來而言，就不需要這樣做了挨措，因為有了`http2`挖滤。
1浅役，去掉或者丟失樣式的時候能夠讓頁面呈現(xiàn)出清晰的結(jié)構(gòu)
2斩松，有利于SEO：和搜索引擎建立良好溝通，有助于爬蟲抓取更多的有效信息：爬蟲依賴于標簽來確定上下文和各個關(guān)鍵字的權(quán)重觉既；
3惧盹，方便其他設(shè)備解析（如屏幕閱讀器、盲人閱讀器奋救、移動設(shè)備）以意義的方式來渲染網(wǎng)頁岭参；
4，便于團隊開發(fā)和維護尝艘，語義化更具可讀性演侯，是下一步吧網(wǎng)頁的重要動向，遵循W3C標準的團隊都遵循這個標準背亥，可以減少差異化秒际。
Doctype作用? 嚴格模式與混雜模式如何區(qū)分？它們有何意義?
（1）狡汉、 聲明位于文檔中的最前面娄徊，處于
（2）、嚴格模式的排版和 JS 運作模式是? 以該瀏覽器支持的最高標準運行盾戴。
（3）寄锐、在混雜模式中，頁面以寬松的向后兼容的方式顯示。模擬老式瀏覽器的行為以防止站點無法工作橄仆。
（4）剩膘、DOCTYPE不存在或格式不正確會導(dǎo)致文檔以混雜模式呈現(xiàn)。?
該標簽可聲明三種 DTD 類型怠褐，分別表示嚴格版本、過渡版本以及基于框架的 HTML 文檔您宪。
HTML 4.01 規(guī)定了三種文檔類型：Strict奈懒、Transitional 以及 Frameset。
XHTML 1.0 規(guī)定了三種 XML 文檔類型：Strict宪巨、Transitional 以及 Frameset磷杏。
Standards （標準）模式（也就是嚴格呈現(xiàn)模式）用于呈現(xiàn)遵循最新標準的網(wǎng)頁，而 Quirks
（包容）模式（也就是松散呈現(xiàn)模式或者兼容模式）用于呈現(xiàn)為傳統(tǒng)瀏覽器而設(shè)計的網(wǎng)頁捏卓。
區(qū)別：1.所有的標記都必須要有一個相應(yīng)的結(jié)束標記2.所有標簽的元素和屬性的名字都必須使用小寫3.所有的XML標記都必須合理嵌套4.所有的屬性必須用引號""括起來5.把所有<和&特殊符號用編碼表示6.給所有屬性賦一個值7.不要在注釋內(nèi)容中使“--”8.圖片必須有說明文字
* png24位的圖片在iE6瀏覽器上出現(xiàn)背景，解決方案是做成PNG8.也可以引用一段腳本處理.* 瀏覽器默認的margin和padding不同。解決方案是加一個全局的*{margin:0;padding:0;}來統(tǒng)一瓦阐。* IE6雙邊距bug:塊屬性標簽float后伴鳖，又有橫行的margin情況下，在ie6顯示margin比設(shè)置的大螟炫。* 浮動ie產(chǎn)生的雙倍距離（IE6雙邊距問題：在IE6下，如果對元素設(shè)置了浮動，同時又設(shè)置了margin-left或margin-right物邑，margin值會加倍。）? #box{ float:left; width:10px; margin:0 0 0 100px;}? 這種情況之下IE會產(chǎn)生20px的距離滔金，解決方案是在float的標簽樣式控制中加入 ——_display:inline;將其轉(zhuǎn)化為行內(nèi)屬性色解。(_這個符號只有ie6會識別)*? 漸進識別的方式，從總體中逐漸排除局部餐茵。? 首先科阎，巧妙的使用“\9”這一標記，將IE游覽器從所有情況中分離出來忿族。? 接著锣笨，再次使用“+”將IE8和IE7、IE6分離開來道批，這樣IE8已經(jīng)獨立識別错英。? css.bb{background-color:#f1ee18;/*所有識別*/.background-color:#00deff\9; /*IE6、7隆豹、8識別*/+background-color:#a200ff;/*IE6椭岩、7識別*/_background-color:#1e0bd1;/*IE6識別*/}*? IE下,可以使用獲取常規(guī)屬性的方法來獲取自定義屬性,? 也可以使用getAttribute()獲取自定義屬性;? Firefox下,只能使用getAttribute()獲取自定義屬性.? ? 解決方法:統(tǒng)一通過getAttribute()獲取自定義屬性.* IE下,event對象有x,y屬性,但是沒有pageX,pageY屬性;? Firefox下,event對象有pageX,pageY屬性,但是沒有x,y屬性.* 解決方法：（條件注釋）缺點是在IE瀏覽器下可能會增加額外的HTTP請求數(shù)。* Chrome 中文界面下默認會將小于 12px 的文本強制按照 12px 顯示,? 可通過加入 CSS 屬性 -webkit-text-size-adjust: none; 解決.* 超鏈接訪問過后hover樣式就不出現(xiàn)了 被點擊訪問過的超鏈接樣式不在具有hover和active了解決方法是改變CSS屬性的排列順序:L-V-H-A :? a:link {} a:visited {} a:hover {} a:active {}* 怪異模式問題：漏寫DTD聲明，F(xiàn)irefox仍然會按照標準模式來解析網(wǎng)頁判哥，但在IE中會觸發(fā)怪異模式献雅。為避免怪異模式給我們帶來不必要的麻煩，最好養(yǎng)成書寫DTD聲明的好習(xí)慣∫涛埃現(xiàn)在可以使用[html5](http://www.w3.org/TR/html5/single-page.html)推薦的寫法：``* 上下margin重合問題ie和ff都存在惩琉，相鄰的兩個div的margin-left和margin-right不會重合，但是margin-top和margin-bottom卻會發(fā)生重合夺荒。解決方法瞒渠，養(yǎng)成良好的代碼編寫習(xí)慣，同時采用margin-top或者同時采用margin-bottom技扼。* ie6對png圖片格式支持不好(引用一段腳本處理)
浮動元素脫離文檔流，不占據(jù)空間剿吻。浮動元素碰到包含它的邊框或者浮動元素的邊框停留窍箍。1.使用空標簽清除浮動。? 這種方法是在所有浮動標簽后面添加一個空標簽 定義cssclear:both. 弊端就是增加了無意義標簽丽旅。2.使用overflow椰棘。? 給包含浮動元素的父標簽添加css屬性overflow:auto;zoom:1;zoom:1用于兼容IE6。3.使用after偽對象清除浮動榄笙。? 該方法只適用于非IE瀏覽器邪狞。具體寫法可參照以下示例。使用中需注意以下幾點茅撞。一帆卓、該方法中必須為需要清除浮動元素的偽對象中設(shè)置height:0，否則該元素會比實際高出若干像素米丘；
浮動元素引起的問題：
（1）父元素的高度無法被撐開，影響與父元素同級的元素
（2）與浮動元素同級的非浮動元素會跟隨其后
（3）若非第一個元素浮動拄查，則該元素之前的元素也需要浮動吁津，否則會影響頁面顯示的結(jié)構(gòu)
解決方法：
使用clear:both;屬性來清除元素的浮動可解決2、3問題靶累，對于問題1腺毫，添加如下樣式，給父元素添加.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}.clearfix{display:inline-block;}/* for IE/Mac */
清除浮動的幾種方法：
1挣柬，額外標簽法潮酒，
（缺點：不過這個辦法會增加額外的標簽使HTML結(jié)構(gòu)看起來不夠簡潔。）2邪蛔，使用after偽類#parent:after{content:".";height:0;visibility:hidden;display:block;clear:both;? ? }3,浮動外部元素4,設(shè)置`overflow`為`hidden`或者autoIE8以下瀏覽器的盒模型中定義的元素的寬高不包括內(nèi)邊距和邊框
DOM操作——怎樣添加急黎、移除、移動、復(fù)制勃教、創(chuàng)建和查找節(jié)點淤击。
（1）創(chuàng)建新節(jié)點? ? ? createDocumentFragment()//創(chuàng)建一個DOM片段? ? ? createElement()//創(chuàng)建一個具體的元素? ? ? createTextNode()//創(chuàng)建一個文本節(jié)點（2）添加、移除故源、替換污抬、插入? ? ? appendChild()? ? ? removeChild()? ? ? replaceChild()? ? ? insertBefore()//在已有的子節(jié)點前插入一個新的子節(jié)點（3）查找? ? ? getElementsByTagName()//通過標簽名稱? ? ? getElementsByName()//通過元素的Name屬性的值(IE容錯能力較強，會得到一個數(shù)組绳军，其中包括id等于name值的)? ? ? getElementById()//通過元素Id印机，唯一性
html5有哪些新特性、移除了那些元素门驾？如何處理HTML5新標簽的瀏覽器兼容問題射赛？如何區(qū)分 HTML 和 HTML5？
* HTML5 現(xiàn)在已經(jīng)不是 SGML 的子集奶是，主要是關(guān)于圖像楣责，位置，存儲聂沙，多任務(wù)等功能的增加秆麸。* 拖拽釋放(Drag and drop) API? 語義化更好的內(nèi)容標簽（header,nav,footer,aside,article,section）? 音頻、視頻API(audio,video)? 畫布(Canvas) API? 地理(Geolocation) API? 本地離線存儲 localStorage 長期存儲數(shù)據(jù)及汉，瀏覽器關(guān)閉后數(shù)據(jù)不丟失蛔屹；? sessionStorage 的數(shù)據(jù)在瀏覽器關(guān)閉后自動刪除? 表單控件，calendar豁生、date、time漫贞、email甸箱、url、search? ? 新的技術(shù)webworker, websocket, Geolocation* 移除的元素純表現(xiàn)的元素：basefont迅脐，big芍殖，center，font, s谴蔑，strike豌骏，tt，u隐锭；對可用性產(chǎn)生負面影響的元素：frame窃躲，frameset，noframes钦睡；支持HTML5新標簽：* IE8/IE7/IE6支持通過document.createElement方法產(chǎn)生的標簽蒂窒，? 可以利用這一特性讓這些瀏覽器支持HTML5新標簽，? 瀏覽器支持新標簽后，還需要添加標簽?zāi)J的樣式：* 當然最好的方式是直接使用成熟的框架洒琢、使用最多的是html5shim框架<!--[if lt IE 9]>
? <script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script>
? <![endif]-->
如何區(qū)分： DOCTYPE聲明\新增的結(jié)構(gòu)元素\功能元素
1.優(yōu)點：? ? 解決加載緩慢的第三方內(nèi)容如圖標和廣告等的加載問題? ? Security sandbox? ? 并行加載腳本2.
? ? *iframe會阻塞主頁面的Onload事件；
? ? *即時內(nèi)容為空衰抑，加載也需要時間
? ? *沒有語意
如何實現(xiàn)瀏覽器內(nèi)多個標簽頁之間的通信?
調(diào)用localstorge象迎、cookies等本地存儲方式
Adobe Flash Socket 呛踊、 ActiveX HTMLFile (IE) 砾淌、 基于 multipart 編碼發(fā)送 XHR 、 基于長輪詢的 XHR
一個程序至少有一個進程,一個進程至少有一個線程.
線程的劃分尺度小于進程恋技，使得多線程程序的并發(fā)性高拇舀。
另外，進程在執(zhí)行過程中擁有獨立的內(nèi)存單元蜻底，而多個線程共享內(nèi)存骄崩，從而極大地提高了程序的運行效率。
線程在執(zhí)行過程中與進程還是有區(qū)別的薄辅。每個獨立的線程有一個程序運行的入口要拂、順序執(zhí)行序列和程序的出口。但是線程不能夠獨立執(zhí)行站楚，必須依存在應(yīng)用程序中脱惰，由應(yīng)用程序提供多個線程執(zhí)行控制。
從邏輯角度來看窿春，多線程的意義在于一個應(yīng)用程序中拉一，有多個執(zhí)行部分可以同時執(zhí)行。但操作系統(tǒng)并沒有將多個線程看做多個獨立的應(yīng)用旧乞，來實現(xiàn)進程的調(diào)度和管理以及資源分配蔚润。這就是進程和線程的重要區(qū)別。
你如何對網(wǎng)站的文件和資源進行優(yōu)化尺栖？
期待的解決方案包括：
文件合并
文件最小化/文件壓縮
使用 CDN 托管
緩存的使用（多個域名來提供緩存）
其他
1.優(yōu)化圖片
2.圖像格式的選擇（GIF：提供的顏色較少，可用在一些對顏色要求不高的地方）
3.優(yōu)化CSS（壓縮合并css延赌，如margin-top,margin-left...)
4.網(wǎng)址后加斜杠（如www.campr.com/目錄除盏，會判斷這個“目錄是什么文件類型，或者是目錄挫以。）
5.標明高度和寬度（如果瀏覽器沒有找到這兩個參數(shù)者蠕，它需要一邊下載圖片一邊計算大小，如果圖片很多掐松，瀏覽器需要不斷地調(diào)整頁面蠢棱。這不但影響速度锌杀，也影響瀏覽體驗。
當瀏覽器知道了高度和寬度參數(shù)后泻仙，即使圖片暫時無法顯示糕再，頁面上也會騰出圖片的空位，然后繼續(xù)加載后面的內(nèi)容玉转。從而加載時間快了突想，瀏覽體驗也更好了。）
6.減少http請求（合并文件究抓，合并圖片）猾担。
Profiler, JSPerf（http://jsperf.com/nexttick-vs-setzerotimeout-vs-settimeout）, Dromaeo
什么是 FOUC（無樣式內(nèi)容閃爍）刺下？你如何來避免 FOUC绑嘹？
FOUC - Flash Of Unstyled Content 文檔樣式閃爍@import"../fouc.css"; 而引用CSS文件的@import就是造成這個問題的罪魁禍首。IE會先加載整個HTML文檔的DOM橘茉，然后再去導(dǎo)入外部的CSS文件工腋，因此，在頁面DOM加載完成到CSS導(dǎo)入完成中間會有一段時間頁面上的內(nèi)容是沒有樣式的畅卓，這段時間的長短跟網(wǎng)速擅腰，電腦速度都有關(guān)系。 解決方法簡單的出奇翁潘，只要在之間加入一個或者元素就可以了趁冈。
undefined是一個表示"無"的原始值拜马，轉(zhuǎn)為數(shù)值時為?當聲明的變量還未被初始化時渗勘，變量的默認值為null用來表示尚未存在的對象，常用來表示函數(shù)企圖返回一個不存在的對象俩莽。
（1）變量被聲明了呀邢，但沒有賦值時，就等于undefined豹绪。 （2) 調(diào)用函數(shù)時，應(yīng)該提供的參數(shù)沒有提供申眼，該參數(shù)等于undefined瞒津。 （3）對象沒有賦值的屬性，該屬性的值為undefined括尸。 （4）函數(shù)沒有返回值時巷蚪，默認返回undefined。
（1） 作為函數(shù)的參數(shù)濒翻，表示該函數(shù)的參數(shù)不是對象屁柏。 （2） 作為對象原型鏈的終點啦膜。
1、創(chuàng)建一個空對象淌喻，并且this 變量引用該對象僧家，同時還繼承了該函數(shù)的原型。2裸删、屬性和方法被加入到this 引用的對象中八拱。3、新創(chuàng)建的對象由this 所引用涯塔，并且最后隱式的返回this 肌稻。var obj? = {};
obj.__proto__ = Base.prototype;
Base.call(obj);
JSON(JavaScriptObject Notation) 是一種輕量級的數(shù)據(jù)交換格式匕荸。它是基于JavaScript的一個子集爹谭。數(shù)據(jù)格式簡單, 易于讀寫, 占用帶寬小{'age':'12','name':'back'}
defer和async榛搔、動態(tài)創(chuàng)建DOM方式（創(chuàng)建script诺凡，插入到DOM中，加載完畢后callBack）药薯、按需異步載入js
jsonp绑洛、document.domain+iframe、window.name童本、window.postMessage真屯、服務(wù)器上設(shè)置代理頁面
jsonp的原理是動態(tài)插入script標簽
具體參見：詳解js跨域問題
documen.write和 innerHTML的區(qū)別
document.write只能重繪整個頁面
innerHTML可以重繪頁面的一部分
.call() 和 .apply() 的區(qū)別和作用？
作用：動態(tài)改變某個類的某個方法的運行環(huán)境穷娱。
區(qū)別參見：JavaScript學(xué)習(xí)總結(jié)（四）function函數(shù)部分
內(nèi)存泄漏指任何對象在您不再擁有或需要它之后仍然存在。垃圾回收器定期掃描對象泵额，并計算引用了每個對象的其他對象的數(shù)量配深。如果一個對象的引用數(shù)量為0（沒有其他對象引用過該對象），或?qū)υ搶ο蟮奈┮灰檬茄h(huán)的嫁盲，那么該對象的內(nèi)存即可回收篓叶。setTimeout 的第一個參數(shù)使用字符串而非函數(shù)的話，會引發(fā)內(nèi)存泄漏羞秤。
閉包缸托、控制臺日志、循環(huán)（在兩個對象彼此引用且彼此保留時瘾蛋，就會產(chǎn)生一個循環(huán)）
如何判斷當前腳本運行在瀏覽器還是node環(huán)境中哺哼？
通過判斷Global對象是否為window佩抹，如果不為window叼风，當前腳本沒有運行在瀏覽器中
你遇到過比較難的技術(shù)問題是棍苹？你是如何解決的无宿？
常使用的庫有哪些？常用的前端開發(fā)工具廊勃？開發(fā)過什么應(yīng)用或組件懈贺？
99%的網(wǎng)站都需要被重構(gòu)是那本書上寫的坡垫？
* 網(wǎng)站重構(gòu)：應(yīng)用web標準進行設(shè)計（第2版）
優(yōu)雅降級：Web站點在所有新式瀏覽器中都能正常工作，如果用戶使用的是老式瀏覽器冰悠，則代碼會檢查以確認它們是否能正常工作堡妒。由于IE獨特的盒模型布局問題，針對不同版本的IE的hack實踐過優(yōu)雅降級了,為那些無法支持功能的瀏覽器增加候選方案溉卓，使之在舊式瀏覽器上以某種形式降級體驗卻不至于完全失效.
漸進增強：從被所有瀏覽器支持的基本功能開始皮迟，逐步地添加那些只有新式瀏覽器才支持的功能,向頁面增加無害于基礎(chǔ)瀏覽器的額外樣式和功能的。當瀏覽器支持時桑寨，它們會自動地呈現(xiàn)出來并發(fā)揮作用伏尼。
WEB應(yīng)用從服務(wù)器主動推送Data到客戶端有那些方式？
*（優(yōu)點）因為Node是基于事件驅(qū)動和無阻塞的爆阶，所以非常適合處理并發(fā)請求甩鳄，
? 因此構(gòu)建在Node上的代理服務(wù)器相比其他技術(shù)實現(xiàn)（如Ruby）的服務(wù)器表現(xiàn)要好得多截亦。
? 此外，與Node代理服務(wù)器交互的客戶端代碼是由javascript語言編寫的猿妈，
? 因此客戶端和服務(wù)器端都用同一種語言編寫肢藐，這是非常美妙的事情故河。
*（缺點）Node是一個相對新的開源項目，所以不太穩(wěn)定吆豹，它總是一直在變鱼的，
? 而且缺少足夠多的第三方庫支持《幻海看起來凑阶，就像是Ruby/Rails當年的樣子。
除了前端以外還了解什么其它技術(shù)么速勇？你最最厲害的技能是什么？
對前端界面工程師這個職位是怎么樣理解的养匈？它的前景會怎么樣？
前端是最貼近用戶的程序員都伪，比后端呕乎、數(shù)據(jù)庫、產(chǎn)品經(jīng)理陨晶、運營猬仁、安全都近。
? ? 1先誉、實現(xiàn)界面交互
? ? 2湿刽、提升用戶體驗
? ? 3、有了Node.js褐耳，前端可以實現(xiàn)服務(wù)端的一些事情
前端是最貼近用戶的程序員诈闺，前端的能力就是能讓產(chǎn)品從 90分進化到 100 分，甚至更好铃芦，
參與項目雅镊，快速高質(zhì)量完成實現(xiàn)效果圖，精確到1px刃滓；
與團隊成員仁烹，UI設(shè)計，產(chǎn)品經(jīng)理的溝通咧虎；
做好的頁面結(jié)構(gòu)卓缰，頁面重構(gòu)和用戶體驗；
處理hack老客，兼容僚饭、寫出優(yōu)美的代碼格式；
針對服務(wù)器的優(yōu)化胧砰、擁抱最新前端技術(shù)鳍鸵。
你在現(xiàn)在的團隊處于什么樣的角色，起到了什么明顯的作用尉间？
你認為怎樣才是全端工程師（Full Stack developer）偿乖？
最近在學(xué)什么画切？能談?wù)勀阄磥?，5年給自己的規(guī)劃嗎囱怕？
（詳情請看雅虎14條性能優(yōu)化原則）毫别。
? （1） 減少http請求次數(shù)：CSS Sprites, JS、CSS源碼壓縮典格、圖片大小控制合適岛宦；網(wǎng)頁Gzip，CDN托管耍缴，data緩存 砾肺，圖片服務(wù)器。
? （2） 前端模板 JS+數(shù)據(jù)防嗡，減少由于HTML標簽導(dǎo)致的帶寬浪費变汪，前端用變量保存AJAX請求結(jié)果，每次操作本地變量本鸣，不用請求疫衩，減少請求次數(shù)
? （3） 用innerHTML代替DOM操作，減少DOM操作次數(shù)荣德，優(yōu)化javascript性能闷煤。
? （4） 當需要設(shè)置的樣式很多時設(shè)置className而不是直接操作style。
? （5） 少用全局變量涮瞻、緩存DOM節(jié)點查找的結(jié)果鲤拿。減少IO讀取操作。
? （6） 避免使用CSS Expression（css表達式)又稱Dynamic properties(動態(tài)屬性)署咽。
? （7） 圖片預(yù)加載近顷，將樣式表放在頂部，將腳本放在底部? 加上時間戳宁否。
100-199 用于指定客戶端應(yīng)相應(yīng)的某些動作慕匠。
200-299 用于表示請求成功饱须。
300-399 用于已經(jīng)移動的文件并且常被包含在定位頭信息中指定新的地址信息。
400-499 用于指出客戶端的錯誤台谊。400? ? 1蓉媳、語義有誤，當前請求無法被服務(wù)器理解锅铅。401? 當前請求需要用戶驗證 403? 服務(wù)器已經(jīng)理解請求酪呻，但是拒絕執(zhí)行它。
500-599 用于支持服務(wù)器錯誤盐须。 503 – 服務(wù)不可用
詳情：http://segmentfault.com/blog/trigkit4/1190000000691919
一個頁面從輸入 URL 到頁面加載顯示完成玩荠，這個過程中都發(fā)生了什么？
? ? 分為4個步驟：
? ? （1），當發(fā)送一個URL請求時阶冈，不管這個URL是Web頁面的URL還是Web頁面上每個資源的URL屉凯，瀏覽器都會開啟一個線程來處理這個請求，同時在遠程DNS服務(wù)器上啟動一個DNS查詢眼溶。這能使瀏覽器獲得請求對應(yīng)的IP地址。
? ? （2）晓勇， 瀏覽器與遠程Web服務(wù)器通過TCP三次握手協(xié)商來建立一個TCP/IP連接堂飞。該握手包括一個同步報文，一個同步-應(yīng)答報文和一個應(yīng)答報文绑咱，這三個報文在 瀏覽器和服務(wù)器之間傳遞绰筛。該握手首先由客戶端嘗試建立起通信，而后服務(wù)器應(yīng)答并接受客戶端的請求描融，最后由客戶端發(fā)出該請求已經(jīng)被接受的報文铝噩。
? ? （3），一旦TCP/IP連接建立窿克，瀏覽器會通過該連接向遠程服務(wù)器發(fā)送HTTP的GET請求骏庸。遠程服務(wù)器找到資源并使用HTTP響應(yīng)返回該資源，值為200的HTTP響應(yīng)狀態(tài)表示一個正確的響應(yīng)年叮。
? ? （4）具被，此時，Web服務(wù)器提供資源服務(wù)只损，客戶端開始下載資源一姿。
請求返回后，便進入了我們關(guān)注的前端模塊
簡單來說跃惫，瀏覽器會解析HTML生成DOM Tree叮叹，其次會根據(jù)CSS生成CSS Rule Tree，而javascript又可以根據(jù)DOM API操作DOM
詳情：從輸入 URL 到瀏覽器接收的過程中發(fā)生了什么事情爆存？
先期團隊必須確定好全局樣式（globe.css），編碼模式(utf-8) 等终蒂；
? ? ? ? 編寫習(xí)慣必須一致（例如都是采用繼承式的寫法蜂林，單樣式都寫成一行）；
? ? ? ? 標注樣式編寫人拇泣，各模塊都及時標注（標注關(guān)鍵樣式調(diào)用的地方）噪叙；
? ? ? ? 頁面進行標注（例如 頁面 模塊 開始和結(jié)束）；
? ? ? ? CSS跟HTML 分文件夾并行存放霉翔，命名都得統(tǒng)一（例如style.css）睁蕾；
? ? ? ? JS 分文件夾存放 命名以該JS功能為準的英文翻譯。
? ? ? ? 圖片采用整合的 images.png png8 格式文件使用 盡量整合在一起使用方便將來的管理
Node.js瀑凝、Mongodb、npm臭杰、MVVM粤咪、MEAN、three.js,React 渴杆。
網(wǎng)站：w3cfuns,sf,hacknews,CSDN,慕課寥枝，博客園，InfoQ,w3cplus等
1磁奖，工廠模式
2囊拜，構(gòu)造函數(shù)模式
3，原型模式
4比搭，混合構(gòu)造函數(shù)和原型模式
5冠跷，動態(tài)原型模式
6，寄生構(gòu)造函數(shù)模式
7身诺，穩(wěn)妥構(gòu)造函數(shù)模式
1蜜托，原型鏈繼承
2，借用構(gòu)造函數(shù)繼承
3霉赡，組合繼承(原型+借用構(gòu)造)
4盗冷，原型式繼承
5，寄生式繼承
6同廉，寄生組合式繼承
(1)創(chuàng)建XMLHttpRequest對象,也就是創(chuàng)建一個異步調(diào)用對象.
(2)創(chuàng)建一個新的HTTP請求,并指定該HTTP請求的方法仪糖、URL及驗證信息.
(3)設(shè)置響應(yīng)HTTP請求狀態(tài)變化的函數(shù).
(4)發(fā)送HTTP請求.
(5)獲取異步調(diào)用返回的數(shù)據(jù).
(6)使用JavaScript和DOM實現(xiàn)局部刷新.
詳情：JavaScript學(xué)習(xí)總結(jié)（七）Ajax和Http狀態(tài)字
1.異步加載的方案： 動態(tài)插入script標簽2.通過ajax去獲取js代碼，然后通過eval執(zhí)行3.script標簽上添加defer或者async屬性4.創(chuàng)建并插入iframe迫肖，讓它異步執(zhí)行js5.延遲加載：有些 js 代碼并不是頁面初始化的時候就立刻需要的锅劝，而稍后的某些情況才需要的。
（XSS故爵，sql注入，CSRF）CSRF：是跨站請求偽造隅津，很明顯根據(jù)剛剛的解釋诬垂，他的核心也就是請求偽造，通過偽造身份提交POST和GET請求來進行跨域的攻擊伦仍。**完成CSRF需要兩個步驟：**
1.登陸受信任的網(wǎng)站A结窘，在本地生成COOKIE
2.在不登出A的情況下，或者本地COOKIE沒有過期的情況下充蓝，訪問危險網(wǎng)站B隧枫。
IE6 兩個并發(fā)喉磁，iE7升級之后的6個并發(fā)，之后版本也是6個Firefox官脓，chrome也是6個
javascript里面的繼承怎么實現(xiàn)协怒，如何避免原型鏈上面的對象共享
用構(gòu)造函數(shù)和原型鏈的混合模式去實現(xiàn)繼承，避免對象共享可以參考經(jīng)典的extend()函數(shù)卑笨，很多前端框架都有封裝的孕暇，就是用一個空函數(shù)當做中間變量
grunt， YUI compressor 和 google clojure用來進行代碼壓縮的用法赤兴。
YUI Compressor 是一個用來壓縮 JS 和 CSS 文件的工具芭商，采用Java開發(fā)。使用方法：//壓縮JSjava -jar yuicompressor-2.4.2.jar --type js --charset utf-8 -v src.js > packed.js//壓縮CSSjava -jar yuicompressor-2.4.2.jar --type css --charset utf-8 -v src.css > packed.css
Flash搀缠、Ajax各自的優(yōu)缺點，在使用中如何取舍近迁？
1艺普、Flash ajax對比
Flash適合處理多媒體、矢量圖形鉴竭、訪問機器歧譬；對CSS、處理文本上不足搏存，不容易被搜索瑰步。
Ajax對CSS璧眠、文本支持很好，支持搜索袁滥；多媒體灾螃、矢量圖形、機器訪問不足嵌赠。
共同點：與服務(wù)器的無刷新傳遞消息熄赡、用戶離線和在線狀態(tài)、操作DOM
概念:同源策略是客戶端腳本（尤其是Netscape Navigator2.0，其目的是防止某個文檔或腳本從多個不同源裝載溜在。
這里的同源策略指的是：協(xié)議陌知，域名，端口相同掖肋，同源策略是一種安全協(xié)議仆葡。
指一段腳本只能讀取來自同一來源的窗口和文檔的屬性。
我們舉例說明：比如一個黑客程序沿盅，他利用Javascript讀取到你的表單中?什么是 "use strict"; ? 使用它的好處和壞處分別是什么？
Javascript在更嚴格的條件下運行纫溃。
設(shè)立"嚴格模式"的目的腰涧，主要有以下幾個：
- 消除Javascript語法的一些不合理、不嚴謹之處紊浩，減少一些怪異行為;- 消除代碼運行的一些不安全之處窖铡，保證代碼運行的安全；- 提高編譯器效率坊谁，增加運行速度费彼；- 為未來新版本的Javascript做好鋪墊。
注：經(jīng)過測試?缺點：
現(xiàn)在網(wǎng)站的merge后口芍，這個串就到了文件的中間箍铲，不僅沒有指示嚴格模式，反而在壓縮后浪費了字節(jié)鬓椭。
? ? GET：一般用于信息獲取小染，使用URL傳遞參數(shù)芙粱，對所發(fā)送信息的數(shù)量也有限制春畔，一般在2000個字符
? ? POST：一般用于修改服務(wù)器上的資源，對所發(fā)送的信息沒有限制择份。
? ? GET方式需要使用Request.QueryString來取得變量的值荣赶，而POST方式通過Request.Form來獲取變量的值利诺，
? ? 也就是說Get是通過地址欄來傳值，而Post是通過提交表單來傳值侣滩。
然而君珠，在以下情況中，請使用 POST 請求：
無法使用緩存文件（更新服務(wù)器上的文件或數(shù)據(jù)庫）
向服務(wù)器發(fā)送大量數(shù)據(jù)（POST 沒有數(shù)據(jù)量限制）
發(fā)送包含未知字符的用戶輸入時，POST 比 GET 更穩(wěn)定也更可靠
哪些地方會出現(xiàn)css阻塞悔醋，哪些地方會出現(xiàn)js阻塞？
js的阻塞特性：所有瀏覽器在下載JS下載账阻、解析、執(zhí)行完畢后才開始繼續(xù)JS蒲牧，但是?由于瀏覽器為了防止出現(xiàn)DOM樹冰抢，需要重新構(gòu)建?嵌入JS只會阻塞其后內(nèi)容的顯示挎扰，2種方式都會阻塞其后資源的下載尽超。也就是說外部樣式不會阻塞外部腳本的加載橙弱，但會阻塞外部腳本的執(zhí)行棘脐。
CSS本來是可以并行下載的，在什么情況下會出現(xiàn)阻塞加載了(在測試觀察中屈梁，CSS都是阻塞加載）
當JS的時候在讶，該JS放到?根本原因：因為瀏覽器會維持css和JS會阻塞后面的資源加載，所以就會出現(xiàn)上面?嵌入1曙强、放在底部，雖然放在底部照樣會阻塞所有呈現(xiàn)娜扇，但不會阻塞資源下載袱衷。2、如果嵌入JS放在head中嫌蚤，請把嵌入JS放在CSS頭部脱吱。3续捂、使用defer（只支持IE）4、不要在嵌入的JS中調(diào)用運行時間較長的函數(shù)矾克，如果一定要用胁附，可以用`setTimeout`來調(diào)用
將腳本放在底部。head中弓候，用以保證在<script>標簽放在前弓叛。
成組腳本：由于每個<script>總數(shù)也可以改善性能。適用于內(nèi)聯(lián)腳本和外部腳本畦徘。
前。
非阻塞腳本：等頁面完成加載后杯缺，再加載window.onload事件發(fā)出后開始下載代碼袍榆。
（1）fierfox3.5更高版本瀏覽器
（2）動態(tài)腳本元素：文檔對象模型（DOM）允許你使用js動態(tài)創(chuàng)建?
var script=document.createElement("script");script.type="text/javascript";script.src="file.js";document.getElementsByTagName("head")[0].appendChild(script);
此技術(shù)的重點在于：無論在何處啟動下載，文件額下載和運行都不會阻塞其他頁面處理過程才写。即使在head里（除了用于下載文件的http鏈接）。
詳情請見：詳解js閉包
詳情請見：JavaScript學(xué)習(xí)總結(jié)（九）事件詳解
它的功能是把對應(yīng)的字符串解析成JS代碼并運行牙肝；應(yīng)該避免使用eval，不安全股缸，非常耗性能（2次，一次解析成js語句镰惦，一次執(zhí)行）旺入。
// event(事件)工具集急膀，來源：github.com/markyun? ? markyun.Event = {// 頁面加載完成后? ? ? ? readyEvent :function(fn) {if (fn==null) {? ? ? ? ? ? ? ? fn=document;? ? ? ? ? ? }var oldonload =window.onload;if (typeofwindow.onload !='function') {window.onload = fn;? ? ? ? ? ? }else {window.onload =function() {? ? ? ? ? ? ? ? ? ? oldonload();? ? ? ? ? ? ? ? ? ? fn();? ? ? ? ? ? ? ? };? ? ? ? ? ? }? ? ? ? },// 視能力分別使用dom0||dom2||IE方式 來綁定事件// 參數(shù)： 操作的元素,事件名稱 ,事件處理程序? ? ? ? addEvent :function(element, type, handler) {if (element.addEventListener) {//事件類型聘殖、需要執(zhí)行的函數(shù)餐禁、是否捕捉? ? ? ? ? ? ? ? element.addEventListener(type, handler,false);? ? ? ? ? ? }elseif (element.attachEvent) {? ? ? ? ? ? ? ? element.attachEvent('on' + type,function() {? ? ? ? ? ? ? ? ? ? handler.call(element);? ? ? ? ? ? ? ? });? ? ? ? ? ? }else {? ? ? ? ? ? ? ? element['on' + type] = handler;? ? ? ? ? ? }? ? ? ? },// 移除事件? ? ? ? removeEvent :function(element, type, handler) {if (element.removeEnentListener) {? ? ? ? ? ? ? ? element.removeEnentListener(type, handler,false);? ? ? ? ? ? }elseif (element.datachEvent) {? ? ? ? ? ? ? ? element.detachEvent('on' + type, handler);? ? ? ? ? ? }else {? ? ? ? ? ? ? ? element['on' + type] =null;? ? ? ? ? ? }? ? ? ? },// 阻止事件 (主要是事件冒泡脯爪，因為IE不支持事件捕獲)? ? ? ? stopPropagation :function(ev) {if (ev.stopPropagation) {? ? ? ? ? ? ? ? ev.stopPropagation();? ? ? ? ? ? }else {? ? ? ? ? ? ? ? ev.cancelBubble =true;? ? ? ? ? ? }? ? ? ? },// 取消事件的默認行為? ? ? ? preventDefault :function(event) {if (event.preventDefault) {? ? ? ? ? ? ? ? event.preventDefault();? ? ? ? ? ? }else {? ? ? ? ? ? ? ? event.returnValue =false;? ? ? ? ? ? }? ? ? ? },// 獲取事件目標? ? ? ? getTarget :function(event) {return event.target || event.srcElement;? ? ? ? },// 獲取event對象的引用，取到事件的所有信息，確保隨時能使用event益缎；? ? ? ? getEvent :function(e) {var ev = e ||window.event;if (!ev) {var c =this.getEvent.caller;while (c) {? ? ? ? ? ? ? ? ? ? ev = c.arguments[0];if (ev && Event == ev.constructor) {break;? ? ? ? ? ? ? ? ? ? }? ? ? ? ? ? ? ? ? ? c = c.caller;? ? ? ? ? ? ? ? }? ? ? ? ? ? }return ev;
? ? ? ? }
? ? };
高并發(fā)又沾、聊天弊仪、實時消息推送?
*? 原型對象也是普通的對象，是對象一個自帶隱式的__proto__ 屬性驳癌，原型也有可能有自己的原型滑燃，如果一個原型對象的原型不為null的話，我們就稱之為原型鏈典予。*? 原型鏈是由一些用來繼承和共享屬性的對象組成的（有限的）對象鏈既琴。
編寫 CSS阅茶、讓頁面結(jié)構(gòu)更合理化，提升用戶體驗浦旱，實現(xiàn)良好的頁面效果和提升性能。
WEB應(yīng)用從服務(wù)器主動推送Data到客戶端有那些方式谷饿？
html5 websoket? ? WebSocket通過Flash? ? XHR長時間連接? ? XHR Multipart Streaming? ? 不可見的Iframe標簽的長時間連接(可跨域)
事件、IE與火狐的事件機制有什么區(qū)別翅睛？ 如何阻止冒泡？
1. 我們在網(wǎng)頁中的某個操作（有的操作對應(yīng)多個事件）。例如：當我們點擊一個按鈕就會產(chǎn)生一個事件丛版。是可以被 JavaScript 偵測到的行為好芭。2. 事件處理機制：IE是事件冒泡厕诡、firefox同時支持兩種事件模型，也就是：捕獲型事件和冒泡型事件绍傲。钩骇；3.? ev.stopPropagation();注意舊ie的方法 ev.cancelBubble =true;
ajax 是什么?ajax 的交互模型?同步和異步的區(qū)別?如何解決跨域問題?
詳情請見：JavaScript學(xué)習(xí)總結(jié)（七）Ajax和Http狀態(tài)字
1. 通過異步模式当窗，提升了用戶體驗2. 優(yōu)化了瀏覽器和服務(wù)器之間的傳輸，減少不必要的數(shù)據(jù)往返陪白，減少了帶寬占用3. Ajax在客戶端運行霉晕，承擔(dān)了一部分本來由服務(wù)器承擔(dān)的工作院促，減少了大用戶量下的服務(wù)器負載懊亡。2. Ajax的最大的特點是什么缀棍。? Ajax可以實現(xiàn)動態(tài)不刷新（局部刷新）? readyState屬性 狀態(tài) 有5個可取值：0=未初始化 ，1=啟動2=發(fā)送机错，3=接收爬范，4=完成ajax的缺點1、ajax不支持瀏覽器back按鈕弱匪。2青瀑、安全問題 AJAX暴露了與服務(wù)器交互的細節(jié)。3萧诫、對搜索引擎的支持比較弱斥难。4、破壞了程序的異常機制帘饶。5哑诊、不容易調(diào)試〖翱蹋跨域： jsonp镀裤、 iframe、window.name缴饭、window.postMessage暑劝、服務(wù)器上設(shè)置代理頁面
functionclone(Obj) {var buf;if (ObjinstanceofArray) {? ? ? ? ? ? ? buf = [];//創(chuàng)建一個空的數(shù)組var i = Obj.length;while (i--) {? ? ? ? ? ? ? ? ? buf[i] = clone(Obj[i]);? ? ? ? ? ? ? }return buf;? ? ? ? ? }elseif (ObjinstanceofObject){? ? ? ? ? ? ? buf = {};//創(chuàng)建一個空對象for (var kin Obj) {//為這個對象添加新的屬性? ? ? ? ? ? ? ? buf[k] = clone(Obj[k]);? ? ? ? ? ? ? }return buf;? ? ? ? ? }else{return Obj;?
? ? ? ? }?
? ? }?
網(wǎng)站重構(gòu)：在不改變外部行為的前提下担猛，簡化結(jié)構(gòu)、添加可讀性峭火，而在網(wǎng)站前端保持一致的行為毁习。也就是說是在不改變UI的情況下，對網(wǎng)站進行優(yōu)化卖丸，在擴展的同時保持一致的UI纺且。
對于傳統(tǒng)的網(wǎng)站來說重構(gòu)通常是：
表格(table)布局改為DIV+CSS
使網(wǎng)站前端兼容于現(xiàn)代瀏覽器(針對于不合規(guī)范的CSS、如對IE6有效的)
對于移動平臺的優(yōu)化
針對于SEO進行優(yōu)化
深層次的網(wǎng)站重構(gòu)應(yīng)該考慮的方面
減少代碼間的耦合
讓代碼保持彈性
嚴格按規(guī)范編寫代碼
設(shè)計可擴展的API
代替舊有的框架稍浆、語言(如VB)
增強用戶體驗
通常來說對于速度的優(yōu)化也包含在重構(gòu)中
壓縮JS载碌、CSS、image等前端資源(通常是由服務(wù)器來解決)
程序的性能優(yōu)化(如數(shù)據(jù)讀寫)
采用CDN來加速資源加載
對于JS DOM的優(yōu)化
HTTP服務(wù)器的文件緩存
functionwhatBrowser() {document.Browser.Name.value=navigator.appName;document.Browser.Version.value=navigator.appVersion;document.Browser.Code.value=navigator.appCodeName;document.Browser.Agent.value=navigator.userAgent;? ? ? }
以下是數(shù)組去重的三種方法：
Array.prototype.unique1 =function() {var n = [];//一個新的臨時數(shù)組for (var i =0; i
}
100? Continue? 繼續(xù)嫁艇，一般在發(fā)送post請求時，已發(fā)送了http header之后服務(wù)端將返回此信息弦撩，表示確認步咪，之后發(fā)送具體參數(shù)信息200? OK? 正常返回信息201? Created? 請求成功并且服務(wù)器創(chuàng)建了新的資源202? Accepted? 服務(wù)器已接受請求，但尚未處理301? Moved Permanently? 請求的網(wǎng)頁已永久移動到新位置益楼。302 Found? 臨時性重定向猾漫。303 See Other? 臨時性重定向点晴，且總是使用 GET 請求新的 URI。304? Not Modified? 自從上次請求后悯周，請求的網(wǎng)頁未修改過粒督。400 Bad Request? 服務(wù)器無法理解請求的格式，客戶端不應(yīng)當嘗試再次使用相同的內(nèi)容發(fā)起請求禽翼。401 Unauthorized? 請求未授權(quán)屠橄。403 Forbidden? 禁止訪問。404 Not Found? 找不到如何與 URI 相匹配的資源闰挡。500 Internal ServerError? 最常見的服務(wù)器端錯誤锐墙。503 Service Unavailable 服務(wù)器端暫時無法處理請求（可能是過載或維護）。
網(wǎng)頁的緩存是由HTTP消息頭中的private解总、no-cache贮匕、max-age姐仅、must-revalidate等花枫，默認為?max-age的效果。但是如果同時存在掏膏，則被max-age覆蓋劳翰。
Expires ="Expires"":" HTTP-date
例如
Expires:Thu, 01 Dec 1994 16:00:00 GMT （必須是GMT格式）
如果把它設(shè)置為?max-age都可以用來指定文檔的過期時間，但是二者有一些細微差別
1.Expires在HTTP/1.0中已經(jīng)定義馒疹，Cache-Control:max-age在HTTP/1.1中才有定義佳簸，為了向下兼容，僅使用max-age不夠颖变；2.Expires指定一個絕對的過期時間(GMT格式),這么做會導(dǎo)致至少2個問題：1)客戶端和服務(wù)器時間不同步導(dǎo)致Expires的配置出現(xiàn)問題生均。2）很容易在配置后忘記具體的過期時間，導(dǎo)致過期來臨出現(xiàn)浪涌現(xiàn)象腥刹；3.max-age 指定的是從文檔被訪問后的存活時間马胧，這個時間是個相對值(比如:3600s),相對的是文檔第一次被請求時服務(wù)器記錄的Request_time(請求時間)4.Expires指定的時間可以是相對文件的最后訪問時間(Atime)或者修改時間(MTime),而max-age相對對的是文檔的請求時間(Atime)如果值為no-cache,那么每次都會訪問服務(wù)器。如果值為max-age,則在過期之前不會重復(fù)訪問服務(wù)器衔峰。
//創(chuàng)建cookiefunctionsetCookie(name, value, expires, path, domain, secure) {var cookieText =encodeURIComponent(name) +'=' +encodeURIComponent(value);if (expiresinstanceofDate) {? ? ? ? cookieText +='; expires=' + expires;? ? }if (path) {? ? ? ? cookieText +='; expires=' + expires;? ? }if (domain) {? ? ? ? cookieText +='; domain=' + domain;? ? }if (secure) {? ? ? ? cookieText +='; secure';? ? }document.cookie = cookieText;}//獲取cookiefunctiongetCookie(name) {var cookieName =encodeURIComponent(name) +'=';var cookieStart =document.cookie.indexOf(cookieName);var cookieValue =null;if (cookieStart > -1) {var cookieEnd =document.cookie.indexOf(';', cookieStart);if (cookieEnd == -1) {? ? ? ? ? ? cookieEnd =document.cookie.length;
? ? ? ? }
