我有一个函数，我试图转换为ES6中的新箭头语法。它是一个命名函数:
function sayHello(name) {
console.log(name + ' says hello');
}
有没有办法给它一个没有var语句的名字:
var sayHello = (name) => {
console.log(name + ' says hello');
}
显然，我只能在定义这个函数之后才能使用它。大致如下:
sayHello = (name) => {
console.log(name + ' says hello');
}
在ES6中有新的方法来做到这一点吗?
当前回答
如果你所说的“named”是指你想要设置箭头函数的.name属性，那么你很幸运。
如果在赋值表达式的右边定义了一个箭头函数，引擎将接受左边的名称并使用它来设置箭头函数的.name。
var sayHello = (name) => {
console.log(name + ' says hello');
}
sayHello.name //=== 'sayHello'
话虽如此，你的问题似乎更多的是“我能得到一个箭头函数来提升吗?”这个问题的答案恐怕是一个大大的“不”。
其他回答
不。箭头语法是匿名函数的缩写形式。匿名函数是匿名的。
命名函数用function关键字定义。
实际上，它看起来像命名箭头函数的一种方式(至少在chrome 77…)是这样做的:
"use strict";
let fn_names = {};
fn_names.foo = () => { throw new Error(); };
console.log("foo.name is: " + foo.name);
try {
foo();
} catch (e) {
console.log(e.stack);
}
似乎这在ES7中是可能的: https://babeljs.io/blog/2015/06/07/react-on-es6-plus#arrow-functions
给出的例子是:
class PostInfo extends React.Component {
handleOptionsButtonClick = (e) => {
this.setState({showOptionsModal: true});
}
}
ES6的箭头函数体与围绕它们的代码共享相同的词法this，这得到了我们想要的结果，因为ES7属性初始化器的作用域是这样的。
请注意，为了让它与babel一起工作，我需要启用最具实验性的ES7 stage 0语法。在我的webpack.config.js文件中，我更新了babel加载器，如下所示:
{test: /\.js$/, exclude: /node_modules/, loader: 'babel?stage=0'},
如果你所说的“named”是指你想要设置箭头函数的.name属性，那么你很幸运。
如果在赋值表达式的右边定义了一个箭头函数，引擎将接受左边的名称并使用它来设置箭头函数的.name。
var sayHello = (name) => {
console.log(name + ' says hello');
}
sayHello.name //=== 'sayHello'
话虽如此，你的问题似乎更多的是“我能得到一个箭头函数来提升吗?”这个问题的答案恐怕是一个大大的“不”。
您可以跳过函数部分和箭头部分来创建函数。例子:
class YourClassNameHere{
constructor(age) {
this.age = age;
}
foo() {
return "This is a function with name Foo";
}
bar() {
return "This is a function with name bar";
}
}
let myVar = new YourClassNameHere(50);
myVar.foo();
