前端基礎_ES6

宣告

• 三大關鍵字

宣告變數：
 var （ES5語法） 
 let （ES6語法）

宣告常量：
 const  (ES6語法)

• var 宣告變數

特性
1、支援 函式作用域
2、支援 JS預解析 （所謂變數提升）
3、支援 重複宣告 （同域同名變數）

1、函式作用域（區域性作用域）
function show(){
    var a = `34`;
}
console.log(a);      //underfind

2、JS預解析
console.log(name);   //underfind
var name = `1234`;

3、重複宣告
var a = `123`;
var a = `4565`;

• let 宣告變數 （推薦）

特性
1、支援 塊作用域
2、不支援 JS預解析
3、不支援 重複宣告 （同域同名變數）

1、塊作用域（區域性作用域）
if(true){
    var a = `34`;
}
console.log(a);      //underfind

2、不支援JS預解析
必須宣告後才能使用，否則報錯

• const 宣告常量

從ES6開始引入常量概念
特性
1、let所有特性
2、宣告時必須賦值，否則報錯
3、定義常量後，再也不能更改值

1、宣告時必須賦值，否則報錯
const a;  //報錯
const a = 11;   //正確

2、定義常量後，基本型別是不能改了，但如果是物件或陣列，是可以改物件內或陣列內的值
const a = [`22`,`bb`];
a[0] = `你好`;  //[`你好`,`bb`];

• 只宣告，不賦值

var a;  //undefined 
let b;  //undefined

• JS預解析

解構賦值

• 應用場景

物件 與 陣列

• ES5 做法

var obj = {
    name:"bbb",
    age:12
};
var name = obj.name;
var age = obj.age;

var arr = [123,`wtao`];
var a = arr[0];
var b = arr[1];

• ES6 做法

let obj = {
    name:"bbb",
    age:12
};
let {name,age} = obj;
console.log(name);
console.log(age);

let arr = [123,`wtaddo`];
let [name,age] = arr;
console.log(name);
console.log(age);

函式