1 /*
2 1、vscode配置自动编译
3
4 1.第一步 tsc --inti 生成tsconfig.json 改 "outDir": "./js",
5
6
7 2、第二步 任务 - 运行任务 监视tsconfig.json
8
9
10 2、typeScript中的数据类型
11
12 typescript中为了使编写的代码更规范，更有利于维护，增加了类型校验，在typescript中主要给我们提供了以下数据类型
13
14
15 布尔类型（boolean）
16 数字类型（number）
17 字符串类型(string)
18 数组类型（array）
19 元组类型（tuple）
20 枚举类型（enum）
21
22 任意类型（any）
23 null 和 undefined
24 void类型
25 never类型
26
27 3、typeScript中的函数
28
29 3.1、函数的定义
30 3.2、可选参数
31 3.3、默认参数
32 3.4、剩余参数
33 3.5、函数重载
34 3.6、箭头函数 es6
35 4、typeScript中的类
36
37 4.1 类的定义
38 4.2 继承
39 4.3 类里面的修饰符
40 4.4 静态属性 静态方法
41 4.5 抽象类 继承 多态
42
43
44 */
45
46
47 //1、ts中类的定义
48
49 /*
50 es5:
51
52 function Person(name){
53
54 this.name=name;
55
56 this.run=function(){
57
58 console.log(this.name)
59 }
60 }
61
62 var p=new Person('张三');
63
64 p.run()
65 */
66
67
68 /*
69 ts中定义类：
70
71
72 class Person{
73
74 name:string; //属性 前面省略了public关键词
75
76 constructor(n:string){ //构造函数 实例化类的时候触发的方法
77 this.name=n;
78 }
79
80 run():void{
81
82 alert(this.name);
83 }
84
85 }
86 var p=new Person('张三');
87
88 p.run()
89
90 */
91
92
93
94 /*
95 class Person{
96
97 name:string;
98
99 constructor(name:string){ //构造函数 实例化类的时候触发的方法
100 this.name=name;
101 }
102
103 getName():string{
104
105 return this.name;
106 }
107 setName(name:string):void{
108
109 this.name=name;
110 }
111 }
112 var p=new Person('张三');
113
114 alert(p.getName());
115
116
117 p.setName('李四');
118
119
120 alert(p.getName());
121
122 */
123
124
125
126
127
128 //2、ts中实现继承 extends、 super
129
130
131 // class Person{
132
133 // name:string;
134
135 // constructor(name:string){
136 // this.name=name;
137 // }
138
139 // run():string{
140
141 // return `${this.name}在运动`
142 // }
143 // }
144 // // var p=new Person('王五');
145 // // alert(p.run())
146
147
148 // class Web extends Person{
149 // constructor(name:string){
150
151 // super(name); /*初始化父类的构造函数*/
152 // }
153 // }
154
155
156 // var w=new Web('李四');
157 // alert(w.run());
158
159
160
161
162
163
164 //ts中继承的探讨 父类的方法和子类的方法一致
165
166 // class Person{
167
168 // name:string;
169
170 // constructor(name:string){
171 // this.name=name;
172 // }
173
174 // run():string{
175
176 // return `${this.name}在运动`
177 // }
178 // }
179 // // var p=new Person('王五');
180 // // alert(p.run())
181
182
183 // class Web extends Person{
184 // constructor(name:string){
185
186 // super(name); /*初始化父类的构造函数*/
187 // }
188 // run():string{
189
190 // return `${this.name}在运动-子类`
191 // }
192 // work(){
193
194 // alert(`${this.name}在工作`)
195 // }
196 // }
197
198
199 // var w=new Web('李四');
200 // // alert(w.run());
201
202 // // w.work();
203
204 // alert(w.run());
205
206
207
208
209
210
211
212
213
214 // 3 类里面的修饰符 typescript里面定义属性的时候给我们提供了 三种修饰符
215
216 /*
217 public :公有 在当前类里面、 子类 、类外面都可以访问
218 protected：保护类型 在当前类里面、子类里面可以访问 ，在类外部没法访问
219 private ：私有 在当前类里面可以访问，子类、类外部都没法访问
220
221 属性如果不加修饰符 默认就是 公有 （public）
222
223 */
224
225
226
227 //public :公有 在类里面、 子类 、类外面都可以访问
228
229
230 // class Person{
231
232 // public name:string; /*公有属性*/
233
234 // constructor(name:string){
235 // this.name=name;
236 // }
237
238 // run():string{
239
240 // return `${this.name}在运动`
241 // }
242 // }
243 // // var p=new Person('王五');
244 // // alert(p.run())
245
246
247 // class Web extends Person{
248 // constructor(name:string){
249
250 // super(name); /*初始化父类的构造函数*/
251 // }
252 // run():string{
253
254 // return `${this.name}在运动-子类`
255 // }
256 // work(){
257
258 // alert(`${this.name}在工作`)
259 // }
260 // }
261
262 // var w=new Web('李四');
263
264 // w.work();
265
266
267 //类外部访问公有属性
268
269
270 // class Person{
271
272 // public name:string; /*公有属性*/
273
274 // constructor(name:string){
275 // this.name=name;
276 // }
277
278 // run():string{
279
280 // return `${this.name}在运动`
281 // }
282 // }
283
284 // var p=new Person('哈哈哈');
285
286 // alert(p.name);
287
288
289
290
291
292 //protected：保护类型 在类里面、子类里面可以访问 ，在类外部没法访问
293
294
295 // class Person{
296
297 // protected name:string; /*公有属性*/
298
299 // constructor(name:string){
300 // this.name=name;
301 // }
302
303 // run():string{
304
305 // return `${this.name}在运动`
306 // }
307 // }
308 // var p=new Person('王五');
309 // alert(p.run())
310
311
312 // class Web extends Person{
313 // constructor(name:string){
314
315 // super(name); /*初始化父类的构造函数*/
316 // }
317 // work(){
318
319 // alert(`${this.name}在工作`)
320 // }
321 // }
322
323 // var w=new Web('李四11');
324
325 // w.work();
326
327 // alert( w.run());
328
329
330
331 //类外外部没法访问保护类型的属性
332
333
334 // class Person{
335
336 // protected name:string; /*保护类型*/
337
338 // constructor(name:string){
339 // this.name=name;
340 // }
341
342 // run():string{
343
344 // return `${this.name}在运动`
345 // }
346 // }
347
348 // var p=new Person('哈哈哈');
349
350 // alert(p.name);
351
352
353
354
355
356 // private ：私有 在类里面可以访问，子类、类外部都没法访问
357
358
359 // class Person{
360
361 // private name:string; /*私有*/
362
363 // constructor(name:string){
364 // this.name=name;
365 // }
366
367 // run():string{
368
369 // return `${this.name}在运动`
370 // }
371 // }
372
373
374 // class Web extends Person{
375
376 // constructor(name:string){
377 // super(name)
378 // }
379
380 // work(){
381
382 // console.log(`${this.name}在工作`)
383 // }
384 // }
385
386
387
388 class Person{
389
390 private name:string; /*私有*/
391
392 constructor(name:string){
393 this.name=name;
394 }
395
396 run():string{
397
398 return `${this.name}在运动`
399 }
400 }
401
402 var p=new Person('哈哈哈');
403
404 alert(p.run());
typescript类与继承
Easter79
• 阅读
481
点赞
收藏
