0

I have a class Helper with a function getInfo defined like this...

// Helper package

function Helper() {
    this.loaded = true;
   .....
}

Helper.prototype.getInfo = function(id) {
    if (!this.loaded) { loadData.apply(this) }
    .....
};

I imported the Helper package and use it like this

import {getInfo} from "helper"
...
const CONFIG: Config[] = [
 {name: "foo", info: [getInfo("foo")]},
 {name: "bar", info: [getInfo("bar")]},
]
...

In v3.6.5, it was compiled like this...

const helper_1 = require("helper");
...
const CONFIG: Config[] = [
 {name: "foo", info: [helper_1.getInfo("foo")]},
 {name: "bar", info: [helper_1.getInfo("bar")]},
]
...

In v4.x, it was compiled like this...

const helper_1 = require("helper");
...
const CONFIG: Config[] = [
 {name: "foo", info: [(0,helper_1.getInfo)("foo")]},
 {name: "bar", info: [(0,helper_1.getInfo)("bar")]},
]
...

Since it's using a comma separator, I got an undefined this.

Here's my tsconfig:

{
  "compilerOptions": {
    "target":"ES2018",
    "module": "commonjs",
    "lib": ["esnext", "es2016", "es2017.object", "es2017.string"],
    "declaration": true,
    "outDir": "./dist/lib",
    "declarationDir": "./dist/types",
    "strict": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "noImplicitThis": true,
    "alwaysStrict": true,
    "noUnusedLocals": false,
    "noUnusedParameters": false,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": false,
    "inlineSourceMap": true,
    "inlineSources": true,
    "experimentalDecorators": true,
    "strictPropertyInitialization":false,
    "typeRoots": ["./node_modules/@types"]
  },
  "exclude": ["build","node_modules", "dist"]
}

How do I stop TypeScript from compiling using comma operator?

0.618
  • 1
  • 1
  • Please give a [mre] - it doesn't seem to be compiled that way in https://www.typescriptlang.org/play?ts=4.4.4. – jonrsharpe Nov 07 '21 at 22:03
  • Thank you @jonrsharpe, I updated with more details and the tsconfig. Let me know if I can provide more info – 0.618 Nov 07 '21 at 22:16
  • 1
    If you import it as `import {getInfo} from "helper"` then you're only importing the method and losing the context when you run `pathInfo()`. The compiled code you get right now is *logically equivalent*. See [How does the "this" keyword work?](https://stackoverflow.com/q/3127429) and [How to access the correct `this` inside a callback](https://stackoverflow.com/q/20279484). Changing the compiled code makes it *not* equivalent to the code you've written. I'd suggest you write correct code in the first place which would in turn also compile to produce the result you want. – VLAZ Nov 07 '21 at 22:19
  • Thanks @VLAZ. That makes a lot of sense. My case might be a little strange because `Helper` also provide information, which means I not only use the method, but do get data from it, which is included in `this`. Is there any workaround I can implement? Thanks! – 0.618 Nov 07 '21 at 22:27
  • You have a class you never instantiate. You also never share instances of that class, just the methods. Just remove the class and variables in the module. Then export the functions that use them.No class, no instance, no problem with `this`. Alternatively, import an instance of `helper` so you can have access to `this` when calling methods on it. If it's a class, there is no real benefit to picking and choosing different methods. Halfway point is a static class - class with only static members. It's very similar to just having a module but it's how OO code without modules does it. – VLAZ Nov 07 '21 at 22:31
  • Thanks @VLAZ Let me try it out – 0.618 Nov 07 '21 at 22:34
  • importing the instance of `helper` works for me! Thank you @VLAZ ! – 0.618 Nov 07 '21 at 23:25

0 Answers0