当前位置: 代码迷 >> 综合 >> JS箭头函数 Arrow Function
  详细解决方案

JS箭头函数 Arrow Function

热度:75   发布时间:2023-11-22 13:20:40.0

箭头函数 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);

 

 

 

 

  相关解决方案