جاوااسکریپت - تایپاسکریپت خروجی پیشفرض


من تازه شروع به نگاه کردن به تایپاسکریپت کردهام و هنگام آزمایش با مشکلی مواجه شدم.
میخواهم یک کتابخانه برای مدیریت ساختار درختی عمومی بنویسم و فقط در حال انجام برخی آزمایشهای بسیار پایه برای دیدن نحوه کار تایپاسکریپت هستم.

شروع تنظیمات ساده با ۳ فایل:

  • GForest.ts
  • GTree.ts
  • GNode.ts

در حال حاضر، GForest.ts:

import * as Immutable   from "immutable"; 
import GTree            from "./GTree"; 

export default class Forest{ 
    public static createTree(){ 
        let tree = new GTree(); 
    } 
} 

GTree.ts:

export default class GTree{ 
    constructor(){ 
        console.log("Tree constructed"); 
    } 

    public static createNode(){ 

    } 
} 

من یک فایل test.js ساده ایجاد کردم تا از کتابخانه فراخوانی کنم (TS کامپایل شده به ES5):

var GForest = require("./build/GForest"); 

console.log(GForest); 

هنگام دویدن

> node test

خروجی این است:

من نمیفهمم چرا نتیجه این است:

{ default: { [Function: Forest] createTree: [Function] } }

چرا یک شیء با کلید default وجود دارد و چگونه میتوانم آن را تغییر دهم تا رفتار مورد نظر را به دست آورم؟

به همین دلیل، من نمیتوانم فقط تماس بگیرم:

GForest.createTree(); 

(من میخواهم ایجاد یک درخت را از طریق یک کارخانه ایستا نمایش دهم) آیا کمکی هست؟

پاسخ شماره ۱

از default خروجی پیشفرض در ES6 استفاده کنید

من از مقاله ES6 In Depth: Modules از موزیلا نقل قول میکنم:

اگر دوست دارید ماژول ES6 خودتان یک خروجی پیشفرض داشته باشد، انجام آن آسان است. هیچ چیزی جادویی درباره خروجی پیشفرض وجود ندارد؛ این درست مثل هر خروجی دیگری است، فقط به نام "default" نامگذاری شده است.

در فایل test.js شما، ویژگی «default» ناخوشایند است زیرا شما میخواهید از خروجی default ES6 در سینتکس ES5 استفاده کنید. من پیشنهاد میکنم از سینتکس ES6 با کمک TypeScript استفاده کنید:

// test.ts
import GForest from "./build/GForest";
console.log(GForest); // { [Function: Forest] createTree: [Function] }

این کد به صورت زیر کامپایل شده است:

var GForest_1 = require("./build/GForest"); 
console.log(GForest_1.default);

یک کلاس را به طور مستقیم صادر کنید

در تایپاسکریپت، شما میتوانید یک عضو را مستقیماً با نحو غیر استاندارد export = صادر کنید.

مثال :

// GForest.ts
import * as Immutable   from "immutable"; 
import GTree            from "./GTree"; 

class Forest{ 
    public static createTree(){ 
        let tree = new GTree(); 
    } 
}
export = Forest;

سپس، آن را با کد ES3/5 استفاده کنید:

// test.js
let GForest = require("./build/GForest");
console.log(GForest); // { [Function: Forest] createTree: [Function] }

... یا، در تایپاسکریپت:

// test.ts
import GForest = require("./build/GForest");
console.log(GForest); // { [Function: Forest] createTree: [Function] }

مستندات مربوط به export = را اینجا ببینید.

پاسخ شماره ۲

چرا یک شیء با کلید پیشفرض وجود دارد و چگونه میتوانم این را تغییر دهم تا رفتار مورد نظر را به دست آورم؟

این به این دلیل است که همان چیزی است که از GForest.js کامپایل شده صادر میشود:

"use strict";
var GTree_1 = require("./GTree");
var Forest = (function () {
    function Forest() {
    }
    Forest.createTree = function () {
        var tree = new GTree_1["default"]();
    };
    return Forest;
}());
exports.__esModule = true;
exports["default"] = Forest;

شما نیاز دارید از .default برای اشاره به سازنده استفاده کنید:

var GForest = require("./build/GForest").default; 

تایپاسکریپت از نحو ماژول es6 استفاده میکند که میتواند چندین ماژول را صادر کند. سپس این کد به نحو ماژول commonjs es5 کامپایل میشود. کامپایلر تایپاسکریپت از properties در شیء exports برای نگاشت چندین صادرشده تعریفشده در نحو ماژول es6 استفاده میکند. و default دقیقاً مانند هر صادرشده named دیگر است.