apps.push({
    loadErrorTime: null,
    name: appName,
    loadImpl,
    activeWhen: activityFn,
    status: NOT_LOADED,
    parcels: {},
    devtools: {
      overlays: {
        options: {},
        selectors: [],
      }
    },
    customProps
  });

window.addEventListener('hashchange', urlReroute);
window.addEventListener('popstate', urlReroute);
function urlReroute() {
  reroute([], arguments)
}

/*
reroute 接收两个参数
pendingPromises：表示正在队列中等待执行的 reroute。reroute 在执行期间，可能会有多个 reroute 被调用（路由触发或者应用注册）。
eventArguments：路由事件触发的 event。只有路由改变才会有这个参数
*/
export function reroute(pendingPromises = [], eventArguments) {
  // appChangeUnderway 是一个开关，用来表示 reroute 是否正处于执行期间。
  // 如果正处于执行期间还会有 reroute 要执行，则会将 reroute 放入队列里等待执行
  if (appChangeUnderway) {
    return new Promise((resolve, reject) => {
      peopleWaitingOnAppChange.push({
        resolve,
        reject,
        eventArguments,
      });
    });
  }

  appChangeUnderway = true;
  // wasNoOp 为 true 表示没有应用发生变更。
  let wasNoOp = true;

  if (isStarted()) {
    return performAppChanges();
  } else {
    return loadApps();
  }

  function loadApps() {
    return Promise.resolve().then(() => {
      const loadPromises = getAppsToLoad().map(toLoadPromise);
      // 获取要 load 的 app（未出错的命中的），如果有说明应用发生了变更
      if (loadPromises.length > 0) {
        wasNoOp = false;
      }
      // 执行 load 并且直接 finishUpAndReturn
      // 并不进行 mount，因为未 start，此时进行预加载
      // 即：页面上没有挂载该应用，但是会去请求对应的资源文件
      // 不会去调用应用文件里的bootstrap、mount、unmount等生命周期
      return Promise
        .all(loadPromises)
        .then(finishUpAndReturn)
        .catch(err => {
          callAllEventListeners();
          throw err;
        })
    })
  }

  function performAppChanges() {
    return Promise.resolve().then(() => {
      window.dispatchEvent(new CustomEvent("single-spa:before-routing-event", getCustomEventDetail()));
      const unloadPromises = getAppsToUnload().map(toUnloadPromise);

      const unmountUnloadPromises = getAppsToUnmount()
        .map(toUnmountPromise)
        .map(unmountPromise => unmountPromise.then(toUnloadPromise));

      const allUnmountPromises = unmountUnloadPromises.concat(unloadPromises);
      // 获取要 unload 以及要 unmout 的 app，如果有表示应用发生了变更
      // 如果此时触发的是子应用内部的路由，则此时 allUnmountPromises 为[]，表示没有应用的卸载或挂载
      if (allUnmountPromises.length > 0) {
        wasNoOp = false;
      }

      const unmountAllPromise = Promise.all(allUnmountPromises);

      const appsToLoad = getAppsToLoad();
      // 在其他应用 unmounting 期间将需要 load 的 app 执行 load、bootstrap（并行优势），等所有的 unmounting 都结束之后去挂载当前的 app
      const loadThenMountPromises = appsToLoad.map(app => {
        return toLoadPromise(app)
          .then(toBootstrapPromise)
          .then(app => {
            return unmountAllPromise
              .then(() => toMountPromise(app))
          })
      })
      // 如果有要挂载的 app，也说明应用发生了变更
      if (loadThenMountPromises.length > 0) {
        wasNoOp = false;
      }
      // 获取已经 bootstrap 要去 mount 的 app，同上，等到其他 app unmounting 之后执行挂载
      const mountPromises = getAppsToMount()
        .filter(appToMount => appsToLoad.indexOf(appToMount) < 0)
        .map(appToMount => {
          return toBootstrapPromise(appToMount)
            .then(() => unmountAllPromise)
            .then(() => toMountPromise(appToMount))
        })
      // 同上
      if (mountPromises.length > 0) {
        wasNoOp = false;
      }
      // 所有要卸载的执行完之后，执行回调
      return unmountAllPromise
        .catch(err => {
          callAllEventListeners();
          throw err;
        })
        .then(() => {
          callAllEventListeners();

          return Promise
            .all(loadThenMountPromises.concat(mountPromises))
            .catch(err => {
              pendingPromises.forEach(promise => promise.reject(err));
              throw err;
            })
            .then(() => finishUpAndReturn(false))
        })

    })
  }

  function finishUpAndReturn(callEventListeners=true) {
    const returnValue = getMountedApps();

    if (callEventListeners) {
      callAllEventListeners();
    }
    pendingPromises.forEach(promise => promise.resolve(returnValue));

    try {
      const appChangeEventName = wasNoOp ? "single-spa:no-app-change": "single-spa:app-change";
      window.dispatchEvent(new CustomEvent(appChangeEventName, getCustomEventDetail()));
      window.dispatchEvent(new CustomEvent("single-spa:routing-event", getCustomEventDetail()));
    } catch (err) {
      setTimeout(() => {
        throw err;
      });
    }
    // 打开开关，执行队列里的 reroute
    appChangeUnderway = false;
    // 虽然批量执行所有等待的 reroute，但这个地方还是需要递归的执行，因为在执行 reroute 期间可能又会有 reroute 进来
    if (peopleWaitingOnAppChange.length > 0) {
      const nextPendingPromises = peopleWaitingOnAppChange;
      peopleWaitingOnAppChange = [];
      reroute(nextPendingPromises);
    }

    return returnValue;
  }

  function callAllEventListeners() {
    pendingPromises.forEach(pendingPromise => {
      callCapturedEventListeners(pendingPromise.eventArguments);
    });

    callCapturedEventListeners(eventArguments);
  }

  function getCustomEventDetail() {
    const result = {detail: {}}

    if (eventArguments && eventArguments[0]) {
      result.detail.originalEvent = eventArguments[0]
    }

    return result
  }
}

const defaultOpts = {
  // required opts
  React: null,
  ReactDOM: null,
  rootComponent: null,
  loadRootComponent: null,
  suppressComponentDidCatchWarning: false,
  domElements: {},

  // optional opts
  domElementGetter: null,
  parcelCanUpdate: true,
}
export default function singleSpaReact(userOpts) {
  // ...
  const opts = {
    ...defaultOpts,
    ...userOpts,
  };
  // ...
  const lifecycles = {
    bootstrap: bootstrap.bind(null, opts),
    mount: mount.bind(null, opts),
    unmount: unmount.bind(null, opts),
  };
  // ...

  return lifecycles
}

// b.js
export default B = 'b';

// a.js
import B from './b';
console.log(B);
export const A = 'a';

// index.js
import { A } from './a';
console.log(A);

(function(modules) { // webpackBootstrap
    // ...

    // Load entry module and return exports
    return __webpack_require__(__webpack_require__.s = "./src/index.js");
})(
    {
    "./src/a.js": (function(module, __webpack_exports__, __webpack_require__) {},
    "./src/b.js": (function(module, __webpack_exports__, __webpack_require__) {},
    "./src/index.js": (function(module, __webpack_exports__, __webpack_require__) {}
    }
)

// The require function
function __webpack_require__(moduleId) {

    // Check if module is in cache
    if(installedModules[moduleId]) {
        return installedModules[moduleId].exports;
    }
    // Create a new module (and put it into the cache)
    var module = installedModules[moduleId] = {
        i: moduleId,
        l: false,
        exports: {}
    };

    // Execute the module function
    modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);

    // Flag the module as loaded
    module.l = true;

    // Return the exports of the module
    return module.exports;
}

/***/ "./src/index.js":
/*!**********************!*\
  !*** ./src/index.js ***!
  \**********************/
/*! no exports provided */
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _a__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./a */ \"./src/a.js\");\n\nconsole.log(_a__WEBPACK_IMPORTED_MODULE_0__[\"A\"]);\n\n//# sourceURL=webpack:///./src/index.js?");

/***/ })

"./src/index.js":
(function(module, __webpack_exports__, __webpack_require__) {

    "use strict";
    __webpack_require__.r(__webpack_exports__);
    var _a__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("./src/a.js");
    console.log(_a__WEBPACK_IMPORTED_MODULE_0__["A"]);

})

"./src/a.js":
(function(module, __webpack_exports__, __webpack_require__) {

    "use strict";
    __webpack_require__.r(__webpack_exports__);
    __webpack_require__.d(__webpack_exports__, "A", function() { return A; });
    var _b__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("./src/b.js");
    console.log(_b__WEBPACK_IMPORTED_MODULE_0__["default"]);
    const A = 'a';
}),

"./src/b.js":
(function(module, __webpack_exports__, __webpack_require__) {
    "use strict";
    __webpack_require__.r(__webpack_exports__);
    __webpack_exports__["default"] = (B = 'b');
}),

// define __esModule on exports
__webpack_require__.r = function(exports) {
    if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
        Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
    }
    Object.defineProperty(exports, '__esModule', { value: true });
};
// define getter function for harmony exports
__webpack_require__.d = function(exports, name, getter) {
    if(!__webpack_require__.o(exports, name)) {
        Object.defineProperty(exports, name, { enumerable: true, get: getter });
    }
};
// Object.prototype.hasOwnProperty.call
__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };

class ListOfWords extends React.PureComponent {
  render() {
    return <div>{this.props.words.join(',')}</div>;
  }
}

class WordAdder extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      words: ['marklar']
    };
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick() {
    // 这部分代码很糟，而且还有 bug
    const words = this.state.words;
    words.push('marklar');
    this.setState({words: words});
  }

  render() {
    return (
      <div>
        <button onClick={this.handleClick} />
        <ListOfWords words={this.state.words} />
      </div>
    );
  }
}

state = {
    user: {
      id: 1,
      name: "Cory",
      address: {
        city: "Kansas City",
        state: "Kansas",
        modified: new Date().toLocaleTimeString()  // 现在需要改变这个值
      }
    }
  };

mutate = () => {
   const user = this.state.user; // still mutating user since just a ref!
   user.address.modified = new Date().toLocaleTimeString();
   this.setState({ user });
 };

shallow = () => {
  const user = { ...this.state.user };
  user.address.modified = new Date().toLocaleTimeString();
  this.setState({ user });
};

deep = () => {
  const user = {
    ...this.state.user,
    address: { ...this.state.user.address }
  };
  user.address.modified = new Date().toLocaleTimeString();
  this.setState({ user });
};

function objectFactory(...args) {

    // 取出第一个参数（构造器），并从参数中删除。
    const Constructor = args.shift();

    // 创建一个空对象，并将空对象的_proto_属性指向构造函数的 prototype 属性
    // 不建议直接操作_proto_属性（obj.__proto__ = Constructor.prototype）
    const obj = Object.create(constructor.prototype);

    // 执行构造器， 将构造函数内的 this 指向为 obj
    var result = Constructor.apply(obj, args); 

    // 如果构造器返回对象则返回这个对象，否则返回新建的对象。
    return (typeof result === 'object' && result != null) ? result : obj; 
};

// 使用方式
function Person(name) {
  this.name = name
}
const person = new objectFactory(Person, 'season')
console.log(person)

Child.prototype = new Parent()

function Child(name) {
    this.name = name;
}
Child.prototype = new Parent()
function Parent(name) {
    this.name = name;
    this.list = [1, 2, 3];
}
Parent.prototype.getName = function() {
    return this.name
}

var child1 = new Child('child1');
console.log(child1.getName()); // child1
child1.list.push(4);

var child2 = new Child('child2');
console.log(child2.getName()); // child2
console.log(child2.list); // [1, 2, 3, 4]

function Child (args) {
    // ...
    Parent.call(this, args)
}

function Child(name, args) {
    this.name = name;
    Parent.call(this, args)
}

function Parent(name) {
    this.name = name;
    this.list = [1, 2, 3];
}
Parent.prototype.getName = function() {
    return this.name
}

var child1 = new Child('child1', 'parent1');
console.log(child1.getName()); // Uncaught TypeError: child1.getName is not a function
child1.list.push(4);
console.log(child1.list) // [1, 2, 3, 4]

var child2 = new Child('child2', 'parent2');
console.log(child2.list); // [1, 2, 3]

function Child (args1, args2) {
    // ...
    this.args1 = args1
    Parent.call(this, args2)
}
Child.prototype = new Parent()
Child.prototype.constrcutor = Child

function Child(name, args) {
    this.name = name;
    Parent.call(this, args)
}
Child.prototype = new Parent();
Child.prototype.constrcutor = Child;
function Parent(name) {
    this.name = name;
    this.list = [1, 2, 3];
}
Parent.prototype.getName = function() {
    return this.name
}

var child1 = new Child('child1', 'parent1');
console.log(child1.getName()); // parent1
child1.list.push(4);
console.log(child1.list) // [1, 2, 3, 4]

var child2 = new Child('child2', 'parent2');
console.log(child2.list); // [1, 2, 3]

function object(o) {
    function F() {}
    F.prototype = o;
    return new F();
}

function object(o) {
    function F() {}
    F.prototype = o;
    return new F();
}
var parent = {
    name: 'parent',
    list: [1, 2, 3]
}

var child1 = object(parent);
child1.name = "child1";
console.log(child1.name); // 'child1'
child1.list.push(4);
console.log(child1.list); //  [1, 2, 3, 4]

var child2 = object(parent);
console.log(child2.list); // [1, 2, 3, 4]

function createAnother(original){
    var clone = object(original);
    clone.sayHi = function(){  // 以某种方式来增强这个对象，给该对象增加一个 sayHi 方法
        alert("hi");
    };
    return clone;
}

function object(o) {
    function F() {}
    F.prototype = o;
    return new F();
}
function inheritPrototype(subType, superType){
    var prototype = object(superType.prototype);
    prototype.constructor = subType;
    subType.prototype = prototype;
}
function Parent(name) {
    this.name = name;
    this.list = [1, 2, 3];
}
Parent.prototype.getName = function() {
    return this.name
}

function Child(name, args) {
    this.name = name;
    Parent.call(this, args);  // 通过构造函数来继承属性
}
inheritPrototype(Child, Parent); // 通过寄生式继承来继承父类的原型


var child1 = new Child('child1', 'parent1');
console.log(child1.getName()); // parent1
child1.list.push(4);
console.log(child1.list) // [1, 2, 3, 4]

var child2 = new Child('child2', 'parent2');
console.log(child2.list); // [1, 2, 3]

Child.prototype = Object.create(Parent.prototype);
Child.prototype.constructor = Child;

class Parent {
    constructor(){
        this.name = 'parent';
        this.list = [1, 2, 3];
    }
    getName() {
        return this.name
    }
}
class Child extends Parent {
    constructor(){
        super()
    }
}
var child1 = new Child();
console.log(child1.name); // parent
console.log(child1.getName())  // parent
child1.list.push(4)  // parent
console.log(child1.list)  // [1, 2, 3, 4]

var child2 = new Child();
console.log(child2.name); // parent
console.log(child2.getName())  // parent
console.log(child2.list)  // [1, 2, 3]

// ... 省略一些方法定义
function _inherits(subClass, superClass) {
    // 父类必须是函数并且不能为null
    if (typeof superClass !== "function" && superClass !== null) {
        throw new TypeError("Super expression must either be null or a function"); 
    } 
    // 通过Object.create实现继承，第二个参数用来修复子类的 constructor
    subClass.prototype = Object.create(superClass && superClass.prototype, {
        constructor: {
            value: subClass,
            writable: true,
            configurable: true 
        } 
    });
    // 设置子类的 __proto__ 属性指向父类
    if (superClass) 
        _setPrototypeOf(subClass, superClass);
}
function _setPrototypeOf(o, p) {
    _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
        o.__proto__ = p; return o;
    };
    return _setPrototypeOf(o, p);
}
// 两个参数，一个参数是指向子类实例的this，另一个参数是 调用父类构造函数的返回值
function _possibleConstructorReturn(self, call) {
    // 如果父类返回的是对象或者函数，则返回 父类构造函数生成的this（Parent.call(this)），否则返回子类的this
    if (call && (_typeof(call) === "object" || typeof call === "function")) {
        return call; 
    } 
    return _assertThisInitialized(self);
}

function _getPrototypeOf(o) {
    _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
        return o.__proto__ || Object.getPrototypeOf(o); 
        };
    return _getPrototypeOf(o);
}


var Parent =
/*#__PURE__*/
function () {
  function Parent() {
    _classCallCheck(this, Parent);

    this.name = 'parent';
    this.list = [1, 2, 3];
  }

  _createClass(Parent, [{
    key: "getName",
    value: function getName() {
      return this.name;
    }
  }]);

  return Parent;
}();

var Child =
/*#__PURE__*/
function (_Parent) {
    // 通过 Object.create 实现继承
  _inherits(Child, _Parent);

  function Child() {
      // 确保类是通过 new 作为构造函数调用而不是直接调用
    _classCallCheck(this, Child);
    // _getPrototypeOf(Child) 返回 子类的原型（父类构造函数），通过子类 this 执行父类构造函数的方法
    return _possibleConstructorReturn(this, _getPrototypeOf(Child).call(this));
  }

  return Child;
}(Parent);