Question

我将Angular应用中的表单中的数值传递给服务中的方法。我的单元测试会检查值的类型，并期望它们为＆＃34; number＆＃34;。它过去了。

但是，当我在console.log中调整值（传递给方法之前和之后）时，它们会显示为字符串，例如＆＃34; 10＆＃34 ;.即使在方法功能内部，我也可以看到它们被视为字符串，例如90 + 180 =＆＃34; 90180＆＃34;。

为什么typeof返回＆＃34;数字＆＃34;？

（我通过使用+variable将值作为数字传递来解决问题，我只想知道为什么typeof返回＆＃34;数字＆＃34;当类型不是数字时。）< / p>

我使用茉莉花进行单元测试，这是我的测试：

it("coverageParams.heading, .swathWidth, and .impWidth should be typeof 'number'", () => {
    // Patching numerical values into the form
    component.fieldCoverageParamsForm.patchValue({
      heading: 30,
      impWidth: 10,
      swathWidth: 20
    });
    fixture.detectChanges();

    // Method in the component snippet below
    component.createCoveragePath();
    expect(typeof component.coverageParams.heading).toBe("number");
    expect(typeof component.coverageParams.swathWidth).toBe("number");
    expect(typeof component.coverageParams.impWidth).toBe("number");
  });

这是我的组成部分：

export class FieldCoverageParamsComponent {

  public fieldCoverageParamsForm: FormGroup;

  public coverageParams: ICoverageParams;

  constructor(
    private routePlanner: RoutePlanningService,
    private formBuilder: FormBuilder
  ) {
    this.coverageParams = {
      boundary: null,
      heading: 0,
      impWidth: 0,
      startPoint: null,
      swathWidth: 0
    };
    this.createForm();
  }

  public createCoveragePath() {
    const formModel = this.fieldCoverageParamsForm.value;
    this.coverageParams = {
      boundary: formModel.boundary,
      heading: formModel.heading,
      impWidth: formModel.impWidth,
      startPoint: formModel.startPoint,
      swathWidth: formModel.swathWidth
    };

    this.routePlanner.plotRoute(
      this.mapService.mainMapViewer,
      this.coverageParams
    );
  }
}

Answer 1

但是，当我在console.log中输入值（传递给方法之前和之后）

我认为你的意思是你的实际代码而不是测试。你在测试中修补了数值，所以它真的很简单：

let heading = 10;
component.createCoveragePath();
expect(typeof heading).toBe("number");

这是因为您正在修补数值。

当Angular实际运行时，表单输入的值将以字符串形式出现。您在此处未获得类型安全性... .value属于any类型，因此它将以{heading: "10"}的形式返回。

您可能希望在表单中使用input type=number，因为在这种情况下，值将返回为number。否则你将不得不像以前那样自己进行转换。

您还可以将测试更新为补丁字符串值或非数字值。

Answer 2

因为字段类型是声明的某个地方number，但可能会在某处分配string。

不幸的是，这是可能的。最后，Typescript被转换为JavaScript，并且它不会保护您免受代码中某处的错误类型分配的影响。

显然，检查生产代码获取的数据，显然应该与您在测试中使用的数据不同。

Answer 3

只需对字符串进行类型转换即可。

parseInt函数（字符串）;

问题解决了。

Typeof返回＆＃34; number＆＃34;，但是logging变量显示字符串

3 个答案: