JavaScript中的函数申明、函数表达式、箭头函数
JavaScript中的函数可以通过几种方式创建，如下。
//函数声明
functiongetName(){
return'Michael'
}
//函数表达式
constgetName=function(){
return'Michael'
}
//箭头函数（同样也是表达式）
constgetName=()=>{
return'Michael'
}
函数声明和表达式之间的差别是
JavaScript解释器中存在一种变量声明被提升的机制，也就是说函数声明会被提升到作用域的最前面，即使写代码的时候是写在最后面，也还是会被提升至最前面。而用函数表达式创建的函数是在运行时进行赋值，且要等到表达式赋值完成后才能调用
看一个例子
getName()//oaoafly
vargetName=function(){
console.log('wscat')
}
getName()//wscat
functiongetName(){
console.log('oaoafly')
}
getName()//wscat
上面的问题可以分解成两个简单的问题，有助于你更清楚的看出函数声明和表达式之间的区别
vargetName;
console.log(getName)//undefined
getName()//UncaughtTypeError:getNameisnotafunction
vargetName=function(){
console.log('wscat')
}
vargetName;
console.log(getName)//functiongetName(){console.log('oaoafly')}
getName()//oaoafly
functiongetName(){
console.log('oaoafly')
}
这个区别看似微不足道，但在某些情况下确实是一个难以察觉并且“致命“的陷阱。出现这个陷阱的本质原因体现在这两种类型在函数提升和运行时机（解析时/运行时）上的差异。
箭头函数
箭头函数是语法和函数表达式比起来稍有不同的函数表达式。在上面的示例中，你可以看到箭头函数看起来像函数表达式，但没有单词function，然后在括号和大括号之间带有粗箭头=>。
你可能听说过，在JavaScript中，函数会创建自己的作用域。这意味着JavaScript函数会创建自己的上下文this，如果我们需要一个函数但是这个函数却没有自己的上下this，那么就可能会遇到问题。箭头函数的特征之一是它们不创建上下文，因此箭头函数的内部this与外部的this相同。
箭头函数也可以很小巧。查看下面两个完全相同的示例：
constgetName=()=>{
return'Michael'
}
//和上面的相同，但是更小巧
constgetName=()=>'Michael'
当箭头函数忽略其大括号时，表示我们希望粗箭头右侧的内容为返回值（不用加return）。这称为隐式返回值。关于箭头函数，还有一些更细微的细节需要了解，例如如何返回对象以及如何省略单个参数的括号。
//箭头函数直接返回对象
constgetStudent=()=>({name:'Michael',age:18,});
//省略单个参数的括号
constaddOne=(n)=>n+1;
constaddOne=n=>n+1;
总结
以上所述是小编给大家介绍的JavaScript中的函数申明、函数表达式、箭头函数，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对毛票票网站的支持！如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！
声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。