Question

我对JavaScript语法有一些疑问，并期待理解它们。

首先：我不明白下面这个语法，

{
    Key: () => function()
}

真实项目中的示例：

// Define URL routes
// See https://github.com/flatiron/director
var routes = {
    '/': () => render(require('./components/pages/Index')),
    '/privacy': () => render(require('./components/pages/Privacy'))
};

已在https://github.com/kriasoft/react-starter-kit/blob/master/src/app.js

中使用

它想做什么？

是否与{ Key: function() {} }相同？

第二：关于JavaScript Object中的函数，

{
    function() {}
}

真实项目中的示例：

var HomePage = React.createClass({
    statics: {
        layout: App
    },
    componentWillMount() {
        PageActions.set({title: 'React.js Starter Kit'});
    },
    render() {
        return (.....);
    }
});

已在https://github.com/kriasoft/react-starter-kit/blob/master/src/components/pages/Index.js

中使用

我想感谢您解答为什么这些内容有效，或者您是否可以向我发送有关JavaScript对象的这些语法的正确信息？

Answer 1

这是在ES6（JavaScript的下一个版本）中编写函数的新方法。您可以找到更多信息here。

目前尚不支持ES6（请参阅此table），因此您需要在ES5中编译ES6。（发生here，带有旗帜＆＃34;和谐＆＃34;在你的例子中）使其在你的浏览器中运行。

基本上：

var test = () => {}与var test = function() {}.bind(this)

相同

和

componentWillMount() {}与componentWillMount:function() {}

相同

Answer 2

是否与{Key：function（）{}}
相同

不完全，但有点像。这是ECMAScript 6中引入的一种新函数语法。但行为有些不同。

最值得注意的是，函数中this的值将从创建函数的环境中采用this的值，因此它不是基于如何像旧语法一样调用函数

该函数仍然是第一类对象并创建一个闭包，因此在这方面没有区别。此外，如果函数体只包含一个表达式语句，则可以省略return运算符。

正如@HeadCode指出的那样，new运算符不允许与此函数一起使用，因此它不适用于构造对象。我还想说它有适当的尾调优化，但我不确定。

语法的其余部分只是一个典型的对象，除了它使用新的简写进行方法分配。

以下是胖箭头函数语法的MDN文档：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

这是对象初始化程序语法的MDN文档。有关新语法，请参阅ECMAScript6部分：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer

基本JavaScript语法

2 个答案: