Сводка различий экспорта ES6 и экспорта по умолчанию

внешний интерфейс ECMAScript 6

1. В модуле может быть только один экспорт по умолчанию, но может быть более одного экспорта

    //model.js
    let e1='export 1';
    let e2='export 2';
    let e3='export 3';
    let e4='export 4';
    export {e2};
    export {e3};
    export {e4};
    export default e1;

    //使用模块的index.js
    import e1, {e2, e3, e4} from "./model";
    console.log(e1);
    console.log(e2);
    console.log(e3);
    console.log(e4);

    #index.js运行结果
    export 1
    export 2
    export 3
    export 4

если вmodel.jsдобавить еще одинexport default

    //model.js
    let e5='export e5';
    export default  e5

    #运行结果
    SyntaxError: .../model.js: 
    Only one default export allowed per module. (10:0)
   9 | let e5='export e5';
> 10 | export default  e5

2. Пройдите в модульexportЭкспортируемое (свойство или метод) можно изменить, но черезexport defaultЭкспорт не может быть изменен

    //model.js
    let e1='export 1';
    let e2='export 2';
    export {e2};
    export default e1;
    e1='export 1 modified';
    e2='export 2 modified';

    //index.js
    import e1, {e2}from "./model";
    console.log(e1);
    console.log(e2);

    #index.js执行结果  
    export 1
    export 2 modified

Сначала вам нужно знать:

  1. Модули в ES6 проходятexportиexport defaultОткрытые свойства или методы не являются обычными присваиваниями или ссылками, они аналогичны идентификаторам, определенным внутри модуля.указательпривязка.
  2. Для экспортируемого свойства или метода не имеет значения, куда оно экспортировано, и не имеет значения, когда оно импортировано, важно следующее: текущее значение при доступе к этой привязке.
        //model.js
    let e1='export 1';
    let e2='export 2';
    export {e2};
    export default e1;
    e1='export 1 modified';
    setTimeout(()=>{
        e2='export 2 modified';
    },1000);

        //index.js
    import e1, {e2}from "./model";
    console.log(e1);
    console.log(e2);
    setTimeout(()=>{
        console.log('later',e2)
    },5000);

        //index.js执行结果
    export 1
    export 2
    later export 2 modified

но,exportзаключается в привязке к идентификатору, изменении значения идентификатора, затем доступе к привязке и получении нового значения;export defaultПривязывается значение, на которое указывает идентификатор. Если идентификатор изменить, чтобы он указывал на другое значение, связанное значение не изменится. Если вы хотите изменить экспортируемое значение по умолчанию, вы можете использоватьexport {e1 as default}Этот метод.

    //model.js修改
    export {e1 as default}

    #index.js执行结果
    export 1 modified
    export 2
    later export 2 modified

3. export defaultиexportСинтаксические различия.

  1. export var e1='...'является юридическим заявлением, ноexport default var e2='...'незаконно(letиconstто же).
  2. export defaultЭкспорт идентификаторов можно добавить напрямую, например.export default e2;exportЕсли вы хотите экспортировать уже объявленный индикатор, вы должны использовать{},Напримерexport {e1}, примечание: здесь{}вместо объявления объекта.

Наконец: свойства или методы, экспортируемые модулем, могут быть изменены только внутри модуля, а не в том месте, где модуль импортируется.

Категории