? 第一天上午
前端開(kāi)發(fā)工作內(nèi)容和特點(diǎn)
[HTML]拉队、[CSS]翻屈、[JavaScript]是前端開(kāi)發(fā)中最基本也是最必須的三個(gè)技能缀程。前端的開(kāi)發(fā)中香追,在頁(yè)面的布局時(shí)合瓢, HTML將元素進(jìn)行定義,CSS對(duì)展示的元素進(jìn)行定位透典,再通過(guò)JavaScript實(shí)現(xiàn)相應(yīng)的效果和交互晴楔。前端工作的核心就是數(shù)據(jù)展示迁央,ui實(shí)現(xiàn),用戶交互滥崩,用戶體驗(yàn)岖圈。配合后端把內(nèi)容呈現(xiàn)出來(lái)。前端的特性也決定了一般不會(huì)把復(fù)雜的計(jì)算邏輯放前端處理钙皮。
? demo:一行代碼給窗口界面上的所有元素加上邊框蜂科;
web worker
1.線程和進(jìn)程
如果是windows電腦中,可以打開(kāi)任務(wù)管理器短条,可以看到有一個(gè)后臺(tái)進(jìn)程列表导匣。那里就是查看進(jìn)程的地方,而且可以看到每個(gè)進(jìn)程的內(nèi)存資源信息以及cpu占有率
進(jìn)程是cpu資源分配的最小單位(是能擁有資源和獨(dú)立運(yùn)行的最小單位)(系統(tǒng)會(huì)給它分配內(nèi)存)
線程是cpu調(diào)度的最小單位(線程是建立在進(jìn)程的基礎(chǔ)上的一次程序運(yùn)行單位茸时,一個(gè)進(jìn)程中可以有多個(gè)線程)
不同進(jìn)程之間也可以通信贡定,不過(guò)代價(jià)較大
現(xiàn)在,一般通用的叫法:?jiǎn)尉€程與多q線程可都,都是指在一個(gè)進(jìn)程內(nèi)的單和多缓待。(所以核心還是得屬于一個(gè)進(jìn)程才行)
1.1javascript 單線程
JS如果執(zhí)行時(shí)間過(guò)長(zhǎng)就會(huì)阻塞頁(yè)面。要盡量避免JS執(zhí)行時(shí)間過(guò)長(zhǎng)渠牲,這樣就會(huì)造成頁(yè)面的渲染不連貫旋炒,導(dǎo)致頁(yè)面渲染加載阻塞的感覺(jué)。
1.2 web worker 基本概念
1.3 基本用法
? 代碼演示
2.閉包
2.1變量作用域
2.2 從外部讀取局部變量
2.3 閉包的用途
2.4 閉包的缺點(diǎn)
2.5 應(yīng)用
2.6 內(nèi)存泄漏及解決辦法
ECMAScript 6 簡(jiǎn)介
[ECMAScript 和 JavaScript 的關(guān)系]
[ES6 與 ECMAScript 2015 的關(guān)系]
[語(yǔ)法提案的批準(zhǔn)流程]
[ECMAScript 的歷史]
[Babel 轉(zhuǎn)碼器]
1. var let 和 const
1.1 作用域
1.2 let 用法
1.3 變量提升
1.4 暫時(shí)性死區(qū)
1.5 變量重復(fù)聲明
1.6 塊級(jí)作用域
1.7 const 用法
1.8 const 本質(zhì)
2. 字符串?dāng)U展
2.1 模板字符串及用法
? 第一天下午
3.變量的解構(gòu)賦值
3.1 數(shù)組的解構(gòu)賦值
3.1.1 基本用法
3.1.2 默認(rèn)值
3.2 對(duì)象的解構(gòu)賦值
3.2.1 簡(jiǎn)介
3.2.2 默認(rèn)值
3.2.3 注意點(diǎn)
3.3 字符串解構(gòu)賦值签杈, 數(shù)值和布爾值的解構(gòu)賦值
3.4 函數(shù)參數(shù)的解構(gòu)賦值
3.5 圓括號(hào)問(wèn)題
3.6 變量解構(gòu)的用途
- 交換變量值
- 從函數(shù)返回多個(gè)值
- 函數(shù)參數(shù)定義
- 提取json數(shù)據(jù)
- 函數(shù)參數(shù)默認(rèn)值
- 遍歷map結(jié)構(gòu)
- 輸入模塊的指定方法
4. 函數(shù)的擴(kuò)展
4.1 函數(shù)的默認(rèn)值
4.1.1 基本用法
4.1.2 與解構(gòu)賦值結(jié)合使用
4.1.3 參數(shù)默認(rèn)值的位置
4.1.4 函數(shù)length屬性
4.1.5 作用域
4.1.6 應(yīng)用
4.2 rest參數(shù)
4.3 嚴(yán)格模式
4.4 name屬性
4.5 箭頭函數(shù)
4.5.1基本用法
4.5.2 箭頭函數(shù)注意點(diǎn)
4.5.3 不適用場(chǎng)景
4.5.4 嵌套的箭頭函數(shù)
4.6 函數(shù)參數(shù)的尾逗號(hào)
5.數(shù)組的擴(kuò)展
5.1 擴(kuò)展運(yùn)算符
5.1.1 含義
5.1.2 替代apply的用法
5.1.3 擴(kuò)展運(yùn)算符的應(yīng)用
- 復(fù)制數(shù)組
- 合并數(shù)組
- 與解構(gòu)賦值結(jié)合
- 字符串
- 實(shí)現(xiàn)了Iterator接口的對(duì)象
- Map和Set結(jié)構(gòu) Generator函數(shù)
? 第二天上午
6.對(duì)象的擴(kuò)展
6.1 屬性的簡(jiǎn)潔表示法
6.2 屬性名表達(dá)式
6.3 方法的name屬性
6.4 spuer關(guān)鍵字
6.5 對(duì)象的擴(kuò)展運(yùn)算符
6.5.1 結(jié)構(gòu)賦值
6.5.2 擴(kuò)展運(yùn)算符
7.對(duì)象的新增方法
7.1 Object.is()
7.2 Object.assign()
7.2.1 基本用法
8.promise對(duì)象
8.1 promise的含義
8.2基本用法
8.2.1 Promise.prototype.then()
8.2.2 Promise.prototype.catch()
8.3 Promise.prototype.finally()
8.4 Promise.all()
8.5 Promise.race()
8.6 Promise.resolve()
- 參數(shù)是一個(gè)Promise實(shí)例
- 參數(shù)是一個(gè)thenable對(duì)象
- 參數(shù)不是具有then方法的對(duì)象或者根本不是對(duì)象
- 不帶任何參數(shù)
8.7 Promise.reject()
8.8 應(yīng)用
8.8.1 加載圖片
8.8.2 Generator函數(shù)與Promise的結(jié)合
8.9 Promise.try()
? 第二天下午
9. Class的基本語(yǔ)法
9.1 簡(jiǎn)介
9.1.1 類的由來(lái)
9.1.2 constructor方法
9.1.3 類的實(shí)例
9.1.4 取值函數(shù)(getter)和存值函數(shù)(setter)
9.1.5 屬性表達(dá)式
9.1.6 Class表達(dá)式
9.1.7 注意點(diǎn)
1.嚴(yán)格模式
2.不存在提升
3.name屬性
4.Generator方法
5.this的指向
9.2 靜態(tài)方法
9.3 實(shí)例屬性的新寫法
9.4 靜態(tài)屬性
9.5 私有方法和私有屬性
9.5.1現(xiàn)有的解決方案
9.5.2 私有屬性的提案
9.6 new.target 屬性
10 Class的繼承
10.1 簡(jiǎn)介
10.2 Object.getPrototypeOf() 方法獲取父類
10.3 super關(guān)鍵字
11 Module的語(yǔ)法
11.1 概述
11.2 嚴(yán)格模式
? 變量必須聲明后再使用
? 函數(shù)的參數(shù)不能有同名屬性瘫镇,否則報(bào)錯(cuò)
? 不能使用with語(yǔ)句
? 不能對(duì)只讀屬性賦值,否則報(bào)錯(cuò)
? 不能使用前綴 0 表示八進(jìn)制數(shù)答姥,否則報(bào)錯(cuò)
? 不能刪除不可刪除的屬性铣除,否則報(bào)錯(cuò)
? 不能刪除變量delete prop,會(huì)報(bào)錯(cuò)鹦付,只能刪除屬性delete global[prop]
? eval不會(huì)在它的外層作用域引入變量
? eval和arguments不能被重新賦值
? arguments不會(huì)自動(dòng)反映函數(shù)參數(shù)的變化
? 不能使用arguments.callee
? 不能使用arguments.caller
? 禁止this指向全局對(duì)象
? 不能使用fn.caller和fn.arguments獲取函數(shù)調(diào)用的堆棧
? 增加了保留字(比如protected尚粘、static和interface)
11.3 export 命令
11.4 import 命令
11.5 模塊的整體加載
11.6 export default命令
11.7 export和import的復(fù)合寫法
11.8 模塊的繼承
11.9 跨模塊常量
11.10 import()
11.10.1 簡(jiǎn)介
11.10.2 import() 使用場(chǎng)合
? (1)按需加載
? (2)條件加載
11.10.3 注意點(diǎn)
12 Module的加載實(shí)現(xiàn)
12.1 瀏覽器加載
12.1.1 傳統(tǒng)方法
12.1.2 加載規(guī)則
? 補(bǔ)充資料