导出的typescript类函数将“this”记录为undefined

时间:2018-05-16 00:08:38

标签: node.js typescript

我目前有一个在构造函数中设置类值的typescript类。然后我在类方法中使用“this”引用这些值。 .ts文件编译正常,没有警告。但是,当我在另一个项目中导入已编译的.js文件时,如果我调用类方法,我会收到一个错误,这是未定义的。

我在打字稿中为文件编写了一些测试,它们都运行良好。

这是一个简化的例子。

# class .ts file

export class MyClass {
  public myValue: number;

  constructor(val: number) {
     this.myValue = val;
  }

  logValue() {
     console.log(this);

     console.log(this.myValue);
  }
}


# regular js project importing built .js file

import { MyClass } from 'myProject'

const x = new MyClass(5);

x.logValue(); // error, cannot read property myValue of undefined, first console.log logs 'undefined';

这是我的tsconfig.json

{
    "compilerOptions": {
        "module": "commonjs",

        // useTypeInferenceAsMuchAsPossible
        "noImplicitAny": true,
        "removeComments": true,
        "preserveConstEnums": true,
        "sourceMap": true,
        "outDir": "./lib",
        "allowJs": true,
        "target": "es5",

        "lib": [
            "es7",
            "es2015.symbol",
            "es2015.symbol.wellknown"
        ]
    },
    "include": [
        "./src/**/*"
    ],
    "exclude": [
        "node_modules",
        "**/*.spec.ts"
    ]
}

谢谢!

1 个答案:

答案 0 :(得分:4)

此代码实际上没有错误

const x = new MyClass(5);
x.logValue();

但是错误:

const x = new MyClass(5);
const logValue = x.logValue;
logValue(); // Error

这仅仅是因为this的工作方式。

修复

您可以使用arrow function。变化:

logValue() {
  console.log(this);
  console.log(this.myValue);
}

致:

logValue = () => {
  console.log(this);
  console.log(this.myValue);
}