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);