JavaScript(基于react+dva)

最新推荐文章于 2024-11-07 18:53:37 发布

weixin_30399821

最新推荐文章于 2024-11-07 18:53:37 发布

阅读量74

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/JunneHu/p/JunneHu.html

本文详细介绍了ES6中新增的重要特性，包括变量声明方式如const和let、模板字符串的使用、默认参数设置、箭头函数的语法糖、模块的导入导出、对象和数组的新特性如析构赋值及Spread Operator、Promise的异步处理方式以及Generators的使用方法等。

变量声明

const 和 let：分别表示常量和变量

模板字符串

const user = 'world';

console.log(`hello ${user}`); // hello world

默认参数

function logActivity(activity = 'skiing') {

　　console.log(activity);

}

logActivity(); // skiing

箭头函数

[1, 2, 3].map(x => x + 1); // [2, 3, 4]

模块的 Import 和 Export

// 引入全部
import dva from 'dva';

// 引入部分
import { connect } from 'dva';

// 引入全部并作为 Icon 对象
import * as Icon from './Icon';

// 导出默认
export default App;

// 部分导出，需 import { App } from './file'; 引入
export class App extend Component {};

ES6 对象和数组

　　析构赋值

　　const { name, age } = user;
　　const [foo, bar] = arr;

　　对象字面量改进(析构的反向操作)

　　const name = 'duoduo';
　　const age = 8;
　　const user = { name, age };

　　Spread Operator(即 3 个点 `...`)　　　

　　const todos = ['Learn dva'];
　　[...todos, 'Learn antd'];  // ['Learn dva', 'Learn antd']

Promises

　　Promise 用于更优雅地处理异步请求

Generators

　　dva 的 effects 是通过 generator 组织的

　　Generator 返回的是迭代器，通过 yield 关键字实现暂停功能，把异步逻辑通过同步的方式组织起来

　　app.model({
  　　namespace: 'users',
  　　effects: {
    　　*fetch({ payload: {page = 1}}, { put, call }) {
      　　const { data } = yield call(users.fetch, { page });
      　　yield put({ type: 'save', payload: data });
    　　},
 　　 },
　　});