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类与继承
猜你喜欢
转载自www.cnblogs.com/Spinoza/p/9372576.html
今日推荐
周排行