Apa yang dilakukan “ekspor default” di BEJ?

Saya ingin bertanya apa arti kalimat terakhir dan artinya (ekspor default HelloWorld;) tetapi saya tidak dapat menemukan tutorial tentang hal itu.

// hello-world.jsx

import React from 'react';

class HelloWorld extends React.Component {
  render() {
    return <p>Hello, world!</p>;
  }
}

export default HelloWorld;

Ekspor suka export default HelloWorld;dan impor , seperti import React from 'react'bagian dari sistem modul ES6 .

Modul adalah unit mandiri yang dapat mengekspos aset ke modul lain menggunakan export, dan memperoleh aset dari modul lain menggunakan import.

Dalam kode Anda:

import React from 'react'; // get the React object from the react module

class HelloWorld extends React.Component {
  render() {
    return <p>Hello, world!</p>;
  }
}

export default HelloWorld; // expose the HelloWorld component to other modules

Dalam ES6 ada dua jenis ekspor:

Ekspor yang dinamai - misalnya export function func() {}adalah ekspor yang dinamai dengan nama func. Modul yang dinamai dapat diimpor menggunakan import { exportName } from 'module';.Dalam hal ini, nama impor harus sama dengan nama ekspor. Untuk mengimpor func pada contoh, Anda harus menggunakan import { func } from 'module';. Mungkin ada beberapa ekspor bernama dalam satu modul.

Ekspor default - adalah nilai yang akan diimpor dari modul, jika Anda menggunakan pernyataan impor sederhana import X from 'module'. X adalah nama yang akan diberikan secara lokal ke variabel yang ditugaskan untuk berisi nilai, dan itu tidak harus dinamai seperti ekspor asal. Hanya ada satu ekspor standar.

Modul dapat berisi ekspor bernama dan ekspor default, dan mereka dapat diimpor bersama-sama menggunakan import defaultExport, { namedExport1, namedExport3, etc... } from 'module';.

export default digunakan untuk mengekspor satu kelas, fungsi atau primitif dari file skrip.

Ekspor juga dapat ditulis sebagai

export default class HelloWorld extends React.Component {
  render() {
    return <p>Hello, world!</p>;
  }
}

Anda juga dapat menulis ini sebagai komponen fungsi seperti

export default const HelloWorld = () => (<p>Hello, world!</p>);

Ini digunakan untuk mengimpor fungsi ini dalam file skrip lain

import HelloWorld from './HelloWorld';

Anda tidak perlu mengimpornya karena HelloWorldAnda dapat memberikan nama apa pun karena ini adalah ekspor default

Sedikit tentang ekspor

Seperti namanya, ini digunakan untuk mengekspor fungsi, objek, kelas atau ekspresi dari file skrip atau modul

Utiliites.js

export function cube(x) {
  return x * x * x;
}
export const foo = Math.PI + Math.SQRT2;

Ini dapat diimpor dan digunakan sebagai

App.js

import { cube, foo } from 'Utilities';
console.log(cube(3)); // 27
console.log(foo);    // 4.555806215962888

Atau

import * as utilities from 'Utilities';
console.log(utilities.cube(3)); // 27
console.log(utilities.foo);    // 4.555806215962888

Ketika standar ekspor digunakan, ini jauh lebih sederhana. File skrip hanya mengekspor satu hal. cube.js

export default function cube(x) {
  return x * x * x;
};

dan digunakan sebagai App.js

import Cube from 'cube';
console.log(Cube(3)); // 27

Dalam Kata Sederhana -

Pernyataan ekspor digunakan saat membuat modul JavaScript untuk mengekspor fungsi, objek, atau nilai primitif dari modul sehingga dapat digunakan oleh program lain dengan pernyataan impor.

Berikut ini tautan untuk mendapatkan pemahaman yang jelas: MDN Web Documents

Pengertian paling sederhana default exportadalah

Export adalah fitur ES6 yang digunakan untuk Mengekspor modul (file) dan menggunakannya dalam beberapa modul (file) lainnya.

Ekspor Default:

1. default export adalah konvensi jika Anda ingin mengekspor hanya satu objek (variabel, fungsi, kelas) dari file (modul).
2. Hanya ada satu ekspor standar per file, tetapi tidak terbatas pada hanya satu ekspor .
3. Saat mengimpor objek default yang diekspor, kami juga dapat mengganti nama.

Ekspor atau Ekspor Bernama:

1. Ini digunakan untuk mengekspor objek (variabel, fungsi, calss) dengan nama yang sama.

2. Ini digunakan untuk mengekspor beberapa objek dari satu file.

3. Tidak dapat diganti namanya saat mengimpor dalam file lain, itu harus memiliki nama yang sama yang digunakan untuk mengekspornya.

Dalam Bereaksi, Vue dan banyak kerangka kerja lainnya, Ekspor sebagian besar digunakan untuk mengekspor komponen yang dapat digunakan kembali untuk membuat aplikasi berbasis modular.