技術標籤：箭頭函式寫法

函式的變化----------------------------------------------------------------------------------

1.函式預設引數

例子1--函式預設引數傳統寫法

<script>
 function show(a,b){
  a=a || '歡迎';
  b=b || '碼農';
  console.log(a,b);
 }
  show('welcome','碼農');
  show('welcome');
  show('','碼農');
</script>

例子2--ES6寫法

<script>
 function show(a='welcome',b='碼農'){
  console.log(a,b);
 }
  show('welcome','碼農');
</script>

例子3

<script>
 function show(a=11){

  let a=2222;   //錯誤！
  console.log(a);
 }

 show();
</script>

結論：函式引數預設已經定義了，不能再使用 let 、const 宣告

2.擴充套件運算子、reset（重置、剩餘）運算子（三個點！）

例子4--沒有三個點的時候

<script>
 let arr=['apple','banana','orange'];

 console.log(arr);
</script>

輸出的結果：是一個數組，(3)['apple','banana','orange']

例子5--有三個點了

<script>
 let arr=['apple','banana','orange'];

 console.log(...arr);
</script>

輸出的結果：是三個數， apple banana orange

...[1,2,3,4,5] ===變成===1,2,3,4,5

結論：三個點(...)能夠展開陣列！

例子6--傳的是一組資料，不是陣列的情況

<script>
 function (a){
  console.log(a);
 }

 show(1,2,3,4,5,6);
</script>

輸出的結果：1

例子7--重置（...可展可收）

<script>
 function show(...a){
  console.log(a);
 }

 show(1,2,3,4,5,6);
</script>

輸出的結果：是一個數組，(6) [1,2,3,4,5,6]

結論：三個點(...)可以把資料重置成一個數組！

例子8--arguments 把資料重置成一個數組，並排序輸出

<script>
 function show(){
  let a=Array.prototype.slice.call(arguments);
  return a.sort();
 }
 console.log(show(10,-2,103,-4,56));
</script>

例子9--為什麼三個點還叫剩餘運算子？

<script>
 function show(a,b, ...c){
  console.log(a,b);
console.log(c);
 }
 show(1,2,3,4,5);
</script>

輸出的結果：a=1 b=2

c= (3) [345]

注意：做剩餘運算子的時候，只能放在最後引數！

3.箭頭函式 =>

例子10--傳統

<script>
 function show(){
  return 1;
 }
console.log(show());
</script>

例子11--簡寫

<script>
function show = () =>1;

console.log(show());
</script>

注意：

• this問題，定義函式所在的物件，不再是執行時所在的物件。
• 箭頭函式裡面沒有 arguments ,用 ' ... '
• 箭頭函式不能當建構函式