Question

我是redux的新手，并对其语法感到困惑。

在Tutorial - 02_about-state-and-meet-redux中，我看到了

import { createStore } from 'redux'

var store = createStore(() => {})

我很惊讶：

否;，如python
什么是() => {}？
导入遵循什么规则？
Redux使用的语法是什么？

Frontend javascript没有这样的语法，我也检查了node.js：The Node Beginner Book，这也是不同的。

搜索redux grammar结果。

Answer 1

这是javascript，但它使用了最新规范（称为ES6或ES2015）引入的许多前沿功能。由于它still not fully supported即使是现代浏览器，您也应该使用babel之类的转录程序来发送代码。

您可以阅读有关ES6 here和here的更多信息。

Answer 2

不; ，像python

JavaScript中不需要分号。就个人而言，我总是使用它们。你可以找到一些讨论分号正面和负面的好文章。

什么是（）=＆gt; {}吗

正如其他人所说，这是ES6（也称为ES2015）语法，并定义了一个函数。它们有时被称为箭头函数，您可以阅读有关它们的更多信息here。

所以（a）=＆gt; {return a * 2; }等价于函数（a）{return a * 2; }

导入遵循什么规则？

导入类似于 require 。您可以阅读here和导出here。它们是es6 / es2015模块语法的一部分。

浏览器尚不支持

es6 / es2015。但是，使用BabelJS和Traceur等转录器可以让您今天使用它。我强烈建议您花些时间使用它。为了更好地理解例子，它对我很有帮助。我发现它是一种更清晰的语法，但这是学习它的一个更主观的原因。

Answer 3

这些是ES6语法，等同于以下简单语法：

import { createStore } from 'redux';

function actionCreator (){
 ......
}

var store = createStore(action_creator);

此处，仅从redux和函数createStore导入createStore函数，并将actionCreator作为参数并创建store。

Answer 4

来自redux的

createStore函数，接受combineReducers返回的reducer，并返回Providers中定义的组件可访问的状态。

示例代码看起来像..

import allReducers from './YOUR_REDUCER_DIRECTORY'
var store = createStore(allReducers);

<Provider store = store>
 <YOUR_COMPONENT i.e. HEADER/>
</Provider>

此处您的组件可以访问该状态。可以在reducer中定义初始状态。

Answer 5

简化语法：

const createStore = require('redux').createStore;
var store = createStore(function () {}) // This takes your reducer and the middlewares

解释Redux语法

5 个答案: