Проблема с машинописным шрифтом при использовании "this" внутри конструктора класса для метода экземпляра

У меня есть очень простой вариант использования в TypeScript: класс, с конструктором и методом экземпляра.

Я хочу вызвать этот метод экземпляра из конструктора, но использование "this" разрешается неправильно.

Как правильно иметь класс с методами экземпляра и вызывать их из конструктора?

У меня есть модуль UMD (определенный в моем tsconfig как тип модуля для компиляции как).

У меня есть следующий код:

export namespace TestNS {
    export class TestClass {
        // Fields
        testValue: string;

        constructor(val: string) {
            this.testValue = val;
            this.privateMethod();
        }

        private privateMethod() {
            console.log("private instance method");
        }
    }//TestClass class
}

И это компилируется в:

(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var TestNS;
    (function (TestNS) {
        var TestClass = /** @class */ (function () {
            function TestClass(val) {
                this.testValue = val;
                this.privateMethod();
            }
            TestClass.prototype.privateMethod = function () {
                console.log("private instance method");
            };
            return TestClass;
        }()); //TestClass class
        TestNS.TestClass = TestClass;
    })(TestNS = exports.TestNS || (exports.TestNS = {}));
});
//# sourceMappingURL=Test.js.map

Я называю это используя:

var ex = new TestNS.TestClass("test");

При вызове я получаю сообщение об ошибке, что privateMethod не может быть найден. При отладке исходного кода JS в браузере, this в конструкторе класса, кажется, ссылается на объект пространства имен "TestNS", а НЕ на мой экземпляр TestClass, который я ожидаю. С чего бы это? Это кажется очевидной проблемой, если я не могу использовать пространство имен И использовать члены экземпляра класса.

Что я здесь не так делаю? (Я хочу применить такое пространство имен для организации объектов и т.п. для более крупного проекта позже)

Изменить: Чтобы уточнить, как этот код загружается, я предоставлю эти детали.

tsconfig.json

{
  "compilerOptions": {
    "baseUrl": "./js",
    "target": "es5",
    "sourceMap": true,
    "typeRoots" : ["./js/lib/@types"],
    "module": "UMD"
  },
  "exclude": [
    "node_modules"
  ]
}

index.html

<!doctype html>
<html>
  <head>
    <title>Test</title>
    <script src="require.js"></script>
    <!-- Data main attribute avoided due to some environment constraints (ie: a CMS) -->
    <script src="main.js"></script>
  </head>
  <body>
    <p>Example Text</p>
  </body>
</html>

main.js

requirejs.config({
    baseUrl: "js",
    map: {
        '*': {
            'Test': 'modules/Test',
        }
    }
});

requirejs(["Test"],function(TestNS) {
    var t = new TestNS.TestClass("value");
}
Источник

1 ответ

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

var ex = new TestNS.TestClass("test");

Будет ошибка, если ваш предыдущий код не загружен, либо путем добавления тега скрипта перед зависимым кодом, либо путем импорта модуля...

import { TestNS } from './test.js'

Я представляю, что это недостающий кусок.

Источник
Другие вопросы по тегам