JS箭頭函數 Arrow Function

箭頭函數 Arrow Function

箭頭函數的特點：

1. 能夠使函數的寫法更簡潔（一行寫完一個函數）

2. 函數返回值可以被隱式返回（不需要寫reutrn）
3. 不重新綁定this的值
4. 使用胖箭頭

//如何將下面的函數改寫爲箭頭函數
function doubleValue(value){
    return value * value;
}

 首先要將原來的函數轉化成如下函數

// es6規定 const定義的變量不可以修改，而且必須初始化。
const  doubleValue = function (){
        return value * value;
}

改寫成箭頭函數

// es6規定 const定義的變量不可以修改，而且必須初始化。
const  doubleValue =value =>{
        return value * value;
}

 無參的箭頭函數

// es6規定 const定義的變量不可以修改，而且必須初始化。
const  gretting =() =>{
    console.log('HELLO WORLD'); 
}    

gretting();

有參有返回值的箭頭函數

 

// es6規定 const定義的變量不可以修改，而且必須初始化。
const  gretting =(name) =>{
    
 return 'hello' + name;
}    

console.log(gretting('xx'));

兩個參數有返回值的箭頭函數

// es6規定 const定義的變量不可以修改，而且必須初始化。
const  addNum=(a,b) =>{
 return a + b;
}    
console.log(addNum(1,2));

將以上函數進一步簡化，當括號裏只有一個參數時，可以將其去掉（前提是有且僅有一個參數）

// es6規定 const定義的變量不可以修改，而且必須初始化。
const  gretting = name =>{
    
 return 'hello' + name;
}    

console.log(gretting('zs'));

還可以將其簡化得到如下一行函數

const  gretting = name => 'hello--' + name;
console.log(gretting('fss'));

參數爲數組寫法如下

const companies = ['google','huawei'];
const  result = companies.map( company => 'hello---'+ company );
 console.log(result);