ts基础(1)
// let num:number = 12; // let boo:boolean = true; // let str:string = "adfd"; // str = 'asdf'; // str = ` // <h1>${num*3+3}</h1> // `; // alert(str); // console.info(str.indexOf("h")); // console.info(parseFloat("123.4343abc")) // let num2 = 20; // console.info(num2); let arr:(number|string)[] = [1,2,3,"dfsdf"]; arr.push(2); let arr2 :Array<number> = [1,2,4]; arr2.push(222); console.log(arr2); enum StudentType{ 班长=101,学委=201,组长,学员 } let stuType:StudentType = 201; if(stuType == StudentType.班长){ console.info("班长来了") }else if(stuType == StudentType.学委){ console.info("学委来了") } let fun:Function = ()=>{ } let obj:Date = new Date(); class Student { public id:number; public name:string; /** * 初始化学生对象 * @param id 学生编号 * @param name 学生名称 */ constructor(id:number,name:string){ this.id = id; this.name = name; } public show(otherName:string):void{ console.info(`你好${otherName},我叫${this.name}`); } } let stu:Student = new Student(1,"王五"); stu.show("李四") class Teacher { constructor(protected id:number,protected name:string) { } public show(otherName: string): void { console.info(`你好${otherName},我叫${this.name}`); } } let teacher:Teacher = new Teacher(12,"hehe"); teacher.show("bb"); class ManTeacher extends Teacher{ constructor(){ super(12,"ddsds"); console.info(123); this.id=12; } } let man:ManTeacher = new ManTeacher(); interface IBoy{ play():void; eat():void; sayHi(otherName:string):string; } class GoodBoy extends ManTeacher implements IBoy { play(): void { console.info("玩游戏") } eat(): void { console.log("吃饭") } sayHi(otherName: string): string { return `你好${otherName} 我叫${this.name}` } } try { new GoodBoy().play(); } catch (error) { console.info(error); } //接口的第二种写法 dataInterface interface IGoods{ id:number; name:string; price:number; } let goods1:IGoods = {id:1, name:"aaa",price:433 }; class Goods { id: number; name: string; price: number; hello:number; constructor( ) { this.id = 1; this.name="wangwu"; this.price=222; this.hello=333; } } let g2:IGoods = new Goods();
ToDolist示例
//let template:string=``; class ListItem{ constructor(public title:string,private state:boolean=false){ this.rander(); } public domHtml:JQuery=$(); public rander(){ let dom = $(`<li><span >${this.title}</span><span class="btnDone">完成</span></li>`); dom.find(".btnDone").click(()=>{ this.state = true; this.domHtml.find("span:first").addClass("deleteLine"); }); this.domHtml = dom; } } class ItemManager{ private static list: ListItem[] = []; constructor(){ } public add(){ var stu = new ListItem($("#txt1").val() as string); ItemManager.list.push(stu) $("#todoList").append(stu.domHtml); } } let manager:ItemManager = new ItemManager(); $(function(){ $("button").click(manager.add); })
安装typescript cnpm install -g typescript --save
安装jQuery cnpm install jquery --save
监视文件 tsc -w 文件名
本文来自博客园,作者:鹤哥只手遮天,转载请注明原文链接:https://www.cnblogs.com/hegezhishouzhetian/p/9020596.html