• typescript: Builder Pattern


    1. /**
    2. * file: CarBuilderts.ts
    3. * TypeScript 实体类 Model
    4. * Builder Pattern
    5. * 生成器是一种创建型设计模式, 使你能够分步骤创建复杂对象。
    6. * https://stackoverflow.com/questions/12827266/get-and-set-in-typescript
    7. * https://github.com/Microsoft/TypeScript/wiki/Coding-guidelines
    8. */
    9. class UserInfo {
    10. id!: number;
    11. userName!: string;
    12. email!: string;
    13. }
    14. /**
    15. * 车辆实体类
    16. */
    17. class Car { //export
    18. /**
    19. * 序号
    20. */
    21. id!: number;
    22. /**
    23. * 座位
    24. */
    25. seats!: number;
    26. /**
    27. * 发动机
    28. */
    29. engine!: string;
    30. /* constructor(id, seats,engine){
    31. this.id = id;
    32. this.seats = seats;
    33. this.engine=engine;
    34. }*/
    35. /**
    36. * 序号
    37. * @returns 返回序号
    38. */
    39. public getId(): number { //get
    40. return this.id;
    41. }
    42. /**
    43. * 座位数
    44. * @returns 返回座位数
    45. */
    46. public getSeats(): number { //get
    47. return this.seats;
    48. }
    49. /**
    50. * 发动机
    51. * @returns 返回发动机型号名称
    52. */
    53. public getEngine(): string { //get
    54. return this.engine;
    55. }
    56. /**
    57. * 设置座位数
    58. * @param seats 输入数字座位数
    59. */
    60. public setSeats(seats: number) //set
    61. {
    62. this.seats=seats;
    63. }
    64. /**
    65. * 设置发动机型号
    66. * @param engine 输入型号名称
    67. */
    68. public setEngine(engine: string) //set
    69. {
    70. this.engine=engine;
    71. }
    72. /**
    73. *
    74. * @param id
    75. */
    76. public setId(id:number)
    77. {
    78. this.id=id;
    79. }
    80. }
    81. /**
    82. * 继承
    83. */
    84. class Motorcycle extends Car
    85. {
    86. /* id!: number;
    87. seats!: number;
    88. engine!: string;
    89. constructor(id, seats,engine){
    90. this.id = id;
    91. this.seats = seats;
    92. this.engine=engine;
    93. }
    94. public getId(): number { //get
    95. return this.id;
    96. }
    97. public getSeats(): number { //get
    98. return this.seats;
    99. }
    100. public getEngine(): string { //get
    101. return this.engine;
    102. }
    103. public setSeats(seats: number) //set
    104. {
    105. this.seats=seats;
    106. }
    107. public setEngine(engine: string) //set
    108. {
    109. this.engine=engine;
    110. }*/
    111. }
    112. /*
    113. interface DuBuilder()
    114. .id(1)
    115. .setSeats("")
    116. .setEngine("")
    117. .build();
    118. */
    119. /**
    120. * 接口extends Car
    121. */
    122. interface CBuilder {
    123. /**
    124. *
    125. * @param seats
    126. */
    127. setSeats(seats: number): this;
    128. /**
    129. *
    130. * @param engine
    131. */
    132. setEngine(engine: string): this;
    133. /**
    134. *
    135. * @param id
    136. */
    137. setId(id:number):this;
    138. }
    139. /**
    140. * 继承 Builder
    141. */
    142. class CarBuilder implements CBuilder {
    143. /**
    144. * 车信息类
    145. */
    146. private car: Car;
    147. /**
    148. * 实例化
    149. */
    150. constructor() {
    151. this.car = new Car();
    152. }
    153. /**
    154. * 设置座位数
    155. * @param seats 座位号
    156. * @returns 返回座位号
    157. */
    158. public setSeats(seats: number): this {
    159. //this.car.setSeats(seats);
    160. this.car.setSeats(seats);
    161. return this;
    162. }
    163. /**
    164. * 设置发动机型号
    165. * @param engine 发动机型号名称
    166. * @returns
    167. */
    168. public setEngine(engine: string): this {
    169. this.car.setEngine(engine);
    170. return this;
    171. }
    172. /**
    173. * id 序号
    174. * @param id
    175. * @returns
    176. */
    177. public setId(id:number):this{
    178. this.car.setId(id);
    179. return this;
    180. }
    181. /**
    182. * 得到实体
    183. * @returns 返回车信息类
    184. */
    185. public getResult(): Car {
    186. return this.car;
    187. }
    188. }
    189. /**
    190. *
    191. * */
    192. class MotorcycleBuilder implements CBuilder {
    193. /**
    194. *
    195. */
    196. private motorcycle: Motorcycle;
    197. /**
    198. *
    199. */
    200. constructor() {
    201. this.motorcycle = new Motorcycle();
    202. }
    203. /**
    204. *
    205. * @param seats
    206. * @returns
    207. */
    208. public setSeats(seats: number): this {
    209. this.motorcycle.setSeats(seats);
    210. return this;
    211. }
    212. /**
    213. *
    214. * @param engine
    215. * @returns
    216. */
    217. public setEngine(engine: string): this {
    218. this.motorcycle.setEngine(engine);
    219. return this;
    220. }
    221. /**
    222. *
    223. * @param id
    224. * @returns
    225. */
    226. public setId(id: number): this {
    227. this.motorcycle.setId(id);
    228. return this;
    229. }
    230. /**
    231. *
    232. * @returns
    233. */
    234. public getResult(): Motorcycle {
    235. return this.motorcycle;
    236. }
    237. }
    238. /**
    239. *
    240. */
    241. class DuDirector {
    242. /**
    243. *
    244. * @returns
    245. */
    246. public buildFerrari(): Car {
    247. return new CarBuilder().setId(1).setSeats(2).setEngine("V-12").getResult();
    248. }
    249. /**
    250. *
    251. * @returns
    252. */
    253. public buildToyota(): Car {
    254. return new CarBuilder().setId(2).setSeats(7).setEngine("V-6").getResult();
    255. }
    256. /**
    257. *
    258. * @returns
    259. */
    260. public buildHonda(): Motorcycle {
    261. return new MotorcycleBuilder().setId(3).setSeats(2).setEngine("V-4").getResult();
    262. }
    263. /**
    264. *
    265. * @returns
    266. */
    267. public buildYamaha(): Motorcycle {
    268. return new MotorcycleBuilder().setId(4).setSeats(1).setEngine("V-2").getResult();
    269. }
    270. }
    271. /**
    272. *
    273. */
    274. const directorBu = new DuDirector();
    275. directorBu.buildFerrari();
    276. directorBu.buildToyota();
    277. directorBu.buildHonda();
    278. directorBu.buildYamaha();
    279. const car = new CarBuilder().setSeats(2).setEngine("V-12").getResult();
    280. const motorcycle = new MotorcycleBuilder()
    281. .setId(100)
    282. .setSeats(2)
    283. .setEngine("V-4")
    284. .getResult();
    285. let pucarid=""+motorcycle.getId();
    286. let pucar1=""+motorcycle.getSeats();
    287. let pucar2=""+motorcycle.getEngine();
    288. let messageCar: string = 'Hello World,This is a typescript!,涂聚文 Geovin Du Web';
    289. document.body.innerHTML = messageCar+"
      ,id:"
      +pucarid+",座位数:"+pucar1+",发动机型号:"+pucar2+","+car.getSeats()+","+car.getEngine()+","+directorBu.buildFerrari().getEngine()+",TypeScript 生成器方法模式";
    290. console.log(motorcycle.getId());
    291. console.log(motorcycle.getSeats());
    292. console.log(motorcycle.getEngine());

    调用:

    1. html>
    2. <html lang="en">
    3. <head>
    4. <meta charset="UTF-8">
    5. <meta name="viewport"
    6. content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    7. <meta http-equiv="X-UA-Compatible" content="ie=edge">
    8. <head><title>TypeScript:生成器模式title>
    9. <meta name="Description" content="geovindu,涂聚文,Geovin Du"/>
    10. <meta name="Keywords" content="geovindu,涂聚文,Geovin Du"/>
    11. <meta name="author" content="geovindu,涂聚文,Geovin Du"/>
    12. head>
    13. <body>
    14. <script src="dist/CarBuilderts.js">script>
    15. body>
    16. html>

    输出:

    “The best strategy in life is diligence."         --Chinese Proverb

  • 相关阅读:
    第十七届全国人机语音通讯学术会议(NCMMSC 2022) | 早鸟票开放注册了
    尚医通 (三) --------- 预约挂号微服务模块搭建
    Vue 使用 setup 语法糖
    单片机开发-软件架构与系统设计(工程实现使用的也是轮询系统、前后台系统和多任务系统)
    04数据存储规则/进制转换/文本(数字字母汉字)图片(黑白图灰度图彩色图)声音的存储
    CeresScanMatcher 匹配的使用步骤与实例解析
    2022科大讯飞AI开发者大赛,来了!
    pycharm删除解释器没有showall
    [附源码]SSM计算机毕业设计基于实时定位的超市配送业务管理JAVA
    JS调用PHP和PHP调用JS的方法
  • 原文地址:https://blog.csdn.net/geovindu/article/details/133586370