做网站优化有什么好处,沭阳住房和城乡建设局网站,机械营销型网站,整合营销推广策略如题#xff0c;可以在vue项目使用typescript创建抽象类#xff0c;然后使用这个抽象类。
通过TypeScript#xff0c;可以在前端应用抽象类了。抽象类的好处#xff0c;可以同时满足继承和多态#xff0c;好处多多。以vue3为例#xff1a;
1、创建抽象类
据说js类中可以在vue项目使用typescript创建抽象类然后使用这个抽象类。
通过TypeScript可以在前端应用抽象类了。抽象类的好处可以同时满足继承和多态好处多多。以vue3为例
1、创建抽象类
据说js类中“#”开头的变量或方法就是私有变量或方法见拙作《vue项目中的类》。但是现在TypeScript有private、protected、public等全套关键词。
export abstract class ListPage {#queryForm //查询框表单对象例如const queryForm ref()el-form refqueryForm#myPageSetup //分页对象例如const myPageSetup cloneDeep(pageSetup)constructor(queryForm, pageSetup) {this.#queryForm queryFormthis.#myPageSetup pageSetup}//列表数据请求。抽象方法子类必须实现abstract doQuery(): void//查询onSearch () {this.#myPageSetup.pageIndex 1this.doQuery()}//重置onReset () {this.#queryForm.value.resetFields()}//跳转至指定页码onPageChange (pageIndex) {this.#myPageSetup.pageIndex pageIndexthis.doQuery()}//改变分页大小onPageSizeChange (size) {this.#myPageSetup.pageIndex 1this.#myPageSetup.pageSize sizethis.doQuery()}//排序onColumnSort ({ prop, order }) {this.#myPageSetup.order orderthis.#myPageSetup.sort propthis.doQuery()}
}2、应用该抽象类
class MyListPage extends ListPage {constructor() {super(defaultQueryForm, myPageSetup) // 在派生类的构造函数中必须调用super()}//实现抽象方法。async代表异步基类中的没有声明是否异步既可以异步也可以不异步。doQuery async () {//巴拉巴拉巴拉}
}
const myListPage new MyListPage()
myListPage.onSearch()3、小结
现在前端跟后端越来越像了。再也不是以前那种相对简单的三剑客了。本来吧js广受欢迎一个原因是它非常灵活没有什么类型的限制怎么写都可以。现在引入了TypeScript到处声明类型神憎鬼厌。有什么好处呢难道声明了强类型后没有类型转换程序执行效率就提高了未必吧浏览器好像不直接支持typescript最终还是要转换成原生js才能执行吧。这么说的话所谓TypeScript也者也不过是一种语法糖让我们写代码时可以写这写那假装在面向对象编程而已。有没有跟我一样觉得这样反而不方便的
