1、let、const、var

var是宣告全域性的變數，作用域是全域性，const是宣告全域性的常量，不能修改,而let是塊級變數只在當前宣告的作用域中生效:

{
    var a = 10;
    let b = 20;
}
console.log(a); // 列印a的值
console.log(b); // 報錯：ReferenceError: b is not defined

2、var的標量宣告提前現象

// 直接列印a的值，檔案中沒有宣告a
console.log(a);// 報錯：Uncaught ReferenceError: a is not defined

因為程式碼從上往下執行，a並沒有宣告，所以報錯,但var有一個宣告提前的情況,看下面程式碼：

console.log(a); //列印undefine
var a = 10;

是不是認為應該會報錯，其實不然，因為var有一個宣告提前的現象，如果你在呼叫一個變數時，它在下文有宣告時，他做了這樣一個事情，相當在你呼叫前聲明瞭變數名而沒有賦值：

var a           //等效呼叫前加上該語句
console.log(a); //列印undefined
var a = 10;

注意，var在函式中宣告的時區域性標量，沒var宣告的全域性變數

function ff(){
    var a=1;
    console.log(a);    //1
}
ff();
console.log(a);    //a is not defined


function ff(){
    a=1;
    console.log(a);    //1
}
ff();
console.log(a);    //1
 

var 在函式內部宣告時的變數提前：

// 情況1
var name = 'kingfan';
function foo(){
    console.log(name)   //列印kingfan;
}

// 情況2
var name = 'kingfan';
function foo(){
    console.log(name)   //列印undefined;
    var name = 'fan';
};
console.log(name)   // 列印 kingfan,var name = 'fan'在函式中宣告的時區域性變數
// 注意正常情況下，console.log(name)找的時全域性
//，但是在區域性中又聲明瞭name，這時呼叫時就不會去找全域性的name
//,而是宣告提前的name=undefined.
 

而let 宣告的就是區域性標量就不會出現宣告提前的問題:

    var pname = 'kingfan';
    function f() {
        console.log(pname); //直接報錯：Uncaught ReferenceError: pname is not defined
        let pname = 'fan';
        console.log(pname)
    }
    f();
    console.log(pname);

var、let、const的區別

var a = 1;
var a =2;
a = 3;
// var 可以對變數重新定義和賦值

let b = 3;
b = 4;
let b = 5;  //報錯:Identifier 'b' has already been declared
// let宣告的變數 只能重新賦值，不能重新定義

const c = 5;
c = 6;  // 報錯,不能修改
const c = 7 //報錯不能重新定義

總結：var宣告的變數是可以重新定義和賦值，let宣告的只能重新賦值，const不能重新定義和賦值修改

3、字串拼接

在es6中新增了模板字串拼接：

var name='kingfan';
var age = 18;
var msg = `我是${name},今年${age}歲`；
console.log(msg)    //列印 我是kingfan,今年18歲

4、資料解構

ES6允許按照一定的模式，從陣列或物件中提取值，對變數進行賦值，這種方式被稱為解構賦值。

// 解構陣列
var list =[1,2,3,4];
var [a,b,c,d] = list;
console.log(a);     //1
console.log(b);     //2 
console.log(c);     //3
console.log(d);     //4


//結構物件
var obj = {
    name:'kingfan'，
    age:18，
}

// 利用key去接受
var {name,age}=obj;
console.log(name);  //'kingfan'
console.log(age);   //18

// 利用其它變數名接受
var {name:pname,age:page}=obj;
console.log(pname);  //'kingfan'
console.log(page);   //18

5、類的定義

ES5的構造物件的方式 使用建構函式來創造。建構函式唯一的不同是函式名首字母要大寫。

<script>
    class Animal{
    //初始化函式，相當python中的init
        constructor(){
            this.type = 'animal'
        };
        say() {
            console.log('我是動物')
        };
    }
    // 例項化物件
    var dog = new Animal();
    // 呼叫物件屬性
    console.log(dog.type);
    // 呼叫物件方法
    dog.say();
</script>

類的繼承，使用extens關鍵字繼承父類:

    class Peopel extends Animal{
        constructor(){
            super()     // 必須在子類的建構函式中執行父類super方法才能得到this呼叫物件
        }
        // 子類可以重構父類的方法
        say(){
            console.log('我是人')
        }
    }
    // 例項化new方法
    var p =new Peopel();
    // 呼叫父類的方法
    console.log(p.type);
    // 重構後呼叫自己得say方法
    p.say();

6、箭頭函式

箭頭函式有個特點：

1. 如果引數只有一個，可以省略小括號
2. 如果不寫return，可以不寫大括號
3. 沒有arguments變數
4. 不改變this指向
5. 其中箭頭函式中this指向被固定化，不是因為箭頭函式內部有繫結this的機制。實際原因是箭頭函式根本沒有自己的this，導致內部的this就是外層程式碼塊的this。

可以檢視下面兩段程式碼輸出的區別：

var person = {
    name: 'Q1mi',
    age:18,
    func:function(){
        console.log(this);
    }
}
person.func()  // person物件

//****************************************
var person = {
    name: 'Q1mi',
    age:18,
    func:()=>{
        console.log(this);
    }
}
person.func()  // window物件

7.JS檔案之間的匯入

在es6中增加了像python類似的import語法來匯入其他js檔案來使用。例如現在有2個檔案，file1、file2

// file1
let name='kingfan';
let age = 18;
// 要確保其他檔案匯入使用，需要確定你要匯出哪些資料給別人使用
export {name,age}

//***************************************
// file2
// 指定從file1要匯入的資料
import {name,age} from 'file1'

目前很多瀏覽器不相容此寫法，會報錯。