前端基礎(chǔ)
-
prototype和__proto___的關(guān)系是什么 meta viewport原理
手機(jī)瀏覽器是把頁(yè)面放在一個(gè)虛擬的“窗口”（viewport）中考廉，通常這個(gè)虛擬的“窗口”（viewport）比屏幕寬丁侄，這樣就不用把每個(gè)網(wǎng)頁(yè)擠到很小的窗口中（這樣會(huì)破壞沒(méi)有針對(duì)手機(jī)瀏覽器優(yōu)化的網(wǎng)頁(yè)的布局），用戶(hù)可以通過(guò)平移和縮放來(lái)看網(wǎng)頁(yè)的不同部分消请。它們要解決的問(wèn)題是相同的屁魏，即無(wú)視設(shè)備的真實(shí)分辨率，直接通過(guò)dpi，在物理尺寸和瀏覽器之間重設(shè)分辨率
<meta name=”viewport” content=”width=device- width, initial-scale=1, maximum-scale=1″>
width：控制 viewport 的大小捣辆，可以指定的一個(gè)值，如果 600此迅，或者特殊的值汽畴，
如 device-width 為設(shè)備的寬度（單位為縮放為 100% 時(shí)的 CSS 的像素）旧巾。
height：和 width 相對(duì)應(yīng)，指定高度忍些。
initial-scale：初始縮放比例鲁猩，也即是當(dāng)頁(yè)面第一次 load 的時(shí)候縮放比例。
maximum-scale：允許用戶(hù)縮放到的最大比例罢坝。
minimum-scale：允許用戶(hù)縮放到的最小比例廓握。
user-scalable：用戶(hù)是否可以手動(dòng)縮放
- 域名收斂
在移動(dòng)網(wǎng)絡(luò)環(huán)境下，減少非必要 DNS 請(qǐng)求嘁酿，將相關(guān)域名收斂成一個(gè)隙券，可以嘗到緩存的紅利，進(jìn)而可以減少打開(kāi)頁(yè)面時(shí)間
移動(dòng)端減少 DNS 解析時(shí)間有兩種方式：
- 減少 DNS 請(qǐng)求
- 縮短 DNS 解析路徑
http 請(qǐng)求過(guò)程
DNS 域名解析 -->
發(fā)起 TCP 的 3 次握手 -->
建立 TCP 連接后發(fā)起 http 請(qǐng)求 -->
服務(wù)器響應(yīng) http 請(qǐng)求 -->
......略
在這里第一步痹仙，也是關(guān)鍵的第一步 DNS 解析是尔，在移動(dòng)端的 http 請(qǐng)求耗時(shí)中，DNS 解析占據(jù)了大部分時(shí)間开仰。float 和 inline-block
Inline-block是元素display屬性的一個(gè)值拟枚。這個(gè)名字的由來(lái)是因?yàn)椋琩isplay設(shè)置這個(gè)值的元素众弓，兼具行內(nèi)元素（ inline elements）跟塊級(jí)元素（block elements）的特征恩溅。
- 塊級(jí)元素（block elements）,來(lái)源于CSS盒子模型。塊級(jí)元素包含width height,padding,border與margin谓娃，他們的排列方式是從上到下排列脚乡。 行內(nèi)元素，排列方式是水平排列滨达。
- 行內(nèi)元素（inline elements）排列方式是水平排列奶稠。
-
行內(nèi)塊元素（inline-block elements）在內(nèi)部他的表現(xiàn)類(lèi)似block元素，比如他擁有block元素的width height,padding,border與margin捡遍，而外部的排列方式有類(lèi)似行內(nèi)元素锌订，即水平排列，而不是像塊級(jí)元素一樣從上到下排列
雖然設(shè)置浮動(dòng)跟設(shè)置inline-block有些特征類(lèi)似画株，但兩者的區(qū)別還是非常明顯的: - 文檔流（Document flow）:浮動(dòng)元素會(huì)脫離文檔流辆飘，并使得周?chē)?a target="_blank" rel="nofollow">環(huán)繞這個(gè)元素。而inline-block元素仍在文檔流內(nèi)谓传。因此設(shè)置inline-block不需要清除浮動(dòng)蜈项。當(dāng)然，周?chē)夭粫?huì)環(huán)繞這個(gè)元素续挟，你也不可能通過(guò)清除inline-block就讓一個(gè)元素跑到下面去紧卒。
- 水平位置（Horizontal position）：很明顯你不能通過(guò)給父元素設(shè)置text-align:center讓浮動(dòng)元素居中。事實(shí)上定位類(lèi)屬性設(shè)置到父元素上诗祸，均不會(huì)影響父元素內(nèi)浮動(dòng)的元素常侦。但是父元素內(nèi)元素如果設(shè)置了display：inline-block浇冰，則對(duì)父元素設(shè)置一些定位屬性會(huì)影響到子元素。（這還是因?yàn)楦?dòng)元素脫離文檔流的關(guān)系）聋亡。
- 垂直對(duì)齊（Vertical alignment）：inline-block元素沿著默認(rèn)的基線對(duì)齊。浮動(dòng)元素緊貼頂部际乘。你可以通過(guò)vertical屬性設(shè)置這個(gè)默認(rèn)基線坡倔，但對(duì)浮動(dòng)元素這種方法就不行了。這也是我傾向于inline-block的主要原因脖含。
首屏罪塔、白屏?xí)r間
http://hushicai.com/2014/04/19/guan-yu-ye-mian-shou-ping-shi-jian.html閉包
當(dāng)函數(shù)可以記住并訪問(wèn)所在的詞法作用于時(shí)，就產(chǎn)生了閉包养葵，即使函數(shù)是在當(dāng)前詞法作用域外執(zhí)行征堪。
http://yevvb.com/2017/03/17/You-Don%27t-Know-Javascript3/get post 區(qū)別
http://www.oschina.net/news/77354/http-get-post-different事件模型
http://www.cnblogs.com/lvdabao/p/3265870.html
http://www.cnblogs.com/lvdabao/p/3266421.html兼容ie的事件封裝
// 事件綁定
function addEvent(element, eType, handle, bol) {
if(element.addEventListener){ //如果支持addEventListener
element.addEventListener(eType, handle, bol);
}else if(element.attachEvent){ //如果支持attachEvent
element.attachEvent("on"+eType, handle);
}else{ //否則使用兼容的onclick綁定
element["on"+eType] = handle;
}
}
function removeEvent(element, eType, handle, bol) {
if(element.addEventListener){
element.removeEventListener(eType, handle, bol);
}else if(element.attachEvent){
element.detachEvent("on"+eType, handle);
}else{
element["on"+eType] = null;
}
}
getComputedStyle與style的區(qū)別
我們使用element.style也可以獲取元素的CSS樣式聲明對(duì)象，但是其與getComputedStyle方法還有有一些差異的关拒。
getComputedStyle方法是只讀的佃蚜，只能獲取樣式，不能設(shè)置着绊；
而element.style能讀能寫(xiě)谐算，能屈能伸。
getComputedStyle方法獲取的是最終應(yīng)用在元素上的所有CSS屬性對(duì)象（即使沒(méi)有CSS代碼归露，也會(huì)把默認(rèn)的祖宗八代都顯示出來(lái)）洲脂；而element.style只能獲取元素style屬性中的CSS樣式。因此對(duì)于一個(gè)光禿禿的元素
<p>剧包，getComputedStyle方法返回對(duì)象中l(wèi)ength屬性值（如果有）就是190+(據(jù)我測(cè)試FF:192, IE9:195, Chrome:253, 不同環(huán)境結(jié)果可能有差異), 而element.style就是0恐锦。
Angular
https://segmentfault.com/a/1190000005836443#articleHeader5
directive
https://segmentfault.com/a/1190000005851663
scope digest
https://github.com/xufei/Make-Your-Own-AngularJS/blob/master/01.md
動(dòng)態(tài)依賴(lài)注入
oc.lazyload
前端工程化
https://www.zhihu.com/question/24558375
