摘要：前端筆記基本數(shù)據(jù)類(lèi)型種數(shù)據(jù)類(lèi)型基本類(lèi)型復(fù)雜類(lèi)型基本類(lèi)型與引用類(lèi)型的區(qū)別基本類(lèi)型基本類(lèi)型，是按值訪(fǎng)問(wèn)，可以操作保存在變量中的實(shí)際值基本類(lèi)型的值不可變輸出輸出其中的實(shí)際值并未變化，方法是返回了一個(gè)新的字符串也不能對(duì)基本類(lèi)型添加屬性和方法表明了基

基本類(lèi)型: Undefined、Null、Boolean、String、Number

復(fù)雜類(lèi)型: Object

基本類(lèi)型(String、Boolean、Number、null、undefined)，是按值訪(fǎng)問(wèn)，可以操作保存在變量中的實(shí)際值

基本類(lèi)型的值不可變

var name = "jobs"
console.log(name.toUpperCase()) // 輸出JOBS
console.log(name) // 輸出jobs
name.age = 20
name.say = function() {……}
console.log(name.age) // undefined
console.log(name.say) // undefined
// 其中name的實(shí)際值并未變化，toUpperCase()方法是返回了一個(gè)新的字符串,也不能對(duì)基本類(lèi)型添加屬性和方法,表明了基本類(lèi)型的值不可變

基本類(lèi)型的比較是值的比較,只有在值相等時(shí)才相等

基本類(lèi)型的變量存放在棧區(qū)

var name = "jobs"
var age = 20

棧區(qū)包含了變量的標(biāo)識(shí)符和值

基本類(lèi)型復(fù)制

var a = 10
var b = a
a++
console.log(a, b) // 11 10
// 基本類(lèi)型在復(fù)制操作后變量是相互獨(dú)立的互不影響

就是除了基本類(lèi)型外的Object類(lèi)型

引用類(lèi)型值可以變，可以有屬性和方法

var person = {} // 創(chuàng)建個(gè)控對(duì)象 --引用類(lèi)型
person.name = "jozo"
person.age = 22
person.sayName = function(){console.log(person.name)} 
person.sayName() // "jozo"
delete person.name // 刪除person對(duì)象的name屬性
person.sayName() // undefined

// 引用類(lèi)型的值是同時(shí)保存在棧內(nèi)存和堆內(nèi)存中的對(duì)象

棧區(qū)內(nèi)存保存變量的標(biāo)識(shí)符和指向堆內(nèi)存中該對(duì)象的指針也就是該對(duì)象在堆內(nèi)存中的地址

var person1 = {name:"jozo"}
var person2 = {name:"xiaom"}
var person3 = {name:"xiaoq"}

引用類(lèi)型比較是引用的比較

var p1 = {} 
var p2 = {}
console.log(p1 == p2) // false
// 引用類(lèi)型是按引用訪(fǎng)問(wèn)的，所以是比較它們的堆內(nèi)存中地址是否相同

對(duì)象引用

var a = {} // 新建空對(duì)象
var b = a // 賦值后a和b指向同一個(gè)空對(duì)象
a.name = "jobs"
b.age = 20
console.log(a.name, a.age, b.name, b.age) // jobs 20 jobs 20
// 引用類(lèi)型的復(fù)制是對(duì)象保存在棧區(qū)的堆內(nèi)存的地址的復(fù)制,兩個(gè)變量實(shí)際上指向同一個(gè)對(duì)象,因此任何操作都會(huì)互相影響

所有函數(shù)的參數(shù)都是按值傳遞

var p1 = {
    name: "Vian"
}
var setName = function(obj) {
    obj.name = "jobs"
    return obj
}
var res = setName(p1)
console.log(p1.name) // jobs
console.log(res.name) // jobs

// 把p1傳入setName()中，obj和p1指向同一個(gè)對(duì)象，修改obj的name值其實(shí)是修改了它們共同指向的對(duì)象的name值

var p = {
    name: "alice"
}

var set = function(ot) {
    ot = {}
    ot.name = "tom"
    return ot
}

var re = set(p)
console.log(p.name) // alice
console.log(re.name) // tom

// 在函數(shù)內(nèi)部ot新定義了一個(gè)對(duì)象,obj引用了一個(gè)局部對(duì)象，外部p和內(nèi)部ot指向了不同對(duì)象，所以不會(huì)影響

Object類(lèi)型

new操作符跟隨Object構(gòu)造函數(shù)

var person = new Object()
person.name = "alice"

對(duì)象字面量表示法

var person = {
    name: "alice",
    "age": 20
}

屬性名也能使用字符串  
訪(fǎng)問(wèn)對(duì)象屬性一般使用點(diǎn)語(yǔ)法，但js中也能使用方括號(hào)語(yǔ)法，并且可以使用變量訪(fǎng)問(wèn)屬性

  alert(person.name) // alice
  alert(person["name"]) // alice
  var personName = "name"
  alert(person[personName]) // alice

Array類(lèi)型

數(shù)組每一項(xiàng)都可以保存任何類(lèi)型的數(shù)據(jù)，而且數(shù)組大小可以動(dòng)態(tài)調(diào)整，跟隨數(shù)據(jù)的添加而自動(dòng)增長(zhǎng)

創(chuàng)建數(shù)組的方法

var arr = new Array() // 使用Array構(gòu)造函數(shù)

var arr = [] // 使用數(shù)組字面量表示法

length屬性

length總會(huì)返回大于0的整數(shù)，而且它不是只讀屬性

當(dāng)設(shè)置length的值小于當(dāng)前的數(shù)組長(zhǎng)度時(shí)，會(huì)從末尾開(kāi)始刪減元素

當(dāng)設(shè)置length為大于當(dāng)前數(shù)組長(zhǎng)度時(shí)，則會(huì)從末尾新增項(xiàng)，新增每一項(xiàng)的值都為undefined

檢測(cè)數(shù)組

對(duì)只有一個(gè)全局作用域而言，使用instanceof操作符便可以

if (arr instanceof Array) {
    // 對(duì)數(shù)組的操作
}

// instanceof操作符問(wèn)題在于，它假定單一的全局執(zhí)行環(huán)境。若網(wǎng)頁(yè)中包含不同框架，那么實(shí)際上會(huì)有兩個(gè)以上不同的全局執(zhí)行環(huán)境，從而存在兩個(gè)以上不同的Array構(gòu)造函數(shù)

Array.isArray()方法來(lái)判斷

if (Array.isArray(arr)) {
      // 對(duì)數(shù)組的操作
  }

數(shù)組常用方法

棧方法：

push(): 可接受任意個(gè)參數(shù)，逐個(gè)添加到數(shù)組末尾，并返回修改后數(shù)組長(zhǎng)度

pop(): 從數(shù)組末尾移除最后一項(xiàng)，減少length的值，然后返回移除的項(xiàng)

隊(duì)列方法：

unshift(): 在數(shù)組前面添加任意個(gè)項(xiàng)，并返回新數(shù)組的長(zhǎng)度

shift(): 移除數(shù)組第一個(gè)項(xiàng)，減少length的值，并返回移除的項(xiàng)

排序方法：

reverse(): 反轉(zhuǎn)數(shù)組項(xiàng)的順序

sort(): 默認(rèn)升序排列，可接收一個(gè)比較函數(shù)作為參數(shù)，比較函數(shù)有兩個(gè)參數(shù)，若第一個(gè)參數(shù)要在第二個(gè)參數(shù)之前，則返回負(fù)數(shù)，相等則返回0，若第一個(gè)參數(shù)要在第二個(gè)參數(shù)之后，則返回正數(shù)

> sort()會(huì)調(diào)用每項(xiàng)的toString()轉(zhuǎn)型方法，比較字符串，即使是數(shù)值也會(huì)轉(zhuǎn)型后比較字符串，因此[0, 1, 5, 10, 15]使用這個(gè)方法會(huì)變成[0, 1, 10, 15, 5]

操作方法

concat(): 可接收數(shù)組、等作為參數(shù)，將數(shù)組合并

var color1 = ["pink", "yellow"]
var color2 = color1.concat("skyblue", ["black", "orange"])
console.log(color1) // pink,yellow
console.log(color2) // pink,yellow,skyblue,black,orange

* `join()`: 可接受一個(gè)參數(shù)作為分隔符,將數(shù)組轉(zhuǎn)換為字符串

* `slice()`: 基于當(dāng)前數(shù)組創(chuàng)建一個(gè)新數(shù)組，接受一個(gè)或者兩個(gè)參數(shù)，起始位置和結(jié)束位置，不會(huì)影響當(dāng)前數(shù)組。

> 若只有一個(gè)參數(shù)，則返回從該參數(shù)位置開(kāi)始到末尾所有的項(xiàng)
> 若兩個(gè)參數(shù)則返回起始位置到結(jié)束位置之間的項(xiàng)，但不包括結(jié)束位置

splice(): 主要作用向數(shù)組中插入項(xiàng)，始終返回一個(gè)數(shù)組，數(shù)組為原數(shù)組中刪除的項(xiàng)，若沒(méi)有則返回一個(gè)空數(shù)組，可以有三種用途

- 刪除：刪除任意數(shù)量的項(xiàng)，接受2個(gè)參數(shù)：要?jiǎng)h除的第一項(xiàng)的位置和要?jiǎng)h除的個(gè)數(shù)
- 插入：在指定位置插入任意數(shù)量的項(xiàng)，接受3個(gè)參數(shù)：起始位置、0(要?jiǎng)h除的項(xiàng)數(shù)、要插入的項(xiàng))，如果要插入多個(gè)項(xiàng)，可以再傳入第四個(gè)，五個(gè)，任意個(gè)項(xiàng)
- 替換: 可以在任意位置插入任意項(xiàng)，同時(shí)刪除任意項(xiàng)，接受3個(gè)參數(shù)：起始位置、要?jiǎng)h除的項(xiàng)數(shù)、要插入的項(xiàng)

位置方法

indexOf()和lastIndexOf()

都接受2個(gè)參數(shù)：要查找的項(xiàng)和(可選)表示查找起點(diǎn)位置的索引，indexOf()從頭開(kāi)始找，lastIndexOf()從末尾開(kāi)始找

都返回要查找的項(xiàng)在數(shù)組中的位置，沒(méi)找到則返回-1，并且查找時(shí)是使用全等操作符(===)

迭代方法

共有五個(gè)迭代方法，每個(gè)方法都接受兩個(gè)參數(shù)：要在每一項(xiàng)上運(yùn)行的函數(shù)和(可選的)運(yùn)行該函數(shù)的作用域?qū)ο蟆绊憈his的值。傳入這些方法中的函數(shù)接收三個(gè)參數(shù)：數(shù)組項(xiàng)的值、該項(xiàng)在數(shù)組中的位置和數(shù)組對(duì)象本身

every(): 對(duì)數(shù)組每一項(xiàng)運(yùn)行給定函數(shù)，若該函數(shù)對(duì)每一項(xiàng)都返回true，則返回true

some(): 對(duì)數(shù)組每一項(xiàng)運(yùn)行給定函數(shù)，若該函數(shù)對(duì)任意一項(xiàng)返回true，則返回true

filter(): 對(duì)數(shù)組每一項(xiàng)運(yùn)行給定函數(shù)，返回該函數(shù)會(huì)返回true的項(xiàng)組成的數(shù)組

map(): 對(duì)數(shù)組每一項(xiàng)運(yùn)行給定函數(shù)，返回每次函數(shù)調(diào)用結(jié)果組成的數(shù)組

forEach(): 對(duì)數(shù)組每一項(xiàng)運(yùn)行給定函數(shù)，沒(méi)有返回值

以上方法都不會(huì)修改數(shù)組中的包含的值

var numbers = [1, 3, 5, 7, 9, 2, 4, 6, 8, 0]

// every
var a1 = numbers.every(function(item, index, array) {
    return item > 2
})
console.log(a1) // false

// some
var a2 = numbers.some(function(item, index, array) {
    return item > 8
})
console.log(a2) // true

// filter
var a3 = numbers.filter(function(item, index, array) {
    return item % 2 === 0
})
console.log(a3) // [2, 4, 6, 8, 0]

// map
var a4 = numbers.map(function(item, index, array) {
    return item * 2
})
console.log(a4) // [2, 6, 10, 14, 18, 4, 8, 12, 16, 0]

// forEach
/*
沒(méi)有返回值和for循環(huán)迭代數(shù)組一樣
*/

reduce

reduce(function(total, currentValue [,currentIndex]) [,initialValue]): 是一種數(shù)組運(yùn)算，通常用于將數(shù)組的所有成員"累積"為一個(gè)值。

    - total：必選,初始值或者累積變量
    - currentValue：必選,當(dāng)前元素
    - currentIndex：可選,當(dāng)前元素的索引
    - initialValue：可選，傳遞給函數(shù)的初始值
- 基本用法

/**
* reduce(function(total, currentValue, currentIndex) [,initialValue]) 用于數(shù)組計(jì)算，通常用于將數(shù)組累積為一個(gè)值
*/

/**
* 參數(shù)tmp是累積變量，item為當(dāng)前數(shù)組成員，index為數(shù)組下標(biāo)；每次運(yùn)行時(shí)item會(huì)累加到tmp，最后輸出tmp
*/
let arr = [1, 2, 3, 4, 5, 6];

let sum = arr.reduce((tmp, item, index) => tmp + item);

console.log(sum); // 21

- map是reduce的特例

/*
 *map是reduce的特例
 累積變量的初始值可以是一個(gè)數(shù)組，例子中初始值是一個(gè)空數(shù)組，結(jié)果返回一個(gè)新的數(shù)組，等同于map操作；map操作都可以用reduce，所以map是reduce的特例
 */
let handler = (newArr, x) => {
    newArr.push(x + 1);
  return newArr;
}

let arr2 = arr.reduce(handler, []);
console.log(arr2); // [ 2, 3, 4, 5, 6, 7 ]

數(shù)組排序常見(jiàn)方法

    var arr = [1, 10, 3, 8, 5, 9, 4, 6];

/*冒泡排序*/
    function pops(arr) {
        for (var i = 0; i < arr.length; i++) {
            for (var j = 0; j < arr.length - 1 - i; j++) {
                if (arr[j] > arr[j + 1]) {
                    var temp = arr[j];
                    arr[j] = arr[j + 1];
                    arr[j + 1] = temp;
                }
            }
        }
        return arr;
    }

    console.log(pops(arr));

/*快速排序*/
    function quick(arr) {
        if (arr.length <= 1) {
            return arr;
        }

        var len = Math.floor(arr.length / 2);
        var aj = arr.splice(len, 1);
        var left = [];
        var right = [];

        for (var i = 0; i < arr.length; i++) {
            if (arr[i] < aj) {
                left.push(arr[i]);
            } else {
                right.push(arr[i]);
            }
        }

        return quick(left).concat(aj, quick(right));
    }

    console.log(quick(arr));

Date類(lèi)型

Error類(lèi)型

try/catch/finally

try {
    tryCode - 嘗試執(zhí)行代碼塊
}
catch(err) {
    catchCode - 捕獲錯(cuò)誤的代碼塊
} 
finally {
    finallyCode - 無(wú)論 try / catch 結(jié)果如何都會(huì)執(zhí)行的代碼塊
}

// 如果使用了try那么catch和finally必須選一個(gè)

RegExp類(lèi)型

概述

通過(guò)RegExp類(lèi)型來(lái)支持正則表達(dá)式，使用類(lèi)似Perl的語(yǔ)法來(lái)創(chuàng)建正則表達(dá)式

 var expression = / pattern / flags;

其中模式(pattern)可以是任何簡(jiǎn)單或復(fù)雜的正則表達(dá)式，每個(gè)正則表達(dá)式可以有一個(gè)或者多個(gè)標(biāo)志(flags)，用以標(biāo)明正則表達(dá)式的行為，匹配模式有以下三個(gè)標(biāo)志.

g：全局模式，模式將被用于整個(gè)字符串而非在發(fā)現(xiàn)第一個(gè)匹配項(xiàng)時(shí)立即停止

i：不區(qū)分大小寫(xiě)模式，即在匹配時(shí)忽略大小寫(xiě)

m：多行模式，即在到達(dá)一行文字末尾時(shí)還會(huì)繼續(xù)查找下一行中是否存在與模式匹配的項(xiàng)

實(shí)例方法

exec(): 接受一個(gè)參數(shù)，即要使用模式的字符串

返回包含第一個(gè)匹配項(xiàng)的信息的數(shù)組，額外附帶2個(gè)屬性index和input，index表示匹配項(xiàng)在字符串中的位置，input表示應(yīng)用正則表達(dá)式的字符串，若沒(méi)有匹配項(xiàng)返回null

對(duì)于exec()而言即使在模式匹配設(shè)置了全局標(biāo)志(g)，也只會(huì)返回第一個(gè)匹配項(xiàng)，在不設(shè)置時(shí)，在同一字符串上多次調(diào)用也只會(huì)始終返回第一個(gè)匹配項(xiàng)的信息；而設(shè)置了，則每次調(diào)用都會(huì)繼續(xù)匹配新的項(xiàng)

test():接受一個(gè)字符串參數(shù)，在模式與該參數(shù)匹配的情況下返回true否則返回false

Function 類(lèi)型

函數(shù)其實(shí)是對(duì)象，每一個(gè)函數(shù)都是Function的實(shí)例，因此函數(shù)名實(shí)際上也是一個(gè)指向函數(shù)對(duì)象的指針，不會(huì)與函數(shù)綁定

函數(shù)聲明與函數(shù)表達(dá)式

解析器對(duì)函數(shù)聲明和函數(shù)表達(dá)式有差別對(duì)待

解析器會(huì)先讀取函數(shù)聲明，并使其在執(zhí)行任何代碼前可用(可以訪(fǎng)問(wèn))；至于函數(shù)表達(dá)式，則必須等到解析器執(zhí)行到所在代碼行才會(huì)真正被解析

// 函數(shù)聲明
console.log(sum(10, 10)) // 20

function sum(a, b) {
    return a + b
}

// 函數(shù)表達(dá)式
console.log(add(10, 10)) // 報(bào)錯(cuò)

var add = function(a, b) {
    return a + b
}

函數(shù)聲明，在代碼開(kāi)始執(zhí)行前，解析器通過(guò)一個(gè)名為函數(shù)聲明提升的過(guò)程，讀取并將函數(shù)聲明添加到執(zhí)行環(huán)境中，并放到源代碼樹(shù)的頂端，因此可以先調(diào)用再定義

函數(shù)表達(dá)式，函數(shù)位于一個(gè)初始化語(yǔ)句中，也就是在執(zhí)行到函數(shù)代碼前，變量不會(huì)保存有對(duì)函數(shù)的引用

函數(shù)內(nèi)部屬性

在函數(shù)內(nèi)部有兩個(gè)特殊對(duì)象arguments和this

arguments是一個(gè)類(lèi)數(shù)組對(duì)象，保存著函數(shù)的所有參數(shù)；它還有一個(gè)callee屬性，它是一個(gè)指針，指向擁有這個(gè)arguments對(duì)象的函數(shù)

callee

function factorial(num) {
    if (num <= 1) {
        return 1
    } else {
        return num * arguments.callee(num - 1)
        /* arguments.callee即是factorial函數(shù) */
    }
}

console.log(factorial(10)) // 3628800

caller，es5中定義的函數(shù)對(duì)象屬性，返回一個(gè)調(diào)用當(dāng)前函數(shù)的引用,如果是由頂層調(diào)用的話(huà),則返回null

function a() {
    console.log(arguments.callee.caller) 
      // 因?yàn)閍rguments.callee就是函數(shù)a，所以arguments.callee.caller等于a.caller
}

function b() {
    a()
}

a() // null 因?yàn)槭琼攲诱{(diào)用
b() // b函數(shù)的源代碼

this，this引用的是(this的值)函數(shù)據(jù)以執(zhí)行的環(huán)境對(duì)象，在網(wǎng)頁(yè)全局作用域中調(diào)用函數(shù)時(shí)候this的引用對(duì)象就是window

函數(shù)的屬性和方法

每個(gè)函數(shù)都包含兩個(gè)屬性：length和prototype

length: 形參個(gè)數(shù)

prototype: 原型

每個(gè)函數(shù)包含兩個(gè)非繼承而來(lái)的方法: apply()和call();

作用都是在特定作用域中調(diào)用函數(shù)，實(shí)際上等于設(shè)置this的值

apply():接收2個(gè)參數(shù)，一個(gè)是在其中運(yùn)行的函數(shù)的作用域，一個(gè)是Array實(shí)例或者arguments對(duì)象

call():接收2個(gè)參數(shù)，一個(gè)是在其中運(yùn)行的函數(shù)的作用域，其余參數(shù)要直接傳遞給函數(shù)，也就是逐一列舉

function sum1(a, b) {
    return a + b
}

function sum2(a, b) {
    var s1 = sum1.apply(this, arguments) // arguments對(duì)象
    var s2 = sum1.apply(this, [a, b]) // Array實(shí)例
    console.log(s1, s2)
}

sum2(10, 10) //20 20

function sum3(a, b) {
    return sum1.call(this, a, b) // 參數(shù)逐一傳入
}

console.log(sum3(10, 10)) // 20

apply()和call(),真正的用武之地并不在于傳遞參數(shù)，而是擴(kuò)充函數(shù)賴(lài)以運(yùn)行的作用域

var color = "blue"
var o = {
    color: "pink"
}

function sayColor() {
    console.log(this.color)
}

/* this指向了全局作用域window */
sayColor() // blue
sayColor(this) // blue
sayColor(window) // blue

/* this指向了o */
sayColor.apply(o) // pink
sayColor.call(o) // pink

bind(): 它會(huì)創(chuàng)建一個(gè)函數(shù)的實(shí)例，其this的值會(huì)被綁定到傳給bind函數(shù)的值

var colors = "skyblue"
var c = {
    colors: "orange"
}

function say() {
    console.log(this.colors)
}

var say2 = say.bind(c)
say2() // orange

bind與apply、call不同，不會(huì)立刻執(zhí)行

Boolean類(lèi)型

暫無(wú)

Number類(lèi)型

toFixed(): 接受一個(gè)參數(shù),代表保留幾位小數(shù),會(huì)四舍五入

var num = 10
console.log(num.toFixed(2)) // 10.00

String類(lèi)型

string包含length屬性,返回字符串長(zhǎng)度

字符串方法

字符方法

charAt()和charCodeAt():這兩個(gè)方法都接收一個(gè)參數(shù),即基于0的字符的位置.其中charAt()以單字符字符串的形式返回給定位置的字符,而charCodeAt()則是返回編碼

var stringTXT = "hellow"
console.log(stringTXT.charAt(3)) // l
console.log(stringTXT.charCodeAt(3)) // 108

字符串操作方法

concat():用于將一個(gè)或多個(gè)字符串拼接起來(lái)

slice(),substr(),substring():這三個(gè)方法都返回被操作字符串的子字符串,也都接受一或兩個(gè)參數(shù),第一個(gè)參數(shù)指定開(kāi)始位置,第二個(gè)指定結(jié)束位置;slice和substring的第二個(gè)參數(shù)指定的是子字符串的最后一個(gè)字符后面的位置,substr的第二個(gè)參數(shù)則是指定返回字符的個(gè)數(shù)

var txt = "abcdefg"
console.log(txt.slice(1, 3)) // bc
console.log(txt.substring(1, 3)) // bc
console.log(txt.substr(1, 3)) // bcd

位置方法

indexOf()和lastIndexOf():這兩個(gè)方法接受2個(gè)參數(shù),第一個(gè)為要查找的字符串,(可選)第二個(gè)表示查找起點(diǎn)位置的索引,都是從字符串中尋找指定的字符串,然后返回該字符串的位置,若沒(méi)有則返回-1,一個(gè)從頭開(kāi)始找,一個(gè)從末尾開(kāi)始找

大小寫(xiě)轉(zhuǎn)換

toLowerCase()和toUpperCase():全部轉(zhuǎn)換成小寫(xiě),大寫(xiě)

toLocaleLowerCase()和toLocaleUpperCase():全部轉(zhuǎn)換成小寫(xiě),大寫(xiě),這是根據(jù)特定地區(qū)來(lái)轉(zhuǎn)換大小寫(xiě),在不知道代碼運(yùn)行在哪個(gè)語(yǔ)言的情況下使用

字符串的模式匹配方法

match():接受一個(gè)參數(shù),參數(shù)為正則表達(dá)式或者RegExp對(duì)象,返回一個(gè)數(shù)組,數(shù)組保存著每一個(gè)匹配的子字符串

var txt = "abcdefgabcdefgabcdefg"
var reg = /ab/gi
console.log(txt.match(reg)) // ["ab", "ab", "ab"]

search():接受一個(gè)參數(shù),參數(shù)為正則表達(dá)式或者RegExp對(duì)象,從頭開(kāi)始匹配,返回第一個(gè)匹配項(xiàng)的索引,沒(méi)有則返回-1

replace():接收2個(gè)參數(shù),字符串或者正則表達(dá)式或者RegExp對(duì)象,第二個(gè)則是用于替換的字符串或者函數(shù);若第一個(gè)參數(shù)為字符串則只會(huì)替換第一個(gè)子字符串,要想替換所有,則必須是正則表達(dá)式,并且指定全局標(biāo)志(g);若第二個(gè)參數(shù)是函數(shù),則給這個(gè)函數(shù)傳入的三個(gè)參數(shù)分別是匹配項(xiàng)第一個(gè)匹配項(xiàng),第二個(gè)等等,最后兩個(gè)參數(shù)為匹配項(xiàng)的位置和原始字符串

split():將字符串以指定分隔符分割成字符串,分隔符可以是字符串也可以是正則表達(dá)式或者RegExp對(duì)象;也可以接受第二個(gè)參數(shù),用于指定數(shù)組大小

Global對(duì)象

URI編碼方法

encodeURI():主要用于整個(gè)uri,它不會(huì)對(duì)本身屬于uri的特殊字符進(jìn)行編碼如冒號(hào)、正斜杠、問(wèn)好、井號(hào)

encodeURIComponent():主要用于對(duì)其中一段進(jìn)行編碼,它會(huì)對(duì)任何非標(biāo)準(zhǔn)字符進(jìn)行編碼

var uri = "http://www.who.com/search?wd=123"
console.log(encodeURI(uri))
// 結(jié)果: http://www.who%08.com/search?wd=123
console.log(encodeURIComponent(uri))
// 結(jié)果: http%3A%2F%2Fwww.who%08.com%2Fsearch%3Fwd%3D123

encodeURIComponent使用的比encodeURI多

decodeURI():解碼方法,只能對(duì)encodeURI()編碼的進(jìn)行解碼

decodeURIComponent():解碼方法,可以解碼所有字符

eval

eval():這個(gè)方法像是一個(gè)完整的ECMAScript解析器,它接受一個(gè)字符串參數(shù),就是要執(zhí)行的js代碼字符串

Math對(duì)象

常用屬性

Math.PI: π的值

常用方法

求極值

min(),max():求最小,最大值;可以接受任意個(gè)參數(shù)

舍入方法

ceil():向上求整

floor():向下求整

round():四舍五入

隨機(jī)值

random(): 返回一個(gè)0-1之間的隨機(jī)數(shù),但不包含0和1,從區(qū)間內(nèi)取一個(gè)值,可以用一下公式

(max - min) * Math.random() + min

絕對(duì)值

abs(): 絕對(duì)值

次方

pow(a, n): 第一個(gè)為底，第二個(gè)參數(shù)為次方值,a的n次方

(undefined，number，string，boolean)屬于簡(jiǎn)單的值類(lèi)型，不是對(duì)象。函數(shù)、數(shù)組、對(duì)象、null、構(gòu)造函數(shù)都是對(duì)象，都是引用類(lèi)型判斷一個(gè)變量是不是對(duì)象，值類(lèi)型用typeof，引用類(lèi)型用instanceof

在js中數(shù)組、函數(shù)、對(duì)象都是對(duì)象，對(duì)象里面一切都是屬性，只有屬性，沒(méi)有方法; 方法也是一種屬性

對(duì)象都是通過(guò)函數(shù)創(chuàng)建的，函數(shù)是對(duì)象

function F() {
  this.name = "jobs"
}

var f1 = new F() // 對(duì)象可以通過(guò)函數(shù)創(chuàng)建
var arr = [1, 2, 3] // 語(yǔ)法糖，本質(zhì)是下面的簡(jiǎn)寫(xiě)

var arr = new Array() // Array是構(gòu)造函數(shù)
arr[0] = 1
arr[1] = 2
arr[2] = 3

prototype原型

函數(shù)默認(rèn)有一個(gè)prototype屬性，prototype屬性的值是一個(gè)對(duì)象（屬性的集合），默認(rèn)只有一個(gè)constructor屬性指向這個(gè)函數(shù)本身

[image:DF9C0DF3-83B1-4F0C-8F2B-39C112BA24F6-1188-00000B31D26AD3B2/prototype-1.png]

如圖所示，superType是一個(gè)函數(shù)，右邊是原型

原型作為對(duì)象，屬性的集合，可以自定義許多屬性，例如Object，里面包含了其他幾個(gè)屬性

[image:C2050E95-6407-4A59-9B93-D6F7081CD863-1188-00000B3DEE188E44/instanceof-2.png]

可以在自定義的方法的prototype中新增自己的屬性

function Fn() {

Fn.prototype.name = "王福鵬"
Fn.prototype.getYear = function() {
    return 1988
}

}

[image:E2D062D3-B7D0-457C-97D2-6607E729A1C5-1188-00000B470B9F9F19/prototype-3.png]

function Fn() {
    Fn.prototype.name = "王福鵬"
    Fn.prototype.getYear = function() {
        return 1988
    }
}

var f1 = new Fn()
console.log(f1.name) // 王福鵬
console.log(f1.getYear()) // 1988
console.log(f1.__proto__ === Fn.prototype) // true

上述代碼，f1對(duì)象是從Fn中new出來(lái)的，這樣f1就可以調(diào)用Fn中的屬性，因?yàn)槊總€(gè)對(duì)象都有一個(gè)隱藏屬性"__proto__",這個(gè)屬性引用了創(chuàng)建這個(gè)對(duì)象的函數(shù)的prototype，所以f1.__proto__ === Fn.prototype,這里的"__proto__"成為隱式原型

__proto__是瀏覽器提供的屬性,就是[[prototype]]這個(gè)隱藏屬性,__proto__因?yàn)椴皇且?guī)范屬性,所以要避免使用;

es5中用Object.getPrototypeOf(obj)函數(shù)獲得一個(gè)對(duì)象的[[prototype]]

es6中用Object.setPrototypeOf(obj, prototype)函數(shù)可以直接修改一個(gè)對(duì)象的[[prototype]]

參數(shù)obj將被設(shè)置原型的對(duì)象.

prototype該對(duì)象新的原型(可以是一個(gè)對(duì)象或者null).

每個(gè)對(duì)象都有一個(gè)__proto__，可稱(chēng)為隱式原型

__proto__是一個(gè)隱藏屬性

var obj = {}
console.log(obj.__proto__ === Object.prototype)

有上述代碼可知：每個(gè)對(duì)象都有一個(gè)__proto__`屬性指向創(chuàng)建該對(duì)象的函數(shù)的prototype屬性

有一個(gè)特例Object.prototype.__proto__ === null

console.log(Function instanceof Function) // true
console.log(Function instanceof Object) // true
console.log(Object instanceof Function) // true
console.log(Object instanceof Object) // true

instanceof判斷規(guī)則是，沿著a的__proto__來(lái)找，沿著b的prototype來(lái)找，如果引用的同一個(gè)引用就返回true

[image:E4783050-568F-4369-A33E-192AE586FBE7-1188-00000B9545C250D1/instanceof-1.png]

即instanceof表示的就是一種繼承關(guān)系，或者原型鏈的結(jié)構(gòu)

[image:8826A813-C433-43DB-9C3D-CF0964451DDA-1188-00000B97B94D72D0/instanceof-2.png]

JavaScript的繼承是用原型鏈來(lái)體現(xiàn)的

function Foo() {}
var f1 = new Foo()

f1.a = 10

Foo.prototype.a = 100
Foo.prototype.b = 200

console.log(f1.a, f1.b) // 10 200

上述代碼，f1是Foo函數(shù)new出來(lái)的對(duì)象，f1.a是f1對(duì)象的基本屬性，而f1.b是從Foo.prototype得來(lái)的，因?yàn)?b>f1.__proto__指向Foo.prototype

訪(fǎng)問(wèn)一個(gè)對(duì)象的屬性時(shí)，現(xiàn)在基本屬性中查找，如果沒(méi)有，就沿著__proto__鏈向上查找，這就是原型鏈

如何區(qū)分一個(gè)屬性是基本的還是從原型中找到的，用hasOwnProperty

[image:802EAC7F-3F88-4EA9-A120-E988C06FB7B3-1188-00000B9C76399666/prototype-4.png]

f1中沒(méi)有hasOwnProperty方法，它是從Object.prototype而來(lái)的

[image:7231EB7A-F0A5-482E-9632-8C88F3FA7749-1188-00000BA5D0FE85B9/prototype-5.png]

對(duì)象的原型鏈都會(huì)找到Object.prototype，因此所有對(duì)象都有Object.prototype的方法，這就是繼承

上下文環(huán)境

[image:B0C9A9CF-FB04-4776-A2E5-AA72796DC573-1188-00000BA936740391/this-1.png]

- 第一句報(bào)錯(cuò)a未定義，二三句a為undefined，說(shuō)明在js代碼一句句執(zhí)行前，瀏覽器就已經(jīng)開(kāi)始一  些準(zhǔn)備工作,其中就包括對(duì)變量的聲明，而不是賦值，賦值操作是在運(yùn)行到語(yǔ)句時(shí)才執(zhí)行；

[image:2185D116-A4C9-41BC-BF30-92F3E57EC3B3-1188-00000BAD8E05AD77/this-2.png]

- 這是第一種情況

[image:DCC314B3-40D8-4F45-8DC1-72AB6A089648-1188-00000BB1A9090280/this-3.png]

- 第一種情況是對(duì)變量只聲明，未賦值；第二種直接賦值給了this;這也是‘準(zhǔn)備工作’之一

[image:88C73D7D-40A0-470F-81BE-B2651D40A767-1188-00000BB70805B00A/this-4.png]

- 在這里對(duì)函數(shù)表達(dá)式和普通變量賦值一樣，而函數(shù)聲明則立刻賦值了

準(zhǔn)備工作完成的事

變量、函數(shù)表達(dá)式 —— 變量聲明，默認(rèn)賦值為undefined

this —— 賦值

函數(shù)聲明 —— 賦值

這三種數(shù)據(jù)準(zhǔn)備情況就是‘執(zhí)行上下文’或者‘執(zhí)行上下文環(huán)境’

js在執(zhí)行代碼片段前都會(huì)進(jìn)行準(zhǔn)備工作來(lái)生成‘執(zhí)行上下文’，代碼片段分三種情況：全局代碼、函數(shù)體、eval代碼

在函數(shù)中，arguments和函數(shù)參數(shù)會(huì)直接賦值；函數(shù)每調(diào)用一次，都會(huì)產(chǎn)生一個(gè)新的執(zhí)行上下文環(huán)境；而且函數(shù)在定義的時(shí)候（不是調(diào)用的時(shí)候），就已經(jīng)確定函數(shù)體內(nèi)部自由變量的作用域

在執(zhí)行代碼之前，把將要用到的所有的變量都事先拿出來(lái)，有的直接賦值了，有的先用undefined占個(gè)空

全局代碼的上下文環(huán)境為

如果代碼片段是函數(shù)體，則在此基礎(chǔ)上附加

函數(shù)中this到底是什么值，是在函數(shù)真正被調(diào)用時(shí)確定的，函數(shù)定義時(shí)確定不了；this永遠(yuǎn)指向的是最后調(diào)用它的對(duì)象，也就是看它執(zhí)行的時(shí)候是誰(shuí)調(diào)用的；因?yàn)閠his取值是執(zhí)行上下文環(huán)境的一部分，每次調(diào)用都會(huì)產(chǎn)生一個(gè)新的執(zhí)行環(huán)境上下文

分四種狀況

構(gòu)造函數(shù)

  function F(num) {
    this.num = num
    this.log = "txt"
    console.log(this)
  } 

- 把函數(shù)作為構(gòu)造函數(shù)，那么this就是new出來(lái)的對(duì)象
- 函數(shù)作為對(duì)象的一個(gè)屬性
-  如果函數(shù)作為對(duì)象的一個(gè)屬性，并且作為對(duì)象的屬性被調(diào)用時(shí)，this指向該對(duì)象

  var obj = {
    x: 10,
    fn: function() {
        console.log(this) // {x:10, fn: function}
        console.log(this.x) // 10
    }
  }
  obj.fn()

- 函數(shù)調(diào)用call和apply，bind時(shí)調(diào)用
- 當(dāng)一個(gè)函數(shù)被call和apply調(diào)用時(shí)，this的值就取傳入的對(duì)象的值

  var obj = {
      x: 10
  }

  function fn() {
      console.log(this)
      console.log(this.x)
  }

  fn.call(obj) // {x: 10} 10
  fn.apply(obj) // {x: 10} 10
  var fns = fn.bind(obj)
  fns() // {x: 10} 10

全局和調(diào)用普通函數(shù)

this指向window

作用域

[image:C6407A7F-8B78-4A86-8C15-6697981F687C-1188-00000BFD4FA9B6C0/this-5.png]
[image:08320C13-AE3E-4C60-A615-25442AD209CA-1188-00000BFECEDB8EC1/this-6.png]

作用域中變量的值是在執(zhí)行過(guò)程中產(chǎn)生的確定的

如果要查找一個(gè)作用域下某個(gè)變量的值，就需要找到這個(gè)作用域?qū)?yīng)的執(zhí)行上下文環(huán)境，再在其中尋找變量的值

要到創(chuàng)建這個(gè)函數(shù)的那個(gè)作用域中取值——是“創(chuàng)建”，而不是“調(diào)用”，切記切記——其實(shí)這就是所謂的“靜態(tài)作用域”

作用域鏈

[image:12DFA8C1-973E-4680-A97D-C57F33ABEBCB-1188-00000C050C4391C4/this-7.png]

包含兩種數(shù)據(jù)屬性和訪(fǎng)問(wèn)器屬性

數(shù)據(jù)屬性包含一個(gè)數(shù)據(jù)值的位置，在這個(gè)位置可以讀取和寫(xiě)入值，數(shù)據(jù)屬性有4個(gè)描述其行為的特性

[[Configurable]]:表示能否通過(guò)delete刪除屬性，從而重新定義屬性，能否修改屬性特性，能否把屬性修改為訪(fǎng)問(wèn)器屬性

[[Enumerable]]:能否通過(guò)for-in循環(huán)返回屬性

[[Writable]]:能否修改屬性值

[[Value]]:包含這個(gè)屬性的數(shù)據(jù)值,默認(rèn)undefined

直接在對(duì)象上定義的屬性，它們的[[Configurable]]、[[Enumerable]]、[[Writable]]的值默認(rèn)為true，[[Value]]為指定值

  var p = { name: "nico" } // [[Value]]的值為 nico

要修改屬性默認(rèn)特性，必須使用es5的Object.defineProperty()方法，接收三個(gè)參數(shù)，屬性所在對(duì)象，屬性名字和一個(gè)描述符對(duì)象。其中描述符對(duì)象屬性必須是:configurable、enumerable、writable、value.設(shè)置其中一個(gè)或多個(gè)值(小寫(xiě))
可以多次調(diào)用Object.defineProperty(),但是Configurable一旦設(shè)置為false(不可配置)，就不能再將其設(shè)置為true(可配置)，而且為false時(shí)其他屬性也受到限制了
在調(diào)用Object.defineProperty()時(shí)，若不設(shè)置，configurable、enumerable、writable的值都為false

var Person = {}
Object.defineProperty(Person, "name", {
    configurable: false,
    wirtable: false,
    value: "alice"
})

console.log(Person.name) // alice

delete Person.name

console.log(Person.name) // alice

Person.name = "Nico"

console.log(Person.name) // alice

Object.defineProperty(Person, "name", {
    configurable: true,
    value: "Nico"
})

console.log(Person.name) // 報(bào)錯(cuò)

訪(fǎng)問(wèn)器屬性不包含數(shù)據(jù)值，包含一對(duì)getter和setter函數(shù)(不過(guò)它們不是必須的)，在讀取訪(fǎng)問(wèn)器屬性時(shí)，會(huì)調(diào)用getter函數(shù)，它負(fù)責(zé)返回有效的值；在寫(xiě)入訪(fǎng)問(wèn)器屬性時(shí)會(huì)調(diào)用setter函數(shù)，它負(fù)責(zé)處理數(shù)據(jù)；訪(fǎng)問(wèn)器有如下4個(gè)特性

* [[Configurable]]:表示能否通過(guò)delete刪除屬性，從而重新定義屬性，能否修改屬性特性，能否把屬性修改為訪(fǎng)問(wèn)器屬性

[[Enumerable]]:能否通過(guò)for-in循環(huán)返回屬性

[[Get]]:在讀取時(shí)調(diào)用的函數(shù)，默認(rèn)值為undefined

[[Set]]:在寫(xiě)入屬性時(shí)調(diào)用的函數(shù)，默認(rèn)值為undefined

訪(fǎng)問(wèn)器屬性不能直接定義，必須使用Object.defineProperty()來(lái)定義

var book = {
     _year: 2014, // _ 是一種常用標(biāo)記，用于表示只能通過(guò)對(duì)象方法訪(fǎng)問(wèn)的屬性
     edition: 1
 }

 Object.defineProperty(book, "year", {
     get: function() {
         return this._year
     },
     set: function(val) {
         if (val > 2014) {
             this._year = val
             this.edition = val - 2014
         }
     }
 })

 book.year = 2016
 console.log(book.edition) // 2

這是使用訪(fǎng)問(wèn)器屬性的常見(jiàn)方式，即設(shè)置一個(gè)屬性的值會(huì)導(dǎo)致其他屬性發(fā)生變化  
不一定要同時(shí)使用getter和setter，只指定getter表示屬性不能寫(xiě)，嘗試寫(xiě)入屬性會(huì)被忽略；只指定setter表示不能讀，否則會(huì)返回undefined；在嚴(yán)格模式下都會(huì)拋出錯(cuò)誤

Object.defineProperties(),es5中定義的，可以通過(guò)描述符一次定義多個(gè)屬性，接收2個(gè)對(duì)象參數(shù)，第一個(gè)是要添加和修改其屬性的對(duì)象，第二個(gè)對(duì)象的屬性與第一個(gè)對(duì)象中要添加或修改的屬性要一一對(duì)應(yīng)

var book = {}
  Object.defineProperties(book, {
      _year: {
          value: 2000
      },

      edition: {
          writable: true,
          value: 1
      },

      year: {
          get: function() {
              return this._year
          },

          set: function(val) {
              if (val > 2000) {
                  this._year = val
                  this.edition += val - 2000
              }
          }
      }
  })

  console.log(book.year) // 2000
  book.year = 2017
  console.log(book.edition) // 18

Object.getOwnPropertyDescriptor(),可以取得給定屬性的描述符；接收2個(gè)參數(shù)：屬性所在對(duì)象和要讀取的其描述符的屬性名，返回值為一個(gè)對(duì)象；如果是數(shù)據(jù)屬性，這個(gè)對(duì)象的屬性有configurable、enumerable、writable、value；如果是訪(fǎng)問(wèn)器屬性，這個(gè)對(duì)象的屬性有configurable、enumerbale、get、set

 function createperson(name, age) {
      var o = {}
      o.name = name
      o.age = age
      o.say = function() {
          console.log(this.name, this.age)
      }
      return o
  }

  var p1 = createperson("alice", 18)
  var p2 = createperson("lulu", 20)

  console.log(p1 instanceof Object) // true
  console.log(p1 instanceof createperson) // false

工廠(chǎng)模式解決了創(chuàng)建多個(gè)相似對(duì)象的問(wèn)題，但沒(méi)有解決對(duì)象識(shí)別問(wèn)題(怎么知道一個(gè)對(duì)象的類(lèi)型)

  function Person(name, age) {
      this.name = name
      this.age = age
      this.say = function() {
          console.log(this.name, this.age)
      }
  }

  var p1 = new Person("alice", 18)
  var p2 = new Person("lulu", 20)

  console.log(p1 instanceof Object) // true
  console.log(p1 instanceof Person) // true

與工廠(chǎng)模式對(duì)比，沒(méi)有顯示的創(chuàng)建對(duì)象，直接將屬性和方法賦給了this對(duì)象，沒(méi)有return語(yǔ)句  
在這個(gè)模式下創(chuàng)建的所有對(duì)象既是Object的實(shí)例又是Person的實(shí)例  
創(chuàng)建自定義構(gòu)造函數(shù)意味著可以將它的實(shí)例標(biāo)識(shí)為一種特定類(lèi)型，這正是構(gòu)造函數(shù)模式勝過(guò)工廠(chǎng)模式的地方  
使用構(gòu)造函數(shù)會(huì)使得每個(gè)方法都要在每個(gè)實(shí)例上創(chuàng)建一遍，在上述例子中p1和p2都有say方法，但那不是同一個(gè)Fuction的實(shí)例，因?yàn)樵趈s中函數(shù)是對(duì)象，會(huì)導(dǎo)致不同的作用域鏈和標(biāo)識(shí)符解析

console.log(p1.say == p2.say) // false

創(chuàng)建的函數(shù)都有一個(gè)prototype(原型)屬性，它是一個(gè)指針，指向一個(gè)對(duì)象，這個(gè)對(duì)象的用途是包含可以由特定類(lèi)型的所有實(shí)例共享的屬性和方法，也就是prototype就是通過(guò)調(diào)用構(gòu)造函數(shù)而創(chuàng)建的那個(gè)對(duì)象實(shí)例的原型對(duì)象

function Person() {}
Person.prototype.name = "nico"
Person.prototype.say = function() {
    console.log(this.name)
}

var p1 = new Person()
p1.say() // nico
console.log(p1 instanceof Person) // true

理解原型對(duì)象

只要?jiǎng)?chuàng)建了新函數(shù)，就會(huì)為該函數(shù)創(chuàng)建一個(gè)prototype屬性，這個(gè)屬性指向函數(shù)的原型對(duì)象

默認(rèn)情況下，所有原型對(duì)象都會(huì)自動(dòng)獲得一個(gè)constructor(構(gòu)造函數(shù))屬性，這個(gè)屬性包含一個(gè)指向prototype屬性所在函數(shù)的指針，例如前面的代碼中Person.prototype.constructor指向Person;通過(guò)這個(gè)構(gòu)造函數(shù)可以繼續(xù)為原型對(duì)象添加其它屬性和方法

創(chuàng)建了自定義構(gòu)造函數(shù)后，其原型對(duì)象默認(rèn)只會(huì)取得constructor屬性；至于其他方法，則從Object繼承而來(lái)

當(dāng)調(diào)用一個(gè)構(gòu)造函數(shù)創(chuàng)建一個(gè)新的實(shí)例后，該實(shí)例內(nèi)部包含一個(gè)指針(內(nèi)部屬性)，指向構(gòu)造函數(shù)的原型對(duì)象；es5中這個(gè)指針叫[[Prototype]],在腳本中沒(méi)有標(biāo)準(zhǔn)的方式訪(fǎng)問(wèn)[[Prototype]]，但Firefox，Safari，Chrome在每個(gè)對(duì)象上都支持一個(gè)屬性__proto__;這個(gè)鏈接存在于實(shí)例與構(gòu)造函數(shù)的原型對(duì)象之間，而不是實(shí)例與構(gòu)造函數(shù)之間

可以通過(guò)對(duì)象實(shí)例訪(fǎng)問(wèn)保存在原型中的值，但卻不能重寫(xiě)原型中的值

原型模式最大問(wèn)題是由其共享的本性所導(dǎo)致的，改變一個(gè)實(shí)例的屬性，所有實(shí)例都會(huì)變

更簡(jiǎn)單的原型語(yǔ)法

function Person() {}
Person.prototype = {
    name: "nico",
    say: function() {
        console.log(this.name)
    }
}

var p1 = new Person()
p1.say() // nico
console.log(p1 instanceof Person) // true
console.log(p1.constructor == Person) // false

以對(duì)象字面量形式創(chuàng)建，會(huì)導(dǎo)致constructor屬性不再指向Person

可以設(shè)置constructor為適當(dāng)值

  function Person() {}
  Person.prototype = {
      constructor: Person,
      name: "nico",
      say: function() {
          console.log(this.name)
      }
  }
  var p1 = new Person()
  p1.say() // nico
  console.log(p1 instanceof Person) // true
  console.log(p1.constructor == Person) // true

但這樣會(huì)導(dǎo)致constructor的[[Enumerable]]為true，原生的constructor為不可枚舉屬性，這時(shí)候要用es5的Object.defineProperty()重寫(xiě)constructor屬性

    function Person() {}
    Person.prototype = {
        constructor: Person,
        name: "nico",
        say: function() {
            console.log(this.name)
        }
    }

    Object.defineProperty(Person.prototype, "constructor", {
        enumerable: false,
        value: Person
    })

    var p1 = new Person()
    p1.say() // nico
    console.log(p1 instanceof Person) // true
    console.log(p1.constructor == Person) // true

概述

組合使用構(gòu)造函數(shù)模式和原型模式

這是創(chuàng)建自定義類(lèi)型最常見(jiàn)的模式

構(gòu)造函數(shù)模式用于定義實(shí)例屬性，而原型模式用于定義方法和共享的屬性

這樣，每個(gè)實(shí)例都有一份自己的實(shí)例屬性的副本，同時(shí)又共享著對(duì)方法的引用，還支持向構(gòu)造函數(shù)傳參

這種模式是目前使用最廣泛的一種創(chuàng)建自定義類(lèi)型的方法，可以說(shuō)是用來(lái)定義引用類(lèi)型的一種默認(rèn)模式

function Person(name, age) {
    this.name = name
    this.age = age
}

Person.prototype = {
    constructor: Person,
    say: function() {
        console.log(this.name, this.age)
    }
}

var p1 = new Person("alice", 20)
var p2 = new Person("nico", 30)
p1.say()
console.info(p1.name == p2.name) // false
console.info(p1.say == p2.say) // true

為了解決獨(dú)立的構(gòu)造函數(shù)和原型，動(dòng)態(tài)原型模式將所有信息封裝到構(gòu)造函數(shù)中，而通過(guò)在構(gòu)造函數(shù)中初始化原型，又保持了同時(shí)使用構(gòu)造函數(shù)和原型的優(yōu)點(diǎn)；也就是通過(guò)檢測(cè)某個(gè)應(yīng)該存在的方法是否有效來(lái)決定是否初始化原型

function Person(name, age) {
      this.name = name
      this.age = age
      if (typeof this.say != "function") {
          Person.prototype.say = function() {
              console.log(this.name, this.age)
          }
      }
  }

  var p1 = new Person("alice", 20)
  var p2 = new Person("nico", 30)
  console.info(p1.name == p2.name) // false
  console.info(p1.say == p2.say) // true

這里只有在say方法不存在時(shí)，才會(huì)將它添加到原型中，這段代碼只有在初次調(diào)用構(gòu)造函數(shù)時(shí)才會(huì)執(zhí)行

if語(yǔ)句檢查可以使初始化之后應(yīng)該存在的任何屬性或方法，不必一堆if語(yǔ)句來(lái)檢測(cè)每個(gè)屬性和每個(gè)方法，只要檢查其中一個(gè)即可，還可以使用instanceof來(lái)確定類(lèi)型

與工廠(chǎng)模式一樣，instanceof操作符不能用來(lái)確定對(duì)象類(lèi)型，在能使用其他模式的情況下不推薦使用

function Person(name, age) {
      var o = {}
      o.say = function() {
          console.log(name)
      }
      return o
  }

  var p1 = Person("alice", 20)
  p1.say() // alice

這樣變量Person中保存的是一個(gè)穩(wěn)妥對(duì)象，除了調(diào)用say()外，無(wú)法訪(fǎng)問(wèn)其數(shù)據(jù)成員，這種模式instanceof也沒(méi)什么意義

使用call或者apply，將父對(duì)象的構(gòu)造函數(shù)綁定在子對(duì)象上

function Animal() {
      this.species = "貓科動(dòng)物"
  }

  function Cat(name, color) {
      Animal.apply(this, arguments)
      this.name = name
      this.color = color
  }

  var cat1 = new Cat("kit", "white")
  console.log(cat1.species) // 貓科動(dòng)物

方法都在構(gòu)造函數(shù)中定義，函數(shù)無(wú)法復(fù)用，借用構(gòu)造函數(shù)很少多帶帶使用

使用prototype屬性，如果子構(gòu)造函數(shù)的prototype對(duì)象指向一個(gè)父構(gòu)造函數(shù)的實(shí)例，那么所有子構(gòu)造函數(shù)的實(shí)例都可以繼承父構(gòu)造函數(shù)了

    function Animal() {
      this.species = "貓科動(dòng)物"
  }

  function Cat(name, color) {
      this.name = name
      this.color = color
  }

  Cat.prototype = new Animal()

  Cat.prototype.constructor = Cat

  var cat1 = new Cat("ly", "blue")
  console.log(cat1.species) // 貓科動(dòng)物

解析上述代碼

Cat.prototype = new Animal()

將Cat的prototype對(duì)象指向一個(gè)Animal的實(shí)例,它相當(dāng)于刪除了prototype原先的值，然后賦予一個(gè)新值

- `Cat.prototype.constructor = Cat`任何一個(gè)prototype都有一個(gè)constructor屬性，由于上述代碼，會(huì)導(dǎo)致Cat.prototype.constructor指向Animal，需要重新將構(gòu)造函數(shù)定義回Cat
- 如果替換了prototype對(duì)象那么下一步必定是將constructor指向原來(lái)的構(gòu)造函數(shù)
* 由于不能在不影響所有對(duì)象實(shí)例的情況下傳參和由于原型中包含的引用類(lèi)型值得問(wèn)題，很少會(huì)多帶帶使用原型鏈

  function Animal() {
      this.species = "貓科動(dòng)物"
  }

  function Cat(name, color) {
      this.name = name
      this.color = color
  }

  function F() {}

  F.prototype = new Animal()
  Cat.prototype = new F()

  var cat1 = new Cat("ly", "blue")

  console.log(cat1.species) // 貓科動(dòng)物
  console.log(Animal.prototype.constructor) // Animal的源代碼

function Animal() {
      this.species = "貓科動(dòng)物"
  }

  function Cat(name, color) {
      this.name = name
      this.color = color
  }

  function extend(child, parent) {
      var F = function() {}
      F.prototype = new parent()
      child.prototype = new F()
      child.prototype.constructor = child
      child.uber = parent.prototype
  }

  extend(Cat, Animal)

  var cat1 = new Cat("jack", "orange")

  console.log(cat1.species) // 貓科動(dòng)物

這個(gè)extend函數(shù)，就是YUI庫(kù)如何實(shí)現(xiàn)繼承的方法  
最后一行只是為了實(shí)現(xiàn)繼承的完備性，純屬備用性質(zhì)

創(chuàng)建一個(gè)僅用于封裝繼承過(guò)程的函數(shù)

無(wú)法實(shí)現(xiàn)函數(shù)復(fù)用

    function creatAnother(obj) {
      var clone = Object(obj)
      clone.say = function() {
          console.log("hi")
      }
      return clone
  }

  var Person = {
      name: "nico"
  }

  var an = creatAnother(Person)
  an.say() // hi

也叫偽經(jīng)典繼承，將原型鏈和借用構(gòu)造函數(shù)的技術(shù)整合一起，從而發(fā)揮二者之長(zhǎng)

通過(guò)原型鏈實(shí)現(xiàn)對(duì)原型屬性和方法的繼承，通過(guò)借用構(gòu)造函數(shù)來(lái)實(shí)現(xiàn)對(duì)實(shí)例屬性的繼承

最常用方式

函數(shù)可復(fù)用，可傳參，不存在引用屬性共享問(wèn)題

function Person(name, age) {
      this.name = name
      this.age = age
  }

  Person.prototype.sayName = function() {
      console.log(this.name)
  }

  Person.prototype.sayAge = function() {
      console.log(this.age)
  }

  function Girls(name, age) {
      Person.apply(this, arguments)
  }

  Girls.prototype = new Person()
    Girls.prototype.constructor = Girls;

  var alice = new Girls("alice", 16)
  alice.sayName() // alice
  alice.sayAge() // 16

最好的繼承方式

  function inter(Super, Sub) {
      var clone = Object(Super.prototype) // 創(chuàng)建對(duì)象
      clone.constructor = Sub // 增強(qiáng)對(duì)象
      Sub.prototype = clone // 指定對(duì)象
  }

  function Person(name, age) {
      this.name = name
      this.age = age
  }

  Person.prototype.say = function() {
      console.log(this.name, this.age)
  }

  function Girls(name, age, play) {
      Person.apply(this, arguments)
      this.play = play
  }

  inter(Person, Girls)

  Girls.prototype.plays = function() {
      console.log(this.play)
  }

  var alice = new Girls("alice", 16, "game")
  alice.say() // alice 16
  alice.plays() // game

inter函數(shù)實(shí)現(xiàn)了寄生組合的最簡(jiǎn)單形式，在函數(shù)內(nèi)部先創(chuàng)建超類(lèi)原型副本，為創(chuàng)建的副本添加constructor屬性，最后將副本賦給子類(lèi)型的原型

瀏覽器對(duì)象模型，提供了獨(dú)立于瀏覽器顯示內(nèi)容而與瀏覽器窗口進(jìn)行交互的對(duì)象

用于存儲(chǔ)當(dāng)前頁(yè)面URL信息的對(duì)象

location的屬性如下:

    //假設(shè)url為 http://search.phpied.com:8080/search?p=javascript#results
    location.;
    location.hash = "";
    location.host = "search.phpied.com:8080";
    location.hostname = "search.phpied.com";
    location.pathname = "/search";
    location.port = "8080";
    location.protocol = "http:";
    location.search = "?p=javascript";

location的三個(gè)方法:

reload(): 無(wú)參數(shù)，重新載入當(dāng)前頁(yè)面; location = location也能用于重新載入當(dāng)前頁(yè)面

assign(newURL): 載入新頁(yè)面會(huì)留下歷史記錄

replace(newURL): 載入新頁(yè)面不會(huì)留下歷史記錄

存儲(chǔ)了頁(yè)面的訪(fǎng)問(wèn)記錄

window.history.lenght: 存儲(chǔ)的記錄數(shù)

history.forward(): 前進(jìn)

history.back(): 后退

history.go(): 0重新載入當(dāng)前頁(yè)面; 正值前進(jìn)幾個(gè)頁(yè)面; 負(fù)值后退幾個(gè)頁(yè)面

提供了桌面信息

screen.width,screen.height: 桌面分辨率，總大小

screen.availWidth,screen.availHeight: 除去操作系統(tǒng)菜單欄(例如windows的任務(wù)欄)以外的區(qū)域大小

這幾個(gè)并不屬于ECMAScript，而是BOM方法

定時(shí)器也是BOM方法

文檔對(duì)象模型，將xml或html文檔解析成樹(shù)形節(jié)點(diǎn)的方法

DOM節(jié)點(diǎn)屬性

nodeName : 節(jié)點(diǎn)的名稱(chēng)

nodeValue ：節(jié)點(diǎn)的值

nodeType ：節(jié)點(diǎn)的類(lèi)型

DOM訪(fǎng)問(wèn)快捷方式

getElementsByTagName、getElementsByName、getElementById

可以用屬性形式訪(fǎng)問(wèn)attribute，因?yàn)閏lass為保留字，所以class要用className訪(fǎng)問(wèn)

兄弟節(jié)點(diǎn)、body元素、首尾子節(jié)點(diǎn)

屬性：nextSibling與previousSibling，得到下一個(gè)兄弟節(jié)點(diǎn)、上一個(gè)兄弟節(jié)點(diǎn)；空行也算

屬性：nextElementSibling 與previousElementSibling，得到下一個(gè)上一個(gè)兄弟元素節(jié)點(diǎn)

修改節(jié)點(diǎn)

innerHtml，可用于修改節(jié)點(diǎn)內(nèi)容

style屬性用于修改樣式

創(chuàng)建節(jié)點(diǎn)

document.createElement(): 創(chuàng)建元素節(jié)點(diǎn)

document.createTextNode: 創(chuàng)建文本節(jié)點(diǎn)

克隆節(jié)點(diǎn)

cloneNode(): 該方法有一個(gè)參數(shù)，true深拷貝，包括所有子節(jié)點(diǎn)， false淺拷貝，只針對(duì)當(dāng)前節(jié)點(diǎn)

var odv = document.getElementsByTagName("div")[0];
var p2 = document.getElementsByTagName("p")[1];
odv.appendChild(p2.cloneNode(false));
odv.appendChild(p2.cloneNode(true));
// 淺拷貝，文本節(jié)點(diǎn)不會(huì)拷貝

插入節(jié)點(diǎn)

appendChild(newChild): 將節(jié)點(diǎn)插入到 節(jié)點(diǎn)的子節(jié)點(diǎn)列表的末尾

insertBefore(newChild, refChild): 將節(jié)點(diǎn)插入節(jié)點(diǎn)指定子節(jié)點(diǎn)的前面

var odv = document.getElementsByTagName("div")[0];
var p2 = document.getElementsByTagName("p")[1];
odv.appendChild(p2.cloneNode(true));
odv.insertBefore(p2.cloneNode(true), document.getElementsByTagName("p")[0]);

移除、替換節(jié)點(diǎn)

removeChild(child): 從子節(jié)點(diǎn)列表中移除指定節(jié)點(diǎn)

replaceChild(newChild, oldChild): 將指定子節(jié)點(diǎn)替換成新節(jié)點(diǎn)

var odv = document.getElementsByTagName("div")[0];
var p2 = document.getElementsByTagName("p")[1];
odv.replaceChild(document.createElement("li"), p2);

訪(fǎng)問(wèn)文檔的基本方式

document.body

document.images, 相當(dāng)于Core DOM組件的document.getElementsByTagName("img")的調(diào)用

document.forms, 獲取所form，包含子元素；然后可以通過(guò)elements來(lái)訪(fǎng)問(wèn)子元素,如果form或者子元素有名字，也可用過(guò)名字訪(fǎng)問(wèn)

var forms = document.forms[0];
// var user = forms.elements[0]; 和下行一樣
var user = forms.user;
console.log(user);
user.value = "admin";
//  標(biāo)簽里有了admin

CookiesTitleReferrerDomain

addEventListener(even, function, boolean) : 第一個(gè)參數(shù)為事件名不加on，第二個(gè)參數(shù)為函數(shù)，第三個(gè)為布爾值默認(rèn)為false在冒泡階段執(zhí)行，true在捕獲階段執(zhí)行

removeEventListener(): 該方法與上一個(gè)參數(shù)相同，它是移除監(jiān)聽(tīng)器；但若是第二個(gè)參數(shù)為匿名函數(shù)則移除不了

捕捉：事件先發(fā)生在document上，依次傳遞給body等，最終達(dá)到該元素上

冒泡：事件先發(fā)生在該元素上，再依次向上，然后到body，直至document對(duì)象上

stopPropagation(): 這樣就使得事件無(wú)法傳播了，只發(fā)生在自己身上

var op = document.getElementsByTagName("p");
op[0].addEventListener("click", function(e) {
    console.log(e.target);
    e.stopPropagation();
}, false);

pereventDefault(): 不是所有默認(rèn)事件都能阻止

var alink = document.getElementsByTagName("a");
alink[0].addEventListener("click", function(e) {
    e.preventDefault();
    console.log(123);
}, false);

就是HTML、CSS和JS分開(kāi)

為了減少命名沖突，通常減少全局變量的使用；更好的方法是將不同變量和方法定義在不同命名空間中；本質(zhì)是只定義一個(gè)全局變量，并將其它變量和方法定義為該變量的屬性

// 新建全局變量MYAPP
var MYAPP = MYAPP || {};

// 添加屬性
MYAPP.event = {};

// 添加方法
MYAPP.event = {
  getEvent: function(e) {
    // ......
  },
  // ......other methods
}

我們可以在命名空間中使用構(gòu)造器函數(shù)

// 本例中，我們用Element構(gòu)造器創(chuàng)建一個(gè)dom元素
var MYAPP = MYAPP || {};
MYAPP.dom = {};
MYAPP.dom.Element = function(type, props) {
    var tmp = document.createElement(type);
    for (var i in props) {
        tmp.setAttribute(i, props[i]);
        console.log(i, props[i]);
    }
    return tmp;
}

var a = new MYAPP.dom.Element("a", {
    href: "javascript.void(0);"
});

document.body.appendChild(a);

var MYAPP = {};

MYAPP.namespace = function(str){
    var parts = str.split("."),
    parent = MYAPP,
    i=0,
    l=0;

    if(parts[0]==="MYAPP"){
        parts = parts.slice(1);
    }
    for(i=0,l=parts.length; i
設(shè)計(jì)模式
設(shè)計(jì)模式有23種甚至更多，下面為4種常用模式
單例模式
工廠(chǎng)模式
裝飾器模式
觀察者模式
var sub = {
    callbacker: [],
    // 發(fā)布
    add: function(fn) {
        this.callbacker.push(fn);
    },
   // 訂閱
    fire: function(fn) {
        this.callbacker.forEach(function(element) {
            element();
        });
    }
}

sub.add(function() {
    console.log(1)
});
sub.add(function() {
    console.log(2)
});

sub.fire(); // 1 2
ES6
let和const
let

let用于申明變量，并且只在該代碼塊內(nèi)有效
let不存在變量提升，只能先聲明再使用
暫時(shí)性死區(qū)，在代碼塊內(nèi)未使用let申明變量前，變量都是不可用的
不允許重復(fù)聲明變量
let和const實(shí)際上為js提供了塊級(jí)作用域

const

const就是常量
一旦聲明，必須就賦值，且不可變更
無(wú)法重復(fù)聲明

全局對(duì)象的屬性

全局對(duì)象是最頂層的對(duì)象，在瀏覽器環(huán)境中是window對(duì)象，在nodeJS中是global對(duì)象
es5中全局對(duì)象屬性與全局變量等價(jià)
es6中var,function命令聲明的全局變量依然是全局對(duì)象的屬性；而let、const、class命令聲明的全局變量則不再是全局對(duì)象的屬性

變量的解構(gòu)賦值
數(shù)組的結(jié)構(gòu)賦值
基本用法
let [a, b, c] = [1, "a", ["c"]];
console.log(a, b, c); // 1, "a", ["c"]

即匹配模式，等號(hào)兩邊格式一樣，即可進(jìn)行變量的賦值
若右邊表達(dá)式不是數(shù)組，則會(huì)報(bào)錯(cuò)；只要有Iterator接口的數(shù)據(jù)結(jié)構(gòu)都可以使用數(shù)組形式的解構(gòu)賦值
適用于var、let、const命令
若解構(gòu)失敗變量值為undefined

默認(rèn)值

解構(gòu)賦值允許有默認(rèn)值
ES6內(nèi)部使用嚴(yán)格相等運(yùn)算符（===），所以一個(gè)數(shù)組成員不嚴(yán)格等于undefined是不會(huì)使用默認(rèn)值的

var [a = 1, b = 2, c = 3, d = 4] = [undefined, null, "c", d];
console.log(a, b, c, d); //1 null "c" 4
對(duì)象的解構(gòu)賦值
    var {x, y} = {x: 1, y: "a" };
    console.log(x, y); //1 "a"

    
    var { bar: baz } = { bar: "hello" };
    console.log(baz); //hello


    /*下面例子中js會(huì)將{}當(dāng)成代碼塊，此時(shí)需要用小括號(hào)括起來(lái)*/
    var k;
    // {k} = {k: 123};會(huì)報(bào)錯(cuò)，js會(huì)將{}當(dāng)成代碼塊，此時(shí)需要用小括號(hào)括起來(lái)
    ({ k } = { k: 123 });
    console.log(k); // 123


    /*在這個(gè)例子中，loc是模式不是變量不會(huì)賦值*/
    var local = {
        loc: {
            ui: "ui",
            txt: "txt"
        },
        title: "標(biāo)題"
    }

    var {
        loc: {
            ui,
            txt
        },
        title
    } = local;
    // console.log(loc); loc is not defined
    console.log(ui, txt, title); // ui txt 標(biāo)題


    /*對(duì)象的解構(gòu)賦值也能設(shè)置默認(rèn)值，同樣只有在值嚴(yán)格為undefined時(shí)，默認(rèn)值才會(huì)有用*/
    var {bat = 123, bas = 456, bad} = {bat: undefined, bas: null, bad: "bad"};
    console.log(bat, bas, bad); // 123 null "bad"


    /*若解構(gòu)失敗變量值為undefined*/


    /*對(duì)象的解構(gòu)賦值，可以方便的將對(duì)象方法賦值到某個(gè)變量中*/
    var {pow, random} = Math;
    // 將Math對(duì)象的次方和隨機(jī)數(shù)方法賦值給了pow和random
    console.log(pow(2, 3)); // 8
    console.log(random()); // 隨機(jī)數(shù)


    /*因?yàn)閿?shù)組也是特殊對(duì)象，因此數(shù)組也能進(jìn)行對(duì)象的解構(gòu)賦值*/
    var arr = [1, 2, 3];
    var {0: first, [arr.length - 1]: last} = arr;
    console.log(first, last); // 1 3
字符串的解構(gòu)賦值
// 將字符串轉(zhuǎn)成了類(lèi)似數(shù)組的對(duì)象
const [a, b] = "hi";
console.log(a, b); // h i

// 字符串有l(wèi)ength屬性，因此可以對(duì)這個(gè)對(duì)象進(jìn)行解構(gòu)賦值
var {
    length: len
} = "hello";
console.log(len); // 5
函數(shù)參數(shù)的解構(gòu)賦值
    function add([x, y]) {
        return x + y;
    }
    console.log(add([1, 2])) // 3

    function move({
        x = 0,
        y = 0
    } = {}) {
        return [x, y];
    }
    console.log(move({
            x: 3
        })) // [3, 0]
    console.log(move({
            y: 8
        })) // [0, 8]
    console.log(move({
            x: 3,
            y: 8
        })) // [3, 8]
解構(gòu)賦值的應(yīng)用
交換變量值
[x, y] = [y, x];

從函數(shù)返回多個(gè)值
函數(shù)參數(shù)定義和設(shè)置默認(rèn)值
遍歷Map結(jié)構(gòu)
輸入模塊的指定方法
提取JSON

var data = {
        id: 1,
        name: "admin",
        type: 0,
        data: {
            goods: [9001, 9002],
            goods_type: [0, 1]
        }
    }

    var {
        id,
        name,
        type,
        data: {
            goods,
            goods_type
        }
    } = data;
    console.log(id, name, type, goods, goods_type); // 1 "admin" 0 (2) [9001, 9002] (2) [0, 1]
數(shù)組的擴(kuò)展
新增方法
Array.from
Array.from方法用于將類(lèi)似數(shù)組的對(duì)象和可遍歷對(duì)象（包含set、map）轉(zhuǎn)換成數(shù)組

實(shí)際應(yīng)用中可以將DOM操作返回的NodeList和函數(shù)內(nèi)arguments轉(zhuǎn)為數(shù)組
還能接受第二個(gè)參數(shù)，作用類(lèi)似于數(shù)組的map方法，對(duì)每個(gè)元素進(jìn)行處理，將處理后的值放入返回的數(shù)組

Array.of
用于將一組值轉(zhuǎn)換為數(shù)組
var arr1 = Array();
var arr2 = Array(3);
var arr3 = Array(1, 2);
console.log(arr1); // []
console.log(arr2); // [ , , ]
console.log(arr3); // [1, 2]

var arr4 = Array.of(1);
console.log(arr4); // [1]

/*因?yàn)閿?shù)組的構(gòu)造函數(shù)，只有在參數(shù)不小于2時(shí)才會(huì)作為數(shù)組值，一個(gè)參數(shù)時(shí)作為數(shù)組長(zhǎng)度；Array.of則是保持一致，無(wú)論參數(shù)多少都作為數(shù)組元素*/
copyWithin

copyWithin(target, start, end): 將指定位置的成員復(fù)制到其他位置(會(huì)覆蓋原有成員)，然后返回當(dāng)前數(shù)組，也就是會(huì)修改當(dāng)前數(shù)組

參數(shù)：

target(必須)： 從該位置開(kāi)始替換
start（可選）：從該位置讀取，默認(rèn)為0，若為負(fù)值則為倒數(shù)
end（可選）：讀取到該位置結(jié)束，默認(rèn)為數(shù)組長(zhǎng)度，若為負(fù)值則為倒數(shù)



find和findIndex

參數(shù)為一個(gè)函數(shù)，將數(shù)組內(nèi)元素依次執(zhí)行該回調(diào)函數(shù)，找出第一個(gè)返回值為true的成員，find是返回這個(gè)成員，若沒(méi)有符合條件的成員則返回undefined；findIndex是返回該成員位置，若沒(méi)有符合條件的成員則返回-1
回調(diào)函數(shù)，接收三個(gè)參數(shù)：當(dāng)前值、當(dāng)前位置、原數(shù)組

fill

用給定值，填充一個(gè)數(shù)組，會(huì)覆蓋原有全部值
可以接受第二、三個(gè)參數(shù)，用于指定填充的起始和結(jié)束位置

數(shù)組實(shí)例的keys、values、entries

都用于遍歷數(shù)組，返回一個(gè)遍歷器，可用for...of來(lái)遍歷
keys()是對(duì)鍵名，values()是對(duì)鍵值，entries()是對(duì)鍵值對(duì)

數(shù)組實(shí)例的includes

includes返回一個(gè)布爾值，表示數(shù)組是否包含給定的值
該方法可選第二個(gè)參數(shù)，代表起始搜索位置，默認(rèn)為0，若為負(fù)值則倒數(shù)

[1, 2, 3].includes(2) // true
函數(shù)擴(kuò)展
函數(shù)的默認(rèn)值

可以設(shè)置函數(shù)默認(rèn)值，有默認(rèn)值的參數(shù)最好作為尾參
可使用rest參數(shù)， 即...參數(shù)

    function add(...val) {
        let sum = 0;
        for (let i of val) {
            sum += i
        }
        console.log(sum);
    }

    add(1, 2, 3, 4, 5, 6, 7, 8, 9); //45

rest參數(shù)是一個(gè)數(shù)組，可以使用任意數(shù)組方法
rest參數(shù)后面不能再跟任何參數(shù)
rest參數(shù)可以替代Array.prototype.slice.call(arguments)

擴(kuò)展運(yùn)算符
基本含義
擴(kuò)展運(yùn)算符就是三個(gè)點(diǎn)...，用于將數(shù)組轉(zhuǎn)為用逗號(hào)分隔的參數(shù)序列
    function add(...val) {
        let sum = 0;
        for (l