欧洲中文字幕,少妇精品一区

事件代理（事件委托）

由于事件會(huì)在冒泡階段向上傳播給父節(jié)點(diǎn)，因此可以把子節(jié)點(diǎn)的監(jiān)聽函數(shù)定義在父節(jié)點(diǎn)上，由父節(jié)點(diǎn)的監(jiān)聽函數(shù)統(tǒng)一處理多個(gè)子元素的事件。這種方法叫做事件的代理（delegation）。比如ul與li

定時(shí)器之setTimeout()

clearTimeout()：取消定時(shí)器

定時(shí)器之setInterval()

clearInterval()：取消定時(shí)器

閉包

特點(diǎn)：
1、函數(shù)嵌套函數(shù)
2、內(nèi)層函數(shù)可以訪問外層函數(shù)的變量和參數(shù)
作用：
1、防止變量和參數(shù)被垃圾回收機(jī)制回收
2、防止變量和參數(shù)被外部污染（變量只在閉包內(nèi)部可訪問）
風(fēng)險(xiǎn)：
濫用可能會(huì)造成內(nèi)存泄漏

防抖（debounce）

對(duì)于短時(shí)間內(nèi)連續(xù)觸發(fā)的事件（比如下面提到的滾動(dòng)事件），防抖的含義就是讓某個(gè)時(shí)間期限內(nèi)，事件處理函數(shù)只執(zhí)行一次

200ms時(shí)間未到的情況下，timer會(huì)重置定時(shí)。

節(jié)流

場(chǎng)景：
1、搜索框input事件，例如要支持輸入實(shí)時(shí)搜索可以使用節(jié)流方案（間隔一段時(shí)間就必須查詢相關(guān)內(nèi)容），或者實(shí)現(xiàn)輸入間隔大于某個(gè)值（如500ms），就當(dāng)作用戶輸入完成，然后開始搜索，具體使用哪種方案要看業(yè)務(wù)需求。
2、頁(yè)面resize事件，常見于需要做頁(yè)面適配時(shí)。需要根據(jù)最終呈現(xiàn)的頁(yè)面情況進(jìn)行dom渲染（這種情況一般是使用防抖，因?yàn)橹恍枰袛嘧詈笠淮蔚淖兓闆r）

命令行工具

1、 CMD

選擇盤符：如E：
查看盤符及目錄下文件與文件夾：dir
清空命令行信息：cls
進(jìn)入文件夾或目錄：cd 文件夾名
返回上一級(jí)目錄：cd ../或cd ..
快速補(bǔ)全目錄或文件夾名：tab
創(chuàng)建文件夾：mkdir 文件夾名稱
查看歷史輸入過的命令：上下按鈕

2、 PowerShell
一樣

Let命令

es6新增命令，用來聲明變量。它的用法類似于var，但是所聲明的變量只在let命令所在的代碼塊內(nèi)有效。

let塊級(jí)作用域（花括號(hào)級(jí)別的）

對(duì)比var和let在循環(huán)中的應(yīng)用

每次循環(huán)都是新的i，所以能的到想要的效果

let不存在變量提升
“var”命令會(huì)發(fā)生變量提升現(xiàn)象，即變量可以在聲明之前使用，值為undefined。這種現(xiàn)象多多少少是有些奇怪的，按照一定的邏輯，變量應(yīng)該在聲明語(yǔ)句之后才可以使用。
為了糾正這種現(xiàn)象，let命令改變了語(yǔ)法行為，它所聲明的變量一定要在聲明后使用，否則報(bào)錯(cuò)。

let不允許重復(fù)聲明

Const命令

一旦聲明，不可改變。
必須初始化，不能留到以后賦值。
const與let作用域一樣，塊級(jí)作用域
不存在變量提升
不能重復(fù)聲明

對(duì)象解構(gòu)賦值

簡(jiǎn)化上述user.name……的方式，利用解構(gòu)賦值

注意：對(duì)象的屬性沒有次序，變量必須與屬性同名才能取到正確的值。

方法也適用

字符串?dāng)U展

字符串遍歷器接口
for...of循環(huán)遍歷

模板字符串

字符串新增方法

include()、startsWith()、endsWith()

repeat()

padStart()、padEnd()

trimStart()、trimEnd()

at()

數(shù)組擴(kuò)展——擴(kuò)展運(yùn)算符

替代函數(shù)的apply方法

合并數(shù)組

image.png

數(shù)組擴(kuò)展——新增方法

Array.from()
arguments：默認(rèn)情況下是可以在無參函數(shù)中傳遞參數(shù)的，使用arguments讀取。

元素集合

類似數(shù)組的對(duì)象

Array.of()

對(duì)象的擴(kuò)展

屬性的簡(jiǎn)潔表示法

屬性名表達(dá)式

對(duì)象的擴(kuò)展運(yùn)算符

函數(shù)的擴(kuò)展——箭頭函數(shù)

箭頭函數(shù)的一個(gè)作用就是簡(jiǎn)化回調(diào)函數(shù)（匿名函數(shù)）

注意：對(duì)于普通函數(shù)來說，內(nèi)部的this指向函數(shù)運(yùn)行時(shí)所在的對(duì)象，但是這一點(diǎn)對(duì)箭頭函數(shù)不成立。它沒有自己的this對(duì)象，內(nèi)部的this就是定義時(shí)上層作用域的this

Set

size

add()

delete()

has()

image.png

clear()

Promise

Promise是異步編程的一種解決方案。
所謂Promise，簡(jiǎn)單說就是一個(gè)容器，里面保存著某個(gè)未來才會(huì)結(jié)束的事件（通常是一個(gè)異步操作）的結(jié)果。從語(yǔ)法上說，Promise是一個(gè)對(duì)象，從它可以獲取異步操作的信息。Promise提供統(tǒng)一的API，各種異步操作都可以用同樣的方法進(jìn)行處理。
有了Promise對(duì)象，就可以將異步操作以同步操作的流程表達(dá)出來，避免了層層嵌套的回調(diào)函數(shù)。此外，Promise對(duì)象提供統(tǒng)一的接口，使得控制異步操作更加容易。

基本用法

<script>
        var box = document.getElementById("box")

        function loadImageAsync(url){
            const promise = new Promise(function(resolve,reject){
                //異步處理
                const image = new Image()//創(chuàng)建Image對(duì)象
                image.src = url
                image.onload = function(){
                    resolve(image)
                }
                image.onerror = function(){
                    reject(new Error('Could not load image at'+ url))
                }
            })

            return promise
        }

        const promise = loadImageAsync("https://img0.baidu.com/it/u=3233991184,2570354199&fm=253&fmt=auto&app=120&f=JPEG?w=750&h=500")
        promise.then(function(data){
            //成功
            box.appendChild(data)
        },function(error){
            //失敗
            box.innerHTML = "圖片加載失敗"
        })
    </script>

Async函數(shù)

使得異步操作更加方便
可以將異步操作變?yōu)橥讲僮?，也就是不管前面或中間是否有異步耗時(shí)操作，都會(huì)按順序執(zhí)行。

await還會(huì)直接將promise中的而結(jié)果提取出來，不用再調(diào)用then方法。

Class的基本語(yǔ)法

ES5中類的寫法

ES6中類的寫法

constructor方法

constructor()方法是類的默認(rèn)方法，通過new命令生成對(duì)象實(shí)例，自動(dòng)調(diào)用該方法。一個(gè)類必須有constructor()方法，如果沒有顯式定義，一個(gè)空的constructor()方法會(huì)被默認(rèn)添加。