TypeScript 中的interface接口
<h1 id="使用接口约束类型">使用接口约束类型</h1><pre><code class="language-ts">interface Girl {
name: string;
age: number;
bust: number;
}
const screenResume = (girl: Girl) => {
girl.age < 24 && girl.bust >= 90 && console.log(girl.name + "进入面试");
girl.age > 24 || (girl.bust < 90 && console.log(girl.name + "你被淘汰"));
};
const getResume = (girl: Girl) => {
console.log(girl.name + "年龄是:" + girl.age);
console.log(girl.name + "胸围是:" + girl.bust);
};
const girl = {
name: "大脚",
age: 18,
bust: 94,
};
screenResume(girl);
getResume(girl);
</code></pre>
<p>接口和类型别名很像,但是类型别名可以直接给类型,比如string,而接口必须代表对象。</p>
<h1 id="接口非必选值的定义">接口非必选值的定义</h1>
<pre><code class="language-ts">// 使用 ? 来标记可选值
interface Girl {
name: string;
age: number;
bust: number;
waistline?: number;
}
const getResume = (girl: Girl) => {
console.log(girl.name + "年龄是:" + girl.age);
console.log(girl.name + "胸围是:" + girl.bust);
girl.waistline && console.log(girl.name + "腰围是:" + girl.waistline);
};
</code></pre>
<hr>
<h1 id="允许加入任意值">允许加入任意值</h1>
<pre><code class="language-ts">interface Girl {
name: string;
age: number;
bust: number;
waistline?: number;
: any;
}
const girl = {
name: "大脚",
age: 18,
bust: 94,
waistline: 21,
sex: "女",
};
const getResume = (girl: Girl) => {
console.log(girl.name + "年龄是:" + girl.age);
console.log(girl.name + "胸围是:" + girl.bust);
girl.waistline && console.log(girl.name + "腰围是:" + girl.waistline);
girl.sex && console.log(girl.name + "性别是:" + girl.sex);
};
</code></pre>
<h1 id="接口里的方法">接口里的方法</h1>
<pre><code class="language-ts">interface Girl {
name: string;
age: number;
bust: number;
waistline?: number;
: any;
say(): string;
}
const girl = {
name: "大脚",
age: 18,
bust: 94,
waistline: 21,
sex: "女",
say() {
return "欢迎光临 ,红浪漫洗浴!!";
},
};
</code></pre>
<h1 id="接口和类的约束">接口和类的约束</h1>
<pre><code class="language-ts">class XiaoJieJie implements Girl {
name = "刘英";
age = 18;
bust = 90;
say() {
return "欢迎光临 ,红浪漫洗浴!!";
}
}
</code></pre>
<h1 id="接口间的继承">接口间的继承</h1>
<pre><code class="language-ts">interface Teacher extends Girl {
teach(): string;
}
</code></pre>
<hr>
<p>参考:<br>
技术胖——TypeScript从入门到精通(08. TypeScript中的interface接口)<br>
技术胖——TypeScript从入门到精通(09. TypeScript中的interface接口 2)</p><br><br>
来源:https://www.cnblogs.com/xch-jiang/p/14254107.html
頁:
[1]