JS 基礎(chǔ)
- 五種原始類型：Number, Boolean, String, undefined, null.
- 七種數(shù)據(jù)類型：Number, Boolean, String, undefined, null, Object, Symbol.
- 類型判斷方法
typeof A: 多用于原始類型判斷福侈。
A instanceOf B：原型鏈判斷，B的原型是否存在于A的原型鏈中卢未，不適用于多窗口判斷肪凛。
constructor：根據(jù)實(shí)例的constructor可以判斷自定義類。
- Array 方法
isArray：判斷是否為數(shù)組對(duì)象辽社。
indexOf：查找元素伟墙，并返回元素在數(shù)組的索引。
slice：從數(shù)組中返回選定范圍的元素滴铅。
concat：返回拼接后的新數(shù)組远荠。
splice：修改原數(shù)組，并返回被移除的數(shù)組失息。
push：修改原數(shù)組譬淳，尾部增加一個(gè)元素。
pop：修改原數(shù)組盹兢，尾部刪減一個(gè)元素邻梆。
unshift: 修改原數(shù)組，頭部增加一個(gè)元素绎秒。
shift: 修改原數(shù)組浦妄，頭部刪減一個(gè)元素。
sort: 排序，正序剂娄，支持排序函數(shù)蠢涝。
reverse：排序，反序阅懦，支持排序函數(shù)和二。
toString：轉(zhuǎn)換為字符串，以“,”連接元素耳胎。
toLocaleString：每個(gè)元素調(diào)用toLocaleString惯吕。
join：按指定連接符號(hào)轉(zhuǎn)換為字符串。
every, filter, forEach, map, some, reduce ...
[p1, p2, p3].reduce((acc, cur) => {
return acc.then(cur).catch(console.log)
}, Promise.resolve(0))
- String 方法
charAt：返回字符串指定位置的字符怕午。
charCodeAt：返回字符串指定位置的字符編碼废登。
fromCharCode：字符編碼構(gòu)建字符串。
substring郁惜，slice：返回指定范圍的字符串堡距。
substr：指定起始位置和需要提取字符個(gè)數(shù)返回。
indexOf：返回搜索字符串所在字符串中的索引兆蕉。
trim：刪除字符串尾部空格吏颖。
toLowerCase、toUpperCase：大小寫轉(zhuǎn)換恨樟。
match：正則匹配半醉，返回匹配結(jié)果。
search：正則匹配劝术，返回匹配字符的索引缩多。
replace：替換字符，支持正則养晋。
split：分隔符拆分字符串衬吆，支持正則。
- 原型：一個(gè)可以實(shí)現(xiàn)對(duì)象屬性繼承的特殊對(duì)象 [[prototype]]绳泉，不可直接訪問(wèn)逊抡。每個(gè)函數(shù)都有一個(gè)prototype屬性，實(shí)例化后通過(guò)proto保持對(duì)prototype的引用零酪。
- 原型繼承
// 寄生(閉包)組合繼承
function Child(name) {
Supper.call(this); // 父類初始化
this.name = name; // 初始化
}
(() => {
const Bridge = function(){}; // 子冒嫡、父類之間的橋接
Bridge.prototype = Supper.prototype;
Child.prototype = new Bridge();
Child.prototype.constructor = Child;
})();
-
原型鏈
- 作用域、作用域鏈
作用域分為全局作用域四苇、函數(shù)作用域 和 eval 作用域孝凌，是在函數(shù)調(diào)用時(shí)在堆中分配的一個(gè)對(duì)象。作用域鏈?zhǔn)街冈诖a執(zhí)行環(huán)境時(shí)的調(diào)用棧月腋，全局作用域永遠(yuǎn)時(shí)在棧低蟀架，當(dāng)關(guān)閉窗口時(shí)才會(huì)被銷毀瓣赂。
- 閉包
閉包，包含對(duì)外部作用域的引用片拍，并在將來(lái)某一時(shí)間可能被調(diào)用的函數(shù)煌集。
- Ajax機(jī)制
XMLHttpRequest是ajax的核心機(jī)制，主要是進(jìn)行服務(wù)器數(shù)據(jù)的異步請(qǐng)求操作捌省，瀏覽器對(duì)并發(fā)的請(qǐng)求是有限制的苫纤，一般10個(gè)左右。通過(guò)XHR實(shí)例的open方式設(shè)置請(qǐng)求參數(shù)所禀，通過(guò)send來(lái)發(fā)送請(qǐng)求，通過(guò)onreadystatechange 來(lái)進(jìn)行請(qǐng)求結(jié)果的判斷放钦，并通過(guò)responseText獲取請(qǐng)求結(jié)果色徘。
- JSONP機(jī)制
Jsonp跨域請(qǐng)求主要是通過(guò)script標(biāo)簽進(jìn)行跨域請(qǐng)求，在跨域請(qǐng)求之前操禀，在全局作用域中定義好相應(yīng)的處理函數(shù)褂策，并把函數(shù)名稱告知后端。后端通過(guò)url獲知該函數(shù)名稱颓屑，并構(gòu)造相應(yīng)的調(diào)用代碼進(jìn)行響應(yīng)斤寂。而獲得響應(yīng)后的script將自動(dòng)運(yùn)行。該方法只能用于get請(qǐng)求揪惦，并需要后端配合遍搞。
- 事件機(jī)制
DOM0：通過(guò)onclick進(jìn)行一個(gè)事件綁定。
DOM2：通過(guò)addEventListener器腋，removeEventListener進(jìn)行事件綁定管理溪猿，并且支持事件捕獲和事件冒泡(父節(jié)點(diǎn)捕獲，子節(jié)點(diǎn)捕獲纫塌，子節(jié)點(diǎn)冒泡诊县，父節(jié)點(diǎn)冒泡，按事件注冊(cè)順序執(zhí)行)措左，默認(rèn)為冒泡依痊。而事件響應(yīng)回調(diào)的參數(shù)為事件對(duì)象，包含dom信息怎披，以及控制后續(xù)操作API胸嘁。
DOM3：類似DOM3，但事件有區(qū)分大小寫凉逛。
- 事件委托
利用冒泡的原理缴渊，把子節(jié)點(diǎn)的事件交由父節(jié)點(diǎn)進(jìn)行監(jiān)聽(tīng)并處理，而在移除父節(jié)點(diǎn)時(shí)鱼炒，只需對(duì)父節(jié)點(diǎn)綁定事件進(jìn)行解綁即可衔沼，而且可以提高性能蝌借，支持動(dòng)態(tài)節(jié)點(diǎn)的事件處理。
CSS 基礎(chǔ)
- 行內(nèi)元素：無(wú)法設(shè)置寬高, marginTop/marginBottom無(wú)效指蚁，不會(huì)自動(dòng)換行菩佑。
- 塊元素：可設(shè)置寬高，支持自動(dòng)換行凝化。
- 行內(nèi)塊元素：可設(shè)置寬高稍坯，不支持自動(dòng)換行。
- float：元素浮動(dòng)搓劫，脫了文檔流瞧哟，使用時(shí)需要清除浮動(dòng)，避免布局錯(cuò)亂枪向。
- flex：二維布局勤揩，內(nèi)部元素?zé)o法切換為行內(nèi)元素。
- rem, vw：手機(jī)端適配單位秘蛔，rem需MediaQuery對(duì)不同分辨率的手機(jī)進(jìn)行html的fontSize設(shè)置陨亡。vw為視口單位。
HTML5 基礎(chǔ)
- canvas：畫布深员，通過(guò)getContext來(lái)獲取操作環(huán)境负蠕。
- svg：矢量圖，放大不會(huì)失真倦畅。
- iconfont：字體圖標(biāo)遮糖，放大會(huì)失真。
- video叠赐，audio：音視頻播放器止吁，配合canvas進(jìn)行界面美化。
- transform：幾何操作燎悍，借助GPU進(jìn)行重新渲染敬惦。
- key Frame：動(dòng)畫幀定義。
- websocket：通訊機(jī)制谈山，用于實(shí)現(xiàn)運(yùn)算隔離俄删。
- index DB：本地?cái)?shù)據(jù)庫(kù)，存儲(chǔ)大數(shù)據(jù)奏路。
- File Api：文件操作畴椰，Blob、URL鸽粉、FileReader等斜脂。
