typescript菜鸟教程学习杂记

class Site{
  name():void{
    console.log('test')
  }
}
var obj = new Site()
console.log(obj.name())

/**
 * 如果某个属性的值是计算出来的
 * 那么它后面一位的成员必须要初始化值
 * **/
const getValue=()=>{
  return 1
}
enum objlist {
  a=getValue(),
  b=2,
  c,
  d
}
console.log(objlist)
/**
 * ts变量声明
 * var [varname]:[vartype]=[varvalue];
 * var [varname]:[vartype];
 * var [varname]=[varvalue];
 * var [varname];
 * TypeScript 遵循强类型，如果将不同的类型赋值给变量会编译错误
 * **/
// var num:number = "hello"     // 这个代码会编译错误

/**
 * 类型断言 type assertion
 * 用来手动指定一个值的类型，即允许变量从一种类型更改为另一种类型
 * <type>value
 * 或者 value as type
 * 类型也不能随意更改，需要满足映射关系
 * **/
var str:any = "string1";
var str2:number = str as any;
console.log(str2)

/**
 * 类型推断
 * 当类型没有给出时，
 * TypeScript 编译器利用类型推断来推断类型。
 * 如果由于缺乏声明而不能推断出类型，
 * 那么它的类型被视作默认的动态 any 类型
 * **/
var num = 2;    // 类型推断为 number
console.log("num 变量的值为 "+num); 
// num = "12";    // 编译错误
console.log(num);

/**
 * 变量作用域
 * 全局作用域、类作用域（class）、局部作用域（代码块，比如方法）
 * **/
var global_val = 'global'; //全局作用域
class Numbers { //类
  num_val=1; //类作用局,new出来的实例可访问,
  static static_val =2;//类作用局，静态变量,类可访问该静态变量则可访问，
  store_val():void{//类作用局
    var local_val = 3 //局部作用域，仅new出实体后以实体进行访问
  }
}
var obj3= new Numbers()
console.log("全局变量",global_val);
console.log("类作用域，静态变量static_val",Numbers.static_val);
console.log("类作用域，num_val、store_val() 不可访问");
console.log("类作用域，num_val");
console.log("类作用局",obj3.num_val);
console.log("类作用局",obj3.store_val());

/**
 * 剩余参数
 * 不知道要向函数传入多少个参数，这时候我们就可以使用剩余参数来定义。
 * 剩余参数语法允许我们将一个不确定数量的参数作为一个数组传入。
 * function buildName(...restOfName: string[])
 * **/ 

 /**
  * 递归函数
  * **/
 function factorial(number) {
  if (number <= 0) {         // 停止执行
      return 1; 
  } else {     
      return (number * factorial(number - 1));     // 调用自身
  } 
}; 
console.log(factorial(6));  

/**
 * lambda箭头函数
 * **/

//( [param1, parma2,…paramn] )=> {
  // 代码块
//}
/**
 * 元组：既数组中元素类型可以不一样
 * **/

 /**
  * 联合类型
  * var valname : type1|type2...
  * 一个变量可以同时为多种类型
  * **/

  /**
   * ts接口
   * 一系列抽象方法的声明，是一些方法特征的集合
   * 这些方法都应该是抽象的，需要由具体的类去实现
   * 然后第三方就可以通过这组抽象方法调用，让具体的类执行具体的方法
   * 类似于gql的接口
   * 不是传统意义的api
   * **/
/**
 * 变量customer定义为IPerson类型，则custom可以使用IPerson中定义的任意变量
 * 同时customer还可以定义IPerson定义的变量以外的其他变量名
 * **/
interface IPerson { 
  firstName:string, 
  lastName:string, 
  sayHi: ()=>any 
} 
 
var customer:IPerson = { 
  firstName:"Tom",
  lastName:"Hanks", 
  sayHi: ():number =>{return 1} 
}
/**
 * 联合类型和接口
 * commandline可以是string类型的数组，可以是单独的string，可以是一个方法（返回值为string）
 * interface RunOptions { 
    program:string; 
    commandline:string[]|string|(()=>string); 
} 
 * **/

/**
 * 接口和数组
 * 接口中我们可以将数组的索引值和元素设置为不同类型，索引值可以是数字或字符串
 * **/ 
interface namelist { 
  [index:number]:string 
} 

/**
 * 接口和继承
 * 接口可以通过其他接口来扩展自己
 * Child_interface_name extends super_interface_name
 * 允许多接口继承,各个接口使用逗号 ',' 分隔。
 * Child_interface_name extends super_interface1_name, super_interface2_name,…,super_interfaceN_name
 * 关键字为：extends
 * **/

interface Person { 
  age:number 
} 

interface Musician extends Person { 
  instrument:string 
} 

// var drummer:Musician={
//   age:12,
//   instrument:"s"
// }; 
// 使用类型断言，否则需要设定初始值
var drummer = <Musician>{};
drummer.age = 27 
drummer.instrument = "Drums" 
console.log("年龄:  "+drummer.age)
console.log("喜欢的乐器:  "+drummer.instrument)

/**
 * 类 class
 * 包含：字段，构造函数，方法
 * 构造函数与方法有什么区别？？
 * 构造函数是否类似于函数初始化？
 * 类可以继承
 * 子类除了不能继承父类的私有成员(方法和属性)和构造函数，其他的都可以继承
 * 访问控制修饰符：
 * public(默认):公有，可以在任何地方被访问
 * protected:受保护，可以被其自身以及其子类和父类访问
 * private:私有，只能被其定义所在的类访问
 * **/ 
class Car { 
  // 字段 
  protected s1='sd'
  engine:string; 

  // // 构造函数 
  constructor(engine:string) { 
      this.engine = engine 
  }  

  // 方法 
  disp(a):void { 
      console.log("发动机为 :   "+this.engine) 
      console.log(a)
  } 
}

var cars= new Car("1");
// console.log(Car.s1)
/**
 * 类继承
 * **/ 
class Shape { 
  Area:number 
  
  constructor(a:number) { 
     this.Area = a 
  } 
} 

class Circle extends Shape { 
  disp():void { 
     console.log("圆的面积:  "+this.Area) 
  } 
}
 
var obj5 = new Circle(1); 
obj5.disp()

/**
 * 命名空间：namespace关键字
 * 定义：namespace SomeNameSpaceName
 * 使用：SomeNameSpaceName.SomeClassName;
 * 命名空间可嵌套
 * **/ 
namespace SomeNameSpaceName { 
  export interface ISomeInterfaceName {      }  
  export class SomeClassName {      }  
}