تايب سكريبت - الفرق بين import ... و import {...} (مع الأقواس المعقوفة)


بالقدوم من جافا إلى TS، لقد تخطيت {...} حول النوع المستورد.

import DiscriminatorMappingData from './DiscriminatorMappingData';

بدلاً من

import {DiscriminatorMappingData} from './DiscriminatorMappingData';

انظر TypeScript - تخزين فئة كقيمة خريطة؟

لقد قرأت الوثائق ولم أفهم الكثير. ما فهمته فقط هو أنه عندما أحتاج إلى نوع واحد فقط من ملف، يمكنني حذف {}.
ومع ذلك، تسبب ذلك في أخطاء غريبة، مثل "اسم غير معروف"، أو عدم توافق أنواع غير متوقع.

إذن، ما الفرق، ببساطة؟

الإجابة رقم 1

الفرق بين إعلاني import الخاصين بك مغطى في مواصفة TypeScript. من الفقرة §11.3.2، إعلانات الاستيراد:

إعلان استيراد من الشكل

    import d from "mod";

يعادل تمامًا تصريح الاستيراد

    import { default as d } from "mod";

لذلك، ستتجاوز الأقواس فقط عندما تقوم باستيراد شيء تم تصديره ككيان افتراضي من الوحدة (مع إعلان export default، والذي يمكن أن يكون هناك واحد فقط لكل وحدة). الاسم الذي تقدمه في إعلان import يصبح اسمًا مستعارًا لذلك الكيان المستورد.

عند استيراد أي شيء آخر، حتى لو كان مجرد كيان واحد، تحتاج إلى توفير الأقواس.

الإجابة رقم 2

يجب أن يكون الاستيراد default بدون أقواس معقوفة. من السهل فهمه من خلال المثال التالي لوظائف الآلة الحاسبة.

// Calculator.ts

export default function plus() { }    // Default export 

export function minus() { }           // Named export

export function multiply() { }        // Named export

الوارد الافتراضي: بدون أقواس متعرجة

// CalculatorTest.ts

import plus from "./Calculator"

يجب ألا يتم إحاطة plus بالأقواس المعقوفة لأنه يتم تصديره باستخدام الكلمة المفتاحية default.


استيراد مسمى: مع الأقواس المعقوفة

// CalculatorTest.ts

import plus, { minus, multiply } from "./Calculator"

يجب أن يكون minus وmultiply داخل الأقواس المعقوفة لأنها مُصدرة باستخدام الكلمة المفتاحية export فقط. لاحظ أن plus خارج الأقواس المعقوفة.


اسم مستعار للاستيراد الافتراضي

إذا كنت تريد اسمًا مستعارًا للاستيراد default، يمكنك القيام بذلك مع/بدون الأقواس المعقوفة:

// CalculatorTest.ts

import { default as add, minus, multiply } from "./Calculator"

أو

// CalculatorTest.ts

import add, { minus, multiply} from './Calculator'

الآن تصبح الدالة plus() هي add(). هذا يعمل لأنه يُسمح بتصدير افتراضي واحد فقط لكل وحدة.


هذا كل شيء! آمل أن يكون ذلك مفيدًا.