布尔类型 boolean
let isDone: boolean = false;
isDone =true;
任意类型 any
let anyVualue:any = 7;
anyVualue ="stringhahah";
//隐式定义类型(变量的类型会是初始化 赋值 那个值的 类型)
let aa="seven"; // 这个aa的类型 被隐式 为 字符串类型
//可选类型 |
let myFavoriteNumber: string | number ="nihao";
myFavoriteNumber = 7;
//对象的类型 ---使用接口的方式申明对象的类型
interface Person{
name:string,
age:number,
readonly gender:string, // 不能修改的属性
qita?:string,//可不定义,定义了就要字符串类型
[propName:string]:any, //[propName:string] 剩下的属性,key值为string ,值为 所有类型
}
let person:Person={
name:"Owen",
age:26,
gender:"男",
qita:"其他",
fdfd:"fdfs",
fdfdd:"fdfdf",
dfd:0,
fdfg:false,
}
//person.gender="女";//设置了readonly,赋值之后不能改
//数组的类型
//1.「类型 + 方括号」来表示数组
let arr:number[ ]=[1,3,5,7,9];
let arrAny:any[ ]=["a",{a:"dd"},true,false,4];
//2.数组的泛型表示法
let arr3:Array<number> = [1,3,5,7,9];
let arrStr:Array<string> = ["fd","fdd","feee"];
//2数组的接口表示法(不常用)
interface NumberArray{
[index:number]:number;
}
let arrTestnum:NumberArray=[1,3,5,7,9];
interface AnyArray{
[index:number]:any;
}
let arrTestAny:AnyArray=["a",{a:"dd"},true,false,4];
//函数
//1.函数的声明方式
function sum(x:number,y:number):number{ // 传入的参数类型 : 返回值的类型
return x+y;
}
sum(8,9);
//可选参数,备注 可选参数必须 放在最后面
function select(frist:string,second?:string){
if(second){
return frist+""+second
}else{
return frist
}
}
let Owen= select("O","wen")
// 默认值,系统直接识别它作为可选参数并不受「可选参数必须接在必需参数后面」的限制
function select2(frist:string,second:string="opp"){ //默认值不受qian
if(second){
return frist+""+second
}else{
return frist
}
}
let Owen2= select2("O")
function select3(frist:string="tom",second:string){
if(second){
return frist+""+second
}else{
return frist
}
}
let Owen3= select3(undefined,"O")
//2.函数的表达式方式 =>的左边是输入类型,右边是输出类型
let mySum:(x:number,y:number)=>number = function(x:number,y:number):number{
return x+y;
}
//3.用接口定义函数
interface SearchFunc{
(w:string,r:string):boolean
}
let myfunction:SearchFunc=function(w:string,r:string){
return w.search(r) !==-1
}
//4.剩余参数...rest
function push(array: any[], ...items: any[ ]){
items.forEach(function(item){
array.push(item)
})
}
let a = [];
push(a,1,2,3,4)
//5.函数的重载
function reverse(x: number): number;
function reverse(x: string): string;
function reverse(x: number | string): number | string {
if (typeof x === 'number') {
return Number(x.toString().split('').reverse().join(''));
} else if (typeof x === 'string') {
return x.split('').reverse().join('');
}
}
//类型断言
// function getLength(something: string | number): number {
// if (something.length) {//这里需要把something断言成string
// return something.length;
// } else {
// return something.toString().length;
// }
// }
// 方式1 <类型>值
function getLength(something: string | number): number {
if ((<string>something).length) {//这里需要把something断言成string(只能断言成联合类型存在的type)
return (<string>something).length;
} else {
return something.toString().length;
}
}
//as 类型(在tsx中必须使用这种方式)!!!
function getLength2(something: string | number): number {
if ((something as string).length) {//这里需要把something断言成string(只能断言成联合类型存在的type)
return (something as string).length;
} else {
return something.toString().length;
}
}
//声明
// declare var 声明全局变量
// declare function 声明全局方法
// declare class 声明全局类
// declare enum 声明全局枚举类型
// declare namespace 声明(含有子属性的)全局对象
// interface 和 type 声明全局类型
// export 导出变量
// export namespace 导出(含有子属性的)对象
// export default ES6 默认导出
// export = commonjs 导出模块
// export as namespace UMD 库声明全局变量
// declare global 扩展全局变量
//declare module 扩展模块
/// <reference /> 三斜线指令
//声明文件 通常我们会把声明语句放到一个单独的文件(jQuery.d.ts)中,这就是声明文件
//声明文件必需以 .d.ts 为后缀。
//内置对象
//ECMAScript 的标准的内置对象Boolean、Error、Date、RegExp等在typeScript的定义
let b:Boolean = new Boolean(1);
let e:Error = new Error("Error occurred");
let d:Date = new Date();
let r:RegExp = /[a-z]/;
// DOM和BOM的内置对象
let body:HTMLElement =document.body;
let allDiv:NodeList = document.querySelectorAll('div');
document.addEventListener("click",function(e:MouseEvent){
//dosometing
})
//Math.pow(10,'6');//报错,TS核心库做了类型判断了
Math.pow(10,6);
//注意Node.js不是内置对象的一部分,如果要写Node.js,则需引入 npm install @types/node --save-dev
//--------进阶部分----
//1.类型别名 使用 type
type Name =string;
type NameResolver=()=>string;
type NameOrResolver= Name|NameResolver;
function getName(n:NameOrResolver):Name{
if(typeof n==="string"){
return n
}else{
return n()
}
}
//2.字符串字面量类型 也使用 type
type EventNames='click'|'scroll'|'mousemove';
function handleEvent(ele:Element,event:EventNames){
}
handleEvent(document.getElementById("hello"),'scroll');//第二个参数在'click'|'scroll'|'mousemove'选其中之一
//3.元组 数组合并了相同类型的对象,而元组(Tuple)合并了不同类型的对象。
let tom: [string, number] = ['Tom', 25];
//tom[0] = 'Tom';//1.也可以赋值一项
tom[1] = 25;
tom = ['Tom',26];//2.这样也可以
//tom = ['Tom'];//3.这样不可以,没有对应上
tom[0].slice(1);
tom[1].toFixed(2);
// 元素越界
tom.push('male');//越界元素会受限为 元组中的每个类型的联合类型
//tom.push(true);//报错,true不在 推断出来的联合类型里面
//类(类的定义,继承,修饰符,抽象类)
//js类的定义
function Person2(name){
this.name = name;
this.print=function(){
console.log(this.name)
}
}
var P= new Person2("Owen2");
P.print();
//ts类的定义:
class Person2{
name:string;
age:number;
constructor(name:string,age:number){
this.name = name;
this.age = age
}
print(){
return this.name+""+this.age
}
}
var P=new Person2("Owen2",26);
console.log(P.print());
//类的继承
class students extends Person2{
cardnumber:string;
school:string;
constructor(cardnumber:string,school:string){
super("wenmi",25);
this.cardnumber=cardnumber;
this.school=school;
}
dohomework(){
return this.name+""+this.age+"岁,就读于"+this.school+"学号"+this.cardnumber
}
}
// var stu1=new students("wenmi",25);
// stu1.cardnumber="2001";
// stu1.school="江汉学院";
let stu1=new students("2001","江汉学院");
console.log(stu1.dohomework());
//接口的继承
interface Printer{
getMsg();
}
interface ColorPrinter extends Printer{
printing();
}
class HPPrinter implements ColorPrinter{
printing(){
console.log("打印Ok")
}
getMsg(){
console.log("HP10011")
}
}
let HP=new HPPrinter();
HP.getMsg();
HP.printing();
//访问修饰符:public private protected
class Person3{
public name:string;
private age:number;
protected email:string;
constructor(name:string,age:number,email:string){
this.name = name;
this.age = age;
this.email = email;
}
print(){
return this.name+""+this.age
}
}
var P3= new Person3("Owen3",26,"221111@qq.com");
console.log(P3.name);
console.log(P3.print);
//console.log(P3.age);//private私有属性 只能在类中访问
//console.log(P3.email);//protected只能在类 或其 子类中 访问
class student3 extends Person3{
show(){
console.log(this.name,this.email);//子类型能访问属性 email (protected)
}
}
//js类的静态属性 和方法
// function Persion4(){
// //实例属性
// this.name="Owendd";
// //实例方法
// this.print=function(){}
// }
// Persion4.age=28;//静态属性
// Persion4.print2=function(){};//静态方法
// Persion4.print2();//调用静态方法
// console.log(Persion4.age);
// let P4=new Persion4();
// P4.print();//调用实例方法
//ts类的静态属性和方法
class persion5{
name:string;
static age:number;
email:string;
constructor(name:string,age:number,email:string){
this.name = name;
//this.age = age;
persion5.age=age;
this.email = email;
}
print(){
return this.name+""+":"
}
static show(){
console.log("show 方法")
}
}
persion5.show();
//persion5.age=25;
let P5=new persion5("owen5",25,"wwww@qq.com");
P5.print();
//多态
class Animal{
eat(){
console.log("animal eat");
}
}
class Cat extends Animal{
eat(){
console.log("猫吃鱼")
}
}
let C1=new Cat();
C1.eat();
//抽象类/抽象方法
//1.抽象类是提供其他类继承的基类(父类),不能直接被实例化
//2.抽象方法只能包含在抽象类中,抽象类中可以包含 抽象方法和非抽象方法
//3.子类继承抽象类,实现抽象方法
//定义
abstract class Animals{
abstract eat();//抽象方法没有 方法体
run(){//普通方法
console.log("run run run ")
}
}
class Cats extends Animals{
eat(){
console.log("猫猫吃鱼")
}
}
class Dogs extends Animals{
eat(){
console.log("狗狗吃骨头")
}
}
let C2=new Cats();
C2.eat();//猫吃鱼
let D2=new Dogs();
D2.eat();//狗狗吃骨头
//函数的定义: 2.参数(可选参数/默认参数/剩余参数)
// js
// function add(x,y){
// return x+y;
// }
// //匿名函数
// let add1=function(x,y){
// return x+y;
// }
// ts
function add(x:number,y:number):number{
return x+y;
}
function show(name,age?:number):void{//1.可选参数需要在其他参数之后
console.log(name,age)
}
function show2(age:number=20,name):void{//2.默认参数,不传时采用默认值
console.log(name,age)
}
show2(10,"owen");//owen 10
function add1(x1,x2,...x:number[]):number{
var sum2=0;
for (var i=0;i<x.length;i++){
sum2+=x[i];
}
return x1+x2+sum2;
}
var sum2=add1(1,2,3,4,5,6,7,8);
console.log(sum2);
//函数重载
function getinfo(name:string):void;
function getinfo(age:number):void;
function getinfo(str:any):void{
if(typeof str=="string"){
console.log("名字",str)
}
if(typeof str=="number"){
console.log("年龄",str)
}
}
getinfo("Owen");
getinfo(11);
//泛型
//函数
function parintT<T>(arr:T[ ]):void{//这个T是习惯写法,也可以写A其它字母
for(var item of arr){
console.log(item);
}
}
parintT<number>([1,2,3,4]);
parintT<string>(["aa","bb","cc"]);
//泛型类
class myArraylist<T>{
public name:T;
public list:T[]=[];
addT(val:T):void{
this.list.push(val)
}
}
var arrT=new myArraylist<number>();
arrT.addT(11);
console.log(arrT.list);
//泛型接口
interface Iadd<T>{
(x:T,y:T):T;
}
var addJ:Iadd<number>
addJ=function(x:number,y:number){
return x+y;
}
console.log(addJ(1,8))