ts兼容js,微软开发,ts会移除注释,
类 接口 模块
class hello{}//就是function,function就是class
function demo(){} //支持js语法
---------------------------------------------------------
数据类型:Boolean Number String Array Enum Any Void
var isBoolean;//js
var isBoon : boolean = false;//ts,不给false是undefined
function tell(){
alert(isBoon);
}
tell();
-------------------------------------------
var num;//js
var num : number = 1;//ts
num++;
-----------------------------------------
var s : string = "sss";
s += "dd";
-----------------------------------------
var list : number[] = [1,2,3];
var list1 : Array<string> = ['1','2','3'];
alert(list[1]);
alert(list1[1]);
-------------------------------------------
enum Color{Red,Green,Blue};//下标从0开始
var c:string = Color[1];
enum Color{Red = 1,Green,Blue};//下标从1开始
var c:string = Color[2];//Green
enum Color{Red = 5,Green = 10,Blue = 20};//下标是50,10,20
var c:string = Color[10];//Green
enum Color{Red,Green,Blue};
var c:Color = Color.Green;//1,获取下标
alert(c);
-------------------------------------------
var is : any = 123;
is = "hello";
is = true;
alert(is);//flase
--------------------------------------------
var list:any[] = [1,"hello",true];
alert(list[1]);
----------------------------------------
//Void是对函数声明的。
function tell():string{
return "www";
}
function say():number{
return 10;
}
function tee():void{
return;
}
---------------------------------------------------------
//js是通过prototype实现复用,
class Person{
name:string;
age:number;
constructor(name:string,age:number){//构造方法不是跟类名一样
this.name = name;
this.age = age;
}
print(){//方法不需要function
return this.name + this.age;
}
}
var p = new Person("sss",111);
p.print();
--------------------------------------------------------
//类的继承
class Person{
name:string;
age:number;
tell(){
return this.name + this.age;
}
}
class stud extends Person{//stud有name和age
school:string;
tell(){
return this,name + this,age + this,school;
}
}
var s = new stud("sss",111);
s.name = "nnn";
s.age = 22;
s.school = "sss";
s.tell();
--------------------------------------------------------------
class Person{
name:string;
age:number;
constructor(name:string,age:number){
this.name = name;
this.age = age;
}
tell(){
return this.name + this.age;
}
}
class stud extends Person{//stud有name和age
school:string;
constructor(school:string){
this.school = school;
super("sss",222);
}
tell(){
return this,name + this,age + this,school;
}
}
var s = new stud("ssss");
s.tell();
--------------------------------------------------------
//public private,什么都不写是public
class People{
public name:string;
private age:number;//报错,
constructor(name:string,age:number){
this.name = name;
this.age = age;
}
print(){
this.name + this.age;
}
}
class Teacher extends People{
school:string;
constructor(school:string){
this.school = school;
//super("aaa",222);
}
print(){
return this.name + this.age + this.school;
}
}
var t = Teacher();
t.name = "aaa";
t.age = 44440;
t.school = "ddddd";
t.print();
------------------------------------------------------
//封装
class Hello{
private _name:string;
tell(){
return this.name;
}
get name():string{
return this._name;
}
set name(name:string){
this._name = name;
}
}
var h = new Hello();
h.name = "sss";//set方法
h.tell();
-------------------------------------------------------
//static
class Person{
static name:string;
tell(){
alert(Person.name);
}
}
var p = new Person();
Person.name = "sss";
p.tell();
//引用数据类型
class Greet{
greeting:string;
constructor(message:string){
thius.greeting = message;
}
greet(){
return this.greeting;
}
}
var greet:Greet = new Greet("ssss");//引用数据类型
greet.greet();
-----------------------------------------------------
//函数类型,
//js有名函数和匿名函数。
function add(x,y){
return x + y;
}
var myadd = function(x,y){
return x + y;
}
function add(x:number,y:number):number{
return x + y;
}
var myadd = function(x:number,y:number):string{
return "ssss";
}
var myadd1:(name:string,age:number) =>number = function(n:number,a:number):number{
return a;
}
----------------------------------------------------
//默认参数、可选参数
function bulidName(firstName:string,lastName?:string){//第二个参数可以不传,第一个参数加?号则可以不传参数,
if(lastName){
return firstName + lastName;
}else{
return firstName;
}
}
var r1 = buildName("ss","www");
var r2 = buildName("sss");//传一个参数也可以,不能传3个参数,
function bulidName(firstName:string,lastName = "ssss"){
return firstName + lastName;
}
var r1 = buildName("ss","www");
var r2 = buildName("sss");//传一个参数也可以,不能传3个参数
----------------------------------------------------------
//可变参数
function pp(f:string, ...abc:string[]){
return f + abc.join(" ");
}
var p = pp("ss","ss",'dee',"ssww");
-----------------------------------
//Lambads/this关键字
var people = {
name:["w",'e','f','b'],
getName:function(){
return function(){
var i = Math.floor(Math.random() * 4)
return {
n:this.name[i]
}
}
}
}
var d = people.getName();
d().n; //获取不到
var people = {
name:["w",'e','f','b'],
getName:function(){
return ()=>{
var i = Math.floor(Math.random() * 4)
return {
n:this.name[i]
}
}
}
}
var d = people.getName();
d().n; //获取到
-------------------------------------------------------
//函数重载
function aa(name:string):string;
function aa(age:number):number;
function aa(nameorage : any):any{
if(nameorage && typeof nameorage === 'string'){
alert('姓名');
}else{
alert('年龄');
}
}
aa("ss");
aa(19);
-------------------------------------------------------
//接口,类型检查
function print(labelo:{label:string}){
console.log(labelo.label);
}
var my = {label:"dddd"};
print(my);
interface ppp{
label:string;
}
function cc(ll:ppp){
}
var dd = {label:"label"};
cc(dd);
//接口可选属性
interface USB{
name:string;
age:number;
schllo?:string;//可选参数,可以不传,
}
function printUSB(us:USB){
console.log(us.name);
console.log(us.age);
}
var my = {name:"dd",age:111};
printUSB(my);
//接口,函数类型,对函数规范化
interface search{
(s:string,su:string):boolean;
}
var v:search;
v = function(a:string,su:string){
}
//接口,数组类型,对数组规范化
interface arr{
[index:number]:string;//索引是数字,内容是string
}
var myarr = arr;
myarr = ['ss','dee'];
//接口,class类型,对类的规范化
interface cc{
time:Date;
settime(d:Date);
}
class CC implements cc{
time:Date;
settime(d:Date){
this.time = d;
}
constructor(){
}
}
//接口继承与混合
interface a{
co:string;
}
interface ab{
dd:number;
}
interface b extends a,ab{//b有了2个属性
cd:number;
}
var s = <b>{};
s.cd = 11;
s.co = "ss";
s.dd = 33;
interface ee{
ee1:number;
ee2():void;
(ee3:number):string;
}
var c:ee;
c(10)
c.ee2();
----------------------------------------------------------
//泛型
function hello(num:number):number{
return num;
}
function hello<T>(num:T):T{//函数是泛型,参数是泛型,返回值类型是泛型,T是任何大写字母就可以,
return num;
}
var dd = hello<string>("sss");
alert(dd);
----------------------------------------
function hello<T>(num:T[]):T[]{
alert(num.length);
return num;
}
var list:Array<string> = hello<string>(['ww','ee','rr']);
alert(list[0]);
---------------------------------------
function Hello<T>(arg:T):T{
return arg;
}
var m:<K>(arg:K) => K = Hello;//lamdar表达式,指定一个对象m,将其指定成方法,=>K指定返回值,并把函数Hello赋值给他,
m("sss");
---------------------------------------
//lamdar表达式,lamdar表达式是一个匿名函数,myFunc是一个函数,(a:number)是参数,=>string返回值是string类型,
var myFunc:(a:number)=>string = function(aa:number):string{
return "ssss" + a;
}
myFunc(2);
//var myFunc = function(aa:number):string{
// return "ssss" + a;
//}
var myh:{<T>(arg:T):T} = Hello;
myh("myh");
----------------------------------------
interface Hello{
<T>(arg:T):T;//接口中的一个泛型函数
}
function myHeel<T>(arg:T):T{
return arg;
}
var MH:Hello = myHeel; //Hello 后面不写<string>
MH("ssss");
MH<string>("ssss");
-----------------------------------------
interface Hello<T>{
(arg:T):T;
}
function myHeel<T>(arg:T):T{
return arg;
}
var mh:Hello<number> = myHeel; //Hello 后面要写<number>
mh(100);
----------------------------------------
//泛型类
class Hello<T>{
zer:T;
add:(x:T,y:T)=>T;
}
var myheel = new Hello<number>();
myheel.zer = 10;
myheel.add = function(x,y){
return x + y;
}
myheel.add(11,11);
---------------------------------------------------------
//模块:模块化可重用,封装变量和函数
interface str{
isAcc(s:string):boolean;
}
var le = /^[A-Za-z]+$/;
var num = /^[1-9]$/;
class Letter implements str{
isAcc(s:string):boolean{
return s.match(num);
}
}
----------------------------------------------------
module Validation{
export interface sv{
isAcc(s:string):boolean;
}
var le = /^[A-Za-z]+$/;
var num = /^[1-9]$/;
export class Letter implements str{
isAcc(s:string):boolean{
return s.match(num);
}
}
}
-------------------
module Time{
export class Test{
element:HTMLElement;
span:HTMLElement;
timer:number;
constructor(e:HTMLElement){
this.element = e;
}
}
}