資訊專欄INFORMATION COLUMN
摘要：使用場景數(shù)據(jù)類型聲明和約束聲明數(shù)據(jù)類型使用數(shù)據(jù)類型面向?qū)ο缶幊踢@里和面向?qū)ο笳Z言類似，用于定義對象接口，聲明對象的結構，定義類時可以實現(xiàn)接口，滿足這個接口定義的功能。
什么是接口
TypeScript的核心就是類型檢查，接口就是用于聲明類型，給內(nèi)部或第三方使用者提供類型聲明和約束。
使用場景數(shù)據(jù)類型聲明和約束
// 聲明數(shù)據(jù)類型
interface CustomerInfo {
customerCode: string;
customerName: string;
}
// 使用數(shù)據(jù)類型
function helloCustomer(customerInfo: CustomerInfo) {
console.log(`Hello, ${customerInfo.customerName}!`);
}
helloCustomer({customerCode: "1001", customerName: "Jee"}); // ok
helloCustomer({customerName: "Jee"}); // error, Property "customerCode" is missing
面向?qū)ο缶幊?/p>
這里和面向?qū)ο笳Z言類似，用于定義對象接口，聲明對象的結構，定義類時可以實現(xiàn)接口，滿足這個接口定義的功能。
// 接口聲明
interface Animal {
name: string;
}
// 接口繼承
interface Mammal extends Animal {
legNum: number;
sound(): string;
}
// 類實現(xiàn)
class Bull implements Mammal {
name: string;
legNum: number;
constructor(name: string) {
this.name = name;
this.legNum = 4;
}
sound() {
return "moo";
}
}
// 實例
let bull1 = new Bull("bull1");
console.log(bull1.sound()); // moo
可變接口屬性
有兩種方式可以實現(xiàn)可變屬性，屬性明確時，推薦第一種。不明確時可以用第二種。
可選屬性，定義可以選傳的屬性
interface CustomerInfo {
customerCode: string;
customerName: string;
customerAddr?: string; // 可選屬性
}
索引類型，支持string，number索引屬性
interface CustomerInfo {
customerCode: string;
customerName: string;
customerAddr?: string; // 可選屬性
[key: string]: any; // 其他任意名稱，任意類型的屬性
}
這里說明一下，因為JavaScript對象中，數(shù)字索引是會轉換成string來取值的。如果一個接口里面，同時有number、string索引屬性時，number索引屬性的類型，必須時string索引屬性的子類型。也就是，number索引的屬性類型，必須能被string索引的屬性類型覆蓋；用number索引去取值，取到的值也是string索引屬性的類型。靜態(tài)屬性和只讀屬性
靜態(tài)類型，即類屬性，static修飾
只讀屬性，初始化后不能修改，readonly修飾
interface CustomerInfo {
static greeting = "Hello"; // 靜態(tài)屬性
static readonly standardGreeting = "Hello"; // 只讀靜態(tài)屬性
readonly customerCode: string; // 只讀屬性
customerName: string; // 普通屬性
}
const vs readonly，變量用const，屬性用readonly函數(shù)類型
接口除了能描述對象類型，還能描述函數(shù)類型（這個和面向?qū)ο笳Z言有點不一樣，需要理解一下）。
interface SearchFunc {
(content: string, key: string): boolean;
}
// 這里參數(shù)名可以不一樣，類型也可以省略
let mySearchFunc: SearchFunc = (c, k) => {
return c.search(k) > -1;
}
后續(xù)
會再寫一遍類的學習，一篇接口與類的結合使用。
文章版權歸作者所有，未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/110302.html
摘要：序列文章從項目中由淺入深的學習微信小程序和快應用從項目中由淺入深的學習前言為什么會有大家有沒想過這個問題原因是是弱類型編程語言也就是申明變量類型可以任意變換。是的超集，也相當于預處理器本文通過一個項目來讓你快速上手。 showImg(https://segmentfault.com/img/bVbruJw?w=1024&h=768); 序列文章 從項目中由淺入深的學習vue,微信小程序...
摘要：接口前端程序員很難理解的點也是一門面向?qū)ο蟮恼Z言，但是中它是基于原型實現(xiàn)的，中使用了類，這樣會更清晰的體會到面向?qū)ο筮@一說法，但是實際在中的面向?qū)ο蟾油暾?，它跟這些語言一樣，通過接口和類去完整的面向?qū)ο缶幊獭? 從入門到放棄的java 初中時自學過JAVA，學了大概一個多月吧， 學了一個多月，看視頻這些，后面放棄了編程。 依稀記得，那段日子極度苦逼，我想如果當時是學javaScrip...
摘要：接口前端程序員很難理解的點也是一門面向?qū)ο蟮恼Z言，但是中它是基于原型實現(xiàn)的，中使用了類，這樣會更清晰的體會到面向?qū)ο筮@一說法，但是實際在中的面向?qū)ο蟾油暾?，它跟這些語言一樣，通過接口和類去完整的面向?qū)ο缶幊獭? 從入門到放棄的java 初中時自學過JAVA，學了大概一個多月吧， 學了一個多月，看視頻這些，后面放棄了編程。 依稀記得，那段日子極度苦逼，我想如果當時是學javaScrip...
摘要：是的超級，遵循最新的規(guī)范相當于包含了的語法。表示方法沒有返回任何類型類型表示的是那些永不存在的值的類型，例如異常錯誤寫法錯誤三函數(shù)內(nèi)容概述函數(shù)的定義可選參數(shù)默認參數(shù)剩余參數(shù)函數(shù)重載箭頭函數(shù)。 一、Typescript 介紹、環(huán)境搭建 1.1 Typescript 介紹 1.TypeScript 是由微軟開發(fā)的一款開源的編程語言，像后端 java、C#這樣的面向?qū)ο笳Z言可以讓 js 開發(fā)...
閱讀 3151·2021-10-08 10:04
閱讀 1088·2021-09-30 09:48
閱讀 3459·2021-09-22 10:53
閱讀 1679·2021-09-10 11:22
閱讀 1693·2021-09-06 15:00
閱讀 2152·2019-08-30 15:56
閱讀 715·2019-08-30 15:53
閱讀 2285·2019-08-30 13:04
