***************************************************class************************************************

关于super

1、super前方不可以有this操作，例如：

image.png

2、作为函数调用

image.png

4、在构造方法中使用或一般方法中使用super
super 代表父类的原型对象 Person.prototype
所以定义在父类实例上的方法或属性，是无法通过 super 调用的
通过 super 调用父类的方法时，方法内部的 this 指向当前的子类实例

// 2.1
      // class Person {
      //   constructor(name) {
      //     this.name = name;

      //     console.log(this);
      //   }

      //   speak() {
      //     console.log('speak');
      //     // console.log(this);
      //   }

      //   static speak() {
      //     console.log('Person speak');
      //     console.log(this);
      //   }
      // }
      // class Programmer extends Person {
      //   constructor(name, sex) {
      //     super(name, sex);

      //     // console.log(super.name);
      //     // super.speak();
      //   }

      //   // hi() {
      //   //   super(); // ×
      //   // }

      //   speak() {
      //     super.speak();
      //     console.log('Programmer speak');
      //   }

5、在静态方法中使用super
指向父类，而不是父类的原型对象
通过 super 调用父类的方法时，方法内部的 this 指向当前的子类，而不是子类的实例
6、注意事项
使用 super 的时候，必须显式指定是作为函数还是作为对象使用，否则会报错

******************************************导入和导出******************************************

export default和对应的import

1、一个模块没有导出，也可以将其导入，被导入的代码都会执行一遍，也仅会执行一遍
2、一个模块只能有一个export default

export 和对应的import

1、使用export 导出时，必须是声明或者语句，不能使一个值，例如：
错误写法：

image

正确写法：

image

2、在使用import导入时，不能随意命名，要和导出的名字保持一致

Module的注意事项

1、模块顶层的this指向undefined
2、import和import()

import命令具有提升效果，会提升到整个模块的头部，率先执行。

import执行的时候，代码还没执行

import赫尔rxport命令只能在模块的顶层，不能再代码块中执行。

import()可以按条件导入，例如：

image

**********************************************babel和webpack******************************

babel

1、使用babel，需要安装babel/core @babel/cli
2、在package.json文件中配置

image.png

3、安装babel/preset-env

image.png

image.png

webpack

1、初始化项目

npm init

2、安装webpack需要的包

image.png

3、配置webpack
新建webpack.config.js文件配置
4、配置，运行

image.png

image.png

6、html-webpack-plugin
安装：

image.png

image.png