ES6入門簡介

1.變量
var 可以重複聲明、函數級
let 不能重複聲明、塊級、變量
const 不能重複聲明、塊級、常量

2.箭頭函數
a.方便
①如果只有一個參數，()可以省。
②如果只有一個return,{}也可以省。

eg:正常函數
  var getPrice = function(){
  	  return 4.55;
  };

箭頭函數
var getPrice=()=>4.55;

b.修正this
this相對正常點。
3.參數擴展
①收集
②擴展
eg:

  示例1：
  <script>
       function show(a,b,...arg){
       	alert(a);
       	alert(b);
       	alert(arg);
       }

       show(12,5,8,9,22,5,6,4);
       //12
       //5
       //8,9,22,5,6,4
	</script>

示例2：
<script>
	let arr=[12,5,8];
	let arr2=[...arr,...arr];
	alert(arr2);//12,5,8,12,5,8
</script>  

③默認參數

   function calc(x,y){
       x = x||0;
       y = y||0;
       //to do with x,y
       //return x/y
   }

簡單地說就是x,y提供了一個默認值爲0,不傳時x,y以值0來運算，傳了就以實際值計算。

4.數組方法
①map 映射

let arr=[12,5,8];
    let result = arr.map(function(item){
        return item*2;
    });
    alert(result);

②reduce 彙總：一堆數據------->一個

<script>
	let arr = [12,69,180,2345];
	let result = arr.reduce(function(tmp,item,index){
       return tmp+item;
	});
    alert(result);//2606 四個數的總和
</script>

③filter 過濾

  <script>
       let arr = [12,5,65,54,787,89];
        let result = arr.filter(item=>item%3==0);
        alert(result);//12,54
	</script>

④forEach 循環

<script>
    let arr = [12,5,8,9];
    let result= arr.forEach((item,index)=>{
       alert(index+':'+item);
    });
    console.log(result);
    //0:12
    //1:5
    //2:8
    //3:9 
</script>

5.字符串
①startsWith/endsWith:判斷bool值,數據以什麼開頭，以什麼結尾。

<script>
	let str = "asdagfgdf";
	alert(str.startsWith('a'));//true 字符串是以a開頭的
</script>

<script>
let str = '1.txt';
if(str.endsWith('1.txt')){
	alert('文本文件');

}else if(str.endsWith('.jpg')){
	alert('JPJ圖片');

}else{
	alert('其他');
}
//輸出結果:文本文件

②字符串模板：
a.能折行
b.可以直接加入新數據 ‘${a}xxx${b}’

 	<script>
	let title='標題';
	let content='內容';
	let str=`<div>
	        <h1>${title}</h1>
	        <p>${content}</p>
	        </div>`;
 </script> 

6.Promise 承諾
封裝異步操作：有三種狀態
①Pending 進行中
②Resolved 已完成
③Rejected 已失敗

<script>
	let p = new Promise(function(resolve,reject){
       //異步代碼
       //resolve---成功了
       //reject----失敗了
       
       alert(resolve);
       $.ajax({
          url:'arr.txt',
          dataType:'json',
          success(arr){
          	resolve(arr);
          },
          error(err){
          	reject(err);
          }
       })
	});

	p.then(function(){
		alert('成功');
	},function(){
		alert('失敗了');
	});
</script>

Promise就是用同步的方式寫異步的代碼，用來解決回調問題。

7.generator 生成器
yield 暫時中止
ps:*可以靠近function,可以寫中間，也可以靠近show，不能寫成function*show的樣式。

  function * show(){
      yield
   }

8.JSON

   JSON.stringify({a:12,b:5}) => '{"a":12,"b":5}'
   JSON.parse('{"a":12,"b":5}') => {a:12,b:5}

9.面向對象

  class Test{
    constructor(){
       this.xxx=
     }
     方法1(){
     }
     方法2(){
     }
  }
class Cls2 extends Cls1{
   constructor(){
     super();//父類(基類)
   }
}

10.解構賦值

let [a,b,c]=[12,5,8]
左右結構一樣
右邊是個合法的東西
聲明、賦值一次完成

<script>
	let[a,b,c]=[1,2,3];
	console.log(a,b,c);//1,2,3
</script>
<script>
	let{a,b,c}={a:12,b:13,c:18};
    console.log(a,b,c);//12,13,18
</script>