17-ArkTs 常见错误

2024-12-12 21:28:23
132次阅读
0个评论

17-ArkTs 常见错误

arkts-identifiers-as-prop-names

应用代码

interface W {
  bundleName: string
  action: string
  entities: string[]
}

let wantInfo: W = {
  'bundleName': 'com.huawei.hmos.browser',
  'action': 'ohos.want.action.viewData',
  'entities': ['entity.system.browsable']
}

建议改法

interface W {
  bundleName: string
  action: string
  entities: string[]
}

let wantInfo: W = {
  bundleName: 'com.huawei.hmos.browser',
  action: 'ohos.want.action.viewData',
  entities: ['entity.system.browsable']
}

arkts-no-any-unknown

按照业务逻辑,将代码中的 any, unknown 改为具体的类型

function printObj(obj: any) {
  console.log(obj);
}

printObj('abc');

建议改法

function printObj(obj: string) {
  console.log(obj);
}

printObj('abc');

标注 JSON.parse 返回值类型

应用代码

class A {
  v: number = 0
  s: string = ''
  
  foo(str: string) {
    let tmpStr = JSON.parse(str);
    if (tmpStr.add != undefined) {
      this.v = tmpStr.v;
      this.s = tmpStr.s;
    }
  }
}

建议改法

class A {
  v: number = 0
  s: string = ''
  
  foo(str: string) {
    let tmpStr: Record<string, Object> = JSON.parse(str);
    if (tmpStr.add != undefined) {
      this.v = tmpStr.v as number;
      this.s = tmpStr.s as string;
    }
  }
}

使用 Record 类型

应用代码

function printProperties(obj: any) {
  console.log(obj.name);
  console.log(obj.value);
}

建议改法

function printProperties(obj: Record<string, Object>) {
  console.log(obj.name as string);
  console.log(obj.value as string);
}

arkts-no-call-signature

使用函数类型来替代。

应用代码

interface I {
  (value: string): void;
}
function foo(fn: I) {
  fn("abc");
}
foo((value: string) => {
  console.log(value);
});

建议改法

type I = (value: string) => void;
function foo(fn: I) {
  fn("abc");
}
foo((value: string) => {
  console.log(value);
});

arkts-no-ctor-signatures-type

应用代码

class Controller {
  value: string = ''

  constructor(value: string) {
    this.value = value;
  }
}

type ControllerConstructor = {
  new (value: string): Controller;
}

class Menu {
  controller: ControllerConstructor = Controller
  createController() {
    if (this.controller) {
      return new this.controller(123);
    }
    return null;
  }
}

let t = new Menu();
console.log(t.createController()!.value);

建议改法

class Controller {
  value: string = ''

  constructor(value: string) {
    this.value = value;
  }
}

type ControllerConstructor = () => Controller;

class Menu {
  controller: ControllerConstructor = () => {
    return new Controller('abc');
  }

  createController() {
    if (this.controller) {
      return this.controller();
    }
    return null;
  }
}

let t: Menu = new Menu();
console.log(t.createController()!.value);

arkts-no-indexed-signatures

使用 Record 类型来替代。

应用代码

function foo(data: { [key: string]: string }) {
  data["a"] = "a";
  data["b"] = "b";
  data["c"] = "c";
}

建议改法

function foo(data: Record<string, string>) {
  data["a"] = "a";
  data["b"] = "b";
  data["c"] = "c";
}

arkts-no-typing-with-this

应用代码

class C {
  getInstance(): this {
    return this;
  }
}

建议改法

class C {
  getInstance(): C {
    return this;
  }
}

arkts-no-ctor-prop-decls

应用代码

class Person {
  constructor(readonly name: string) {}
  getName(): string {
    return this.name;
  }
}

建议改法

class Person {  name: string  constructor(name: string) {    this.name = name;  }
  getName(): string {    return this.name;  }}

arkts-no-ctor-signatures-iface

应用代码

class Controller {
  value: string = ''

  constructor(value: string) {
    this.value = value;
  }
}

interface ControllerConstructor {
  new (value: string): Controller;
}

class Menu {
  controller: ControllerConstructor = Controller
  createController() {
    if (this.controller) {
      return new this.controller('abc');
    }
    return null;
  }
}

let t = new Menu();
console.log(t.createController()!.value);

建议改法

class Controller {
  value: string = ''

  constructor(value: string) {
    this.value = value;
  }
}

type ControllerConstructor = () => Controller;

class Menu {
  controller: ControllerConstructor = () => {
    return new Controller('abc');
  }

  createController() {
    if (this.controller) {
      return this.controller();
    }
    return null;
  }
}

let t: Menu = new Menu();
console.log(t.createController()!.value);

arkts-no-props-by-index

可以转换成 Record 类型,用来访问对象的属性。

应用代码

import { router } from '@kit.ArkUI';
let params: Object = router.getParams();
let funNum: number = params['funNum'];
let target: string = params['target'];

建议改法

import { router } from "@kit.ArkUI";
let params = router.getParams() as Record<string, string | number>;
let funNum: number = params.funNum as number;
let target: string = params.target as string;

arkts-no-inferred-generic-params

应用代码

class A {
  str: string = ''
}
class B extends A {}
class C extends A {}

let arr: Array<A> = [];

let originMenusMap:Map<string, C> = new Map(arr.map(item => [item.str, (item instanceof C) ? item: null]));

建议改法

class A {
  str: string = ''
}
class B extends A {}
class C extends A {}

let arr: Array<A> = [];

let originMenusMap: Map<string, C | null> = new Map<string, C | null>(arr.map<[string, C | null]>(item => [item.str, (item instanceof C) ? item: null]));

原因

(item instanceof C) ? item: null 需要声明类型为 C | null,由于编译器无法推导出 map 的泛型类型参数,需要显式标注。

arkts-no-regexp-literals

应用代码

let regex: RegExp = /\s*/g;

建议改法

let regexp: RegExp = new RegExp("\\s*", "g");

原因

如果正则表达式中使用了标志符,需要将其作为 new RegExp()的参数。

arkts-no-untyped-obj-literals

从 SDK 中导入类型,标注 object literal 类型

应用代码

const area = {
  pixels: new ArrayBuffer(8),
  offset: 0,
  stride: 8,
  region: { size: { height: 1, width: 2 }, x: 0, y: 0 },
};

建议改法

import { image } from "@kit.ImageKit";
const area: image.PositionArea = {
  pixels: new ArrayBuffer(8),
  offset: 0,
  stride: 8,
  region: { size: { height: 1, width: 2 }, x: 0, y: 0 },
};
收藏00

登录 后评论。没有帐号? 注册 一个。