極大似然估計和最大後驗估計的關係（機器學習視角）

阿新 • • 發佈：2020-11-12

4.ES6語法指南

什麼是ES6？就是ECMAScript第6版標準。

4.1.什麼是ECMAScript？

來看下前端的發展歷程：

web1.0時代：

最初的網頁以HTML為主，是純靜態的網頁。網頁是隻讀的，資訊流只能從服務的到客戶端單向流通。開發人員也只關心頁面的樣式和內容即可。

web2.0時代：

1995年，網景工程師Brendan Eich 花了10天時間設計了JavaScript語言。
1996年，微軟釋出了JScript，其實是JavaScript的逆向工程實現。
1997年，為了統一各種不同script指令碼語言，ECMA（歐洲計算機制造商協會）以JavaScript為基礎，制定了ECMAscript

標準規範。JavaScript和JScript都是ECMAScript的標準實現者，隨後各大瀏覽器廠商紛紛實現了ECMAScript標準。

所以，ECMAScript是瀏覽器指令碼語言的規範，而各種我們熟知的js語言，如JavaScript則是規範的具體實現。

4.2.ECMAScript的快速發展

而後，ECMAScript就進入了快速發展期。

1998年6月，ECMAScript 2.0 釋出。
1999年12月，ECMAScript 3.0 釋出。這時，ECMAScript 規範本身也相對比較完善和穩定了，但是接下來的事情，就比較悲劇了。
2007年10月。。。。ECMAScript 4.0 草案發布。

這次的新規範，歷時頗久，規範的新內容也有了很多爭議。在制定ES4的時候，是分成了兩個工作組同時工作的。
- 一邊是以 Adobe, Mozilla, Opera 和 Google為主的 ECMAScript 4.0 工作組。
- 一邊是以 Microsoft 和 Yahoo 為主的 ECMAScript 3.1 工作組。
ECMAScript 4 的很多主張比較激進，改動較大。而 ECMAScript 3.1 則主張小幅更新。最終經過 TC39 的會議，決定將一部分不那麼激進的改動保留髮布為 ECMAScript 3.1，而ES4的內容，則延續到了後來的ECMAScript5和6版本中
2009年12月，ECMAScript 5 釋出。
2011年6月，ECMAScript 5.1 釋出。
2015年6月，ECMAScript 6，也就是 ECMAScript 2015 釋出了。並且從 ECMAScript 6 開始，開始採用年號來做版本。即 ECMAScript 2015，就是ECMAScript6。它的目標，是使得 JavaScript 語言可以用來編寫複雜的大型應用程式，成為企業級開發語言。

4.3.ES5和6的一些新特性

我們這裡只把一些常用的進行學習，更詳細的大家參考：阮一峰的ES6教程

建立一個空的html頁面：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<script>

</script>
<body>
    
</body>
</html>

4.3.1.let 和 const 命令

var

之前，js定義變數只有一個關鍵字：var

var有一個問題，就是定義的變數有時會莫名奇妙的成為全域性變數。

例如這樣的一段程式碼：

for(var i = 0; i < 5; i++){
    console.log(i);
}
console.log("迴圈外：" + i)

你猜下列印的結果是什麼？

let

let所宣告的變數，只在let命令所在的程式碼塊內有效。

我們把剛才的var改成let試試：

for(let i = 0; i < 5; i++){
    console.log(i);
}
console.log("迴圈外：" + i)

結果：

const

const宣告的變數是常量，不能被修改

4.3.2.字串擴充套件

新的API

ES6為字串擴充套件了幾個新的API：

includes()：返回布林值，表示是否找到了引數字串。
startsWith()：返回布林值，表示引數字串是否在原字串的頭部。
endsWith()：返回布林值，表示引數字串是否在原字串的尾部。

實驗一下：

字串模板

ES6中提供了`來作為字串模板標記。我們可以這麼玩：

在兩個`之間的部分都會被作為字串的值，不管你任意換行，甚至加入js指令碼

4.3.3.解構表示式

陣列解構

比如有一個數組：

let arr = [1,2,3]

我想獲取其中的值，只能通過角標。ES6可以這樣：

const [x,y,z] = arr;// x，y，z將與arr中的每個位置對應來取值
// 然後列印
console.log(x,y,z);

物件解構

例如有個person物件：

const person = {
    name:"jack",
    age:21,
    language: ['java','js','css']
}

我們可以這麼做：

// 解構表示式獲取值
const {name,age,language} = person;
// 列印
console.log(name); //jack
console.log(age); //21
console.log(language); // ['java','js','css']

如過想要用其它變數接收，需要額外指定別名：

{name:n}：name是person中的屬性名，冒號後面的n是解構後要賦值給的變數。

4.3.4.函式優化

函式引數預設值

在ES6以前，我們無法給一個函式引數設定預設值，只能採用變通寫法：

    function add(a , b) {
        // 判斷b是否為空，為空就給預設值1
        b = b || 1;
        return a + b;
    }
    // 傳一個引數
    console.log(add(10));

現在可以這麼寫：

function add(a , b = 1) {
    return a + b;
}
// 傳一個引數
console.log(add(10));

箭頭函式

ES6中定義函式的簡寫方式：

一個引數時：

var print = function (obj) {
    console.log(obj);
}
// 簡寫為：
var print2 = obj => console.log(obj);

多個引數：

// 兩個引數的情況：
var sum = function (a , b) {
    return a + b;
}
// 簡寫為：
var sum2 = (a,b) => a+b;

程式碼不止一行，可以用{}括起來

var sum3 = (a,b) => {
    return a + b;
}

物件的函式屬性簡寫

比如一個Person物件，裡面有eat方法：

let person = {
    name: "jack",
    // 以前：
    eat: function (food) {
        console.log(this.name + "在吃" + food);
    },
    // 箭頭函式版：
    eat2: food => console.log(person.name + "在吃" + food),// 這裡拿不到this
    // 簡寫版：
    eat3(food){
        console.log(this.name + "在吃" + food);
    }
}

箭頭函式結合解構表示式

比如有一個函式：

const person = {
    name:"jack",
    age:21,
    language: ['java','js','css']
}

function hello(person) {
    console.log("hello," + person.name)
}

如果用箭頭函式和解構表示式

var hi = ({name}) =>  console.log("hello," + name);

4.3.5.map和reduce

陣列中新增了map和reduce方法。

map

map()：接收一個函式，將原陣列中的所有元素用這個函式處理後放入新陣列返回。

舉例：有一個字串陣列，我們希望轉為int陣列

let arr = ['1','20','-5','3'];
console.log(arr)

arr = arr.map(s => parseInt(s));
console.log(arr)

reduce

reduce()：接收一個函式（必須）和一個初始值（可選）。

第一個引數（函式）接收兩個引數：

第一個引數是上一次reduce處理的結果
第二個引數是陣列中要處理的下一個元素

reduce()會從左到右依次把陣列中的元素用reduce處理，並把處理的結果作為下次reduce的第一個引數。如果是第一次，會把前兩個元素作為計算引數，或者把使用者指定的初始值作為起始引數

舉例：

const arr = [1,20,-5,3]

沒有初始值：

指定初始值：

4.3.6.物件擴充套件

ES6給Object拓展了許多新的方法，如：

keys(obj)：獲取物件的所有key形成的陣列
values(obj)：獲取物件的所有value形成的陣列
entries(obj)：獲取物件的所有key和value形成的二維陣列。格式：[[k1,v1],[k2,v2],...]
assign(dest, ...src) ：將多個src物件的值拷貝到 dest中（淺拷貝）。

4.3.7.陣列擴充套件

ES6給陣列新增了許多方法：

find(callback)：陣列例項的find方法，用於找出第一個符合條件的陣列成員。它的引數是一個回撥函式，所有陣列成員依次執行該回調函式，直到找出第一個返回值為true的成員，然後返回該成員。如果沒有符合條件的成員，則返回undefined。
findIndex(callback)：陣列例項的findIndex方法的用法與find方法非常類似，返回第一個符合條件的陣列成員的位置，如果所有成員都不符合條件，則返回-1。
includes(陣列元素)：與find類似，如果匹配到元素，則返回true，代表找到了。