什么是Iterator

Iterator是一种接口，为不同的数据结构提供统一的访问机制。任何数据结构只要部署了Iterator接口，就可以完成遍历，而且这种遍历操作是依次遍历该数据结构的所有成员

Iterator遍历器的作用

1.为各种数据结构提供一个统一的，简便的访问接口

2.使得数据结构的成员能够按照某种次序排列

3.ES6新增的遍历for...of循环，Iterator接口主要供for...of消费

- 阅读剩余部分 -

Map是键值对的集合，类似于对象，当时键的范围不限于字符串，各种类型的值，包括对象都可以当做键。也就是说Object结构提供了“字符串-值”的对应，Map结构提供了“值-值”的对应，是一种更完善的Hash结构。

创建一个Map

const map = new Map([
    ["a", 1],
    ["b", 2]
]);

- 阅读剩余部分 -

Set是ES6新的数据结构，类似于数组，但是Set成员的值都是唯一的，没有重复的值,key和value相同

创建一个Set

//参数是一个数组
const s = new Set([1, 2, 3, 4]);

- 阅读剩余部分 -

解构赋值本质上是一种匹配模式，只要两边的模式相同，那么左边的变量就可以被赋予对应的值

数组的解构赋值

在ES5中，给多个变量赋值可能是这样

var a = 1, b = 2, c = 3;
//或者这样
var a = 1;
var b = 2;
var c = 3;

- 阅读剩余部分 -

let

let用来声明一个变量

1.let声明的变量只在所在的代码块里面有效

{
    let a = 1;
    var b = 2;
}
console.log(a);
console.log(b);

打印a的时候会报错a is not defined

- 阅读剩余部分 -

接上一篇webpack打包（八）--babel

随着打包的资源越来越多，dist目录生成的资源就越多，图片，页面，脚本全部混在一起，不容易进行维护，分门别类很有必要

分类后的dist目录结构

- 阅读剩余部分 -

接上一篇webpack打包（七）--使用sass

在webpack打包（三）--使用loader中就使用过了babel-loader的预设编译react,babel能处理的事情还有很多，比如处理es6代码。

安装CLI和预设

npm i -D babel-cli babel-preset-es2015

es2015依赖于babel-cli

- 阅读剩余部分 -

接上一篇webpack打包（六）--css模块化

写样式用sass又方便又高效，习惯之后根本回不去。

安装loader

npm i -D sass-loader node-sass

sass-loader依赖node-sassloader

- 阅读剩余部分 -

接上一篇webpack打包（五）--使用loader处理图片

在app.js中把引入的图片去掉

import React from "react";
import ReactDOM from "react-dom";

import "./common/style/main.css"   

ReactDOM.render(
    <div>React</div>,
    document.getElementById("root")
);

- 阅读剩余部分 -

接上一篇webpack打包（四）--使用webpack-dev-server

在src文件夹下面新建文件夹common,在common下面分别新建img和style文件夹

把src下面的main.css放到style里面，修改app.js里面样式的引用路径import "./common/style/main.css"

准备图片

两张图片，一张小于10kb，一张大于10kb即可，放到img目录

- 阅读剩余部分 -