Code Optimization (1)

Frontend

发布日期: 2021-01-05

更新日期: 2021-02-06

文章字数: 457

阅读时长: 1 分

阅读次数:

背景

随着阅历（阅读代码经历）的增加，越来越觉得自己写得代码很垃圾。。。
计划对当前项目的代码做小范围的重构优化。

理想的命名

有意义的可读的变量名

const currentDate = moment().format("YYYY/MM/DD");
const currentPage = pagination['current'];

可搜索的变量名（不要为了炫技手动缩短变量名）

setTimeout(restart, 86400000);// これはダメ。

//声名为都是大写的常量
const ONE_DAY = 24 * 60 * 60 * 1000;
setTimeout(restart, ONE_DAY);

自解释的变量名

//可以猜出来contentRange是一串字符串
const [_, pageStart, pageEnd, total] = contentRange.match(
            /(\d+)-(\d+)\/(\d+)/,
        ) as Array<string>;

合并功能一致的函数
- 获取数据的时候可以一次性把数据都给获取了
- 不要这个地方要”name”了获取个”name”，那个地方要”id”了再获取个”id”
```
const getMemberId = () => {
    //do something
}
const getMemberName = () => {
    //do something
}
```
```
const getMemberInfo = () => {
    //do something
}
```

无重复的语义清晰的变量名

interface MemberTableProp {
    members: Member[];
    searchMembers?: (filters: Store) => Promise<void>;
    deleteMember?: (member: Member) => Promise<void>;
    exportMembers?: (encoding: string) => Promise<void>;
    importMembers?: (formData: FormData, encoding: string) => Promise<void>;
    handleChange?: (page: number, pageSize: number, filters: string, sortParam: string) => void;
}

interface MemberTableProp {
    members: Member[];
    handleSearch?: (filters: Store) => Promise<void>;
    handleDelete?: (member: Member) => Promise<void>;
    handleExport?: (encoding: string) => Promise<void>;
    handleImport?: (formData: FormData, encoding: string) => Promise<void>;
    handleChange?: (page: number, pageSize: number, filters: string, sortParam: string) => void;
}