typescript TypeScript学习

Posted 2021-05-21

/// <reference path="../lib/typings/jquery.d.ts" />
class Cars {
   private cars: Array<Car> = new Array<Car>();

   load(): void {

       $.getJSON('http://localhost:53923/api/Car',
           (data) => {
               this.cars = data;
               alert('данные загружены');
           });
   }

   displayUsers(): void {
       var table = '<table class="table">';
       for (var i = 0; i < this.cars.length; i++) {

           var tableRow = '<tr>' +
               '<td>' + this.cars[i].id + '</td>' +
               '<td>' + this.cars[i].name + '</td>' +
               '<td>' + this.cars[i].model + '</td>' +
               '</tr>';
           table += tableRow;
       }
       table += '</table>';
       $('#content').html(table);
   }
}

window.onload = () => {
   var cars: Cars = new Cars();
   $("#loadBtn").click(() => { cars.load(); });
   $("#displayBtn").click(() => { cars.displayUsers(); });
};

import test = MyTestModule.MyTestClass;
module CarModule {
// объявляется модуль CarModule в нём есть интерфейс iCar.
   export interface ICar {
// ключевое слово export говорит нам о том, что данный интерфейс может быть видет извне нашего модуля. Если мы уберем слово export, данный интерфейс будет виден в скобках этого CarModule. 
       id: number;
       carModel: string;
       model: string;

       getCarInfo(): string;
   }

   export class Car implements ICar {
// создается класс Car, который имплементирует наш ICar
       id: number;
       carModel: string;
       model: string; // если мы удалим это поле, то IntelliSence предупредит о том, что не описано поле model

       constructor(carId: number, carModel: string, model: string) {
           this.id = carId;
           this.carModel = carModel;
           this.model = model;
       }

       getCarInfo(): string {
           var t = new test().getInfo();
           return "Car model = " + this.carModel + " model= " + this.model + " " + t;
       }
   }
}

let car = new CarModule.Car(16, "ВАЗ", "2107");
console.log(car.getCarInfo());

module GenericModule {
  function getId<T>(id: T) : T {
       return id;
   }
// Generic класс Animal, при создании мы передаём тип generic типа и устанавливаем id 
   class Animal<T> {
       private _id: T;

       constructor(id: T) {
           this._id = id;
       }

       getId(): T {
           return this._id;
       }
   }

   var cat = new Animal<number>(16);
   console.log("Cat id = " +  cat.getId());

   var dog = new Animal<string>("2327c575-2f7c-46c3-99f2-a267fac1db5d");
   console.log("Dog id = " + dog.getId());
}

module Encapsulation {
   class Animal {
       private _id: string;
       name: string;
       danger: number;

       constructor(name: string, danger: number) {
// заполнение приватного поля _id при создании метода в конструкторе.
           this._id = this.generateGuid();
           this.name = name;
           this.danger = danger;
       }

       private generateGuid(): string {
           var d = new Date().getTime();
           var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
               var r = (d + Math.random() * 16) % 16 | 0;
               d = Math.floor(d / 16);
               return (c == 'x' ? r : (r & 0x3 | 0x8)).toString(16);
           });
           return uuid;
       }

       public getInfo(): string {
           return "Id = " + this._id + " name = " + this.name + " danger = " + this.danger;
       }
   }

   var parrot: Animal = new Animal("Кеша", 1);
   console.log(parrot.getInfo());

interface IAnimal {
// свойства интерфейса — два поля и один метод
   name: string;
   danger: number;
   getInfo(): void;
}

class Animal implements IAnimal {
// наследуемся от реализованного интерфейса IAnimal
   name: string;
   danger: number;

   constructor(name: string, danger: number) {
       this.name = name;
       this.danger = danger;
   }

   getInfo(): void {
       console.log("Класс Животное. Имя: " + this.name + ", опасность: " + this.danger);
   }
}

class Fox extends Animal {
   tailLength: number;

   constructor(name: string, danger: number, tailLength: number) {
       super(name, danger);
       this.tailLength = tailLength;
// ключевое слово super — вызывает конструктор базового класса,
// инициализирует объект с начальными описанными в нём свойствами,
// а потом инициализируются свойства класса наследника.
   }

   getInfo(): void {
       super.getInfo();
       console.log("Класс Лиса. Длина хвоста: " + this.tailLength + " м");
   }
}

var goose: Animal = new Animal("Гусь", 1);
goose.getInfo();

var fox: Animal = new Fox("Фоксик", 10, 1);
fox.getInfo();

class Car {
// объявляются три поля
   id: number;
   name: string;
   model: string;

// инициализируется конструктор, создающий модель
   constructor(carId: number, carModel: string, model: string) {
       this.id = carId;
       this.name = carModel;
       this.model = model;
   }

// будет отображать информацию о автомобиле
   getCarInfo(): string {
       return "Car model = " + this.name + " model= " + this.model;
   }
}

///////////////////

class Formula {
   static PI: number = 3.14;
   static Half = 0.5;
//  расчитывается площадь круга
   static getСircleSquare(radius: number): number {
       return this.PI * radius * radius;
   }
// расчитывается площадь треугольника
   static getTriangleSquare(length: number, height: number): number {
       return this.Half * length * height;
   }
}

// созд. объект класса Formula и расчитываются значения
var circle = Formula.getСircleSquare(16);
var triangle = Formula.getTriangleSquare(4, 7);
console.log("Площадь круга = " + circle);
console.log("Площадь треугольника = " + triangle);

//////////////////////////

{
  "compilerOptions": {
    "outDir": "./dist/",
    "sourceMap": true,
    "noImplicitAny": true,
    "module": "commonjs",
    "target": "es5",
    "jsx": "react"
  },
  "files": [
    "./typings/index.d.ts",
    "./src/components/Hello.tsx",
    "./src/index.tsx"
  ]
}

module InterfaceModule {
// объявляется интерфейс IAnimal и описываются основные поля и методы этого класса
// и потом они реализуются непосредственно на классах наследниках.
   interface IAnimal {
       name: string;
       danger: number;

       getInfo(): string;
   }

   class Animal implements IAnimal {
       name: string;
       danger: number;

       constructor(name: string, danger: number) {
           this.name = name;
           this.danger = danger;
       }

       getInfo(): string {
           return this.name + " " + this.danger;
       }
   }

   var seal: IAnimal = new Animal("Тюлень", 1);
   console.log(seal.getInfo());
}

abstract class Animal {
  name: string;
  constructor(theName: string) { this.name = theName };
  abstract move(distanceInMeters: number): void;
}

class Snake extends Animal {
    constructor(name: string) { super(name); }
    move(distance) {
        console.log("Slithering");
    }
}


class Fish extends Animal {
    constructor(name: string) { super(name); }
    move(distance) {
        console.log("Swim");
    }
}

let snake: Animal = new Snake('snake');
snake.move(5);