Nhập động JavaScript

Tìm hiểu tính năng mới, sắp ra mắt này của JavaScript

Tôi chưa bao giờ có đặc quyền sử dụngnhập khẩu độngcho đến rất gần đây khi tôi sử dụng chúng để cấp nguồn phân tách mã trong ứng dụng Next.js và tôi đã phải thực hiện một chút nghiên cứu vì chúng hơi khác vớinhập khẩu tĩnh.

Nhập tĩnh của một Mô-đun ESxuất mặc địnhtrông như thế này:

import moment from 'moment'

Bạn có thể sử dụng cấu trúc đối tượng để có được một bản xuất được đặt tên:

import { format } from 'date-fns'

Nhập khẩu tĩnh có một số giới hạn:

  • chúng bị giới hạn ở cấp cao nhất của tệp
  • chúng không thể được tải có điều kiện (bên trong mộtif)
  • tên của gói không thể được xác định tại thời điểm thực thi

Nhập khẩu động có thể làm tất cả những điều đó!

Cú pháp có một chút khác biệt.

Và chúng hoạt độngtrong các mô-đun.

Bạn sử dụng chúng như thế này:

const module = await import('module')

và để sử dụng xuất mặc định, trước tiên bạn phải gọi.default().

Ví dụ sử dụng thời điểm:

const moment = (await import('moment')).default()

Mặt khác, hàng nhập khẩu được đặt tên hoạt động như mong đợi:

const { format } = await import('date-fns')

Bạn có thể sử dụng chúng ngay hôm nay không? Đúng! Cáchỗ trợ trình duyệtđã khá tốt, và cũng có mộtPlugin Babel.

Tải xuống miễn phí của tôiSổ tay dành cho Người mới bắt đầu JavaScript


Các hướng dẫn js khác: