TypeScript-interface接口篇

在这里插入图片描述
简介

接口的作用：在面向对象的编程中，接口是一种规范的定义，它定义了行为和动作的规范，
在程序设计里面，接口起到一种限制和规范的作用。接口定义了某一批类所需要遵守的规范，
接口不关心这些类的内部状态数据，也不关心这些类里方法的实现细节，它只规定这批类里必须提供某些方法，
提供这些方法的类就可以满足实际需要。 typescrip中的接口类似于java，同时还增加了更灵活的接口类型，
包括属性、函数、可索引和类等。定义标准。

1、属性接口

        定义接口
	interface fullName {//关键字是interface
	    first: string;//定义属性名以及类型
	    second: string;//定义属性名以及类型
	    third: number;//定义属性名以及类型
	}
	
	function printName(name: fullName) {//规定传入的值必须符合要求
	    console.log(name.first + "--" + name.second);
	    console.log(name.third);
	}
	// printName({//这种写法错误,直接传对象只能写第一和第二个参数
	// //不能写入其他参数
	//     first : "spring",
	//     second : "summer",
	//     age : 20,
	//     sex : 'male',
	// })
	
	let obj = {//写法正确
	    first: "Missing",//属性名与属性值必须符合要求
	    second: "Kissing",//属性名与属性值必须符合要求
	    third: 20,//属性名与属性值必须符合要求
	}
	printName(obj);//传值
	对传入的值可填可不填
	interface season {
	    one: string;
	    two: string;
	    three: string;
	    four?: string;//加上“?”可以填入值也可以不填入值
	}
	
	function oder(oder: season) {
	    console.log(oder.one);
	    console.log(oder.two);
	    console.log(oder.three);
	    //console.log(oder.four);
	}
	let oderSeason = {
	    one: 'spring',
	    two: "summer",
	    three: "autumn",
	    //four : "winter",//在抽象中已经加入“?”这个值可以不写
	}
	oder(oderSeason);

2、函数类型的接口

	//函数类型接口 对方法传入的参数，以及返回值的约束
	//不能直接传入变量名 必须以实参传递进去
	interface encryption {//定义一个函数类型的接口
	    (key: string, value: string): void;
	}
	
	let admin: encryption = (key: string, value: string): void => {//实现这个接口
	    console.log(key + "---" + value);//name --- Odin
	}
	admin('name', "Odin");

3、可索引接口也就是数组和对象的约束(一般不常用)

	//对数组的约束 可索引接口
	interface userArr {
	    [index: number]: string;//下标的类型必须是number 而数组里面的类型可以任意指定
	}
	let arrayThird: userArr = ["20", "40,"];
	//对 对象的约束
	interface userObj {
	    [index: string]: string;
	}
	let userObject: userObj = {
	    name: "string",
	    age: '20',
	}

4、“类”类型接口：对类的约束和抽象类相似

	interface Rainbow {
	    name: string;
	    color(str: string): void;
	}
	class sevenRainbow implements Rainbow { //使用关键字implements 继承接口
	    name: string;
	    constructor(name: string) {
	        this.name = name;
	    }
	    color(mean: string) {
	        console.log(this.name + ',' + mean);
	    }
	}
	let SevenRainbow = new sevenRainbow("什么是幸福？");
	SevenRainbow.color('幸福就是猫吃鱼，狗吃肉，奥特曼打小怪兽');

谢谢观看！！！如有不足，敬请指教

TypeScript-interface接口篇

猜你喜欢