Search
Ad
|
新規
下位
一覧
検索
最新
ヘルプ
ページへ戻る
編集
複製
履歴
添付
印刷
TypeScriptのInterface
をテンプレートにして作成
xpwiki
:TypeScriptのInterface をテンプレートにして作成
開始行:
Interfaceというと、他の言語ならクラス定義の型のようなもの...
おそらく、JavaScriptで起こる型関係のエラーを全部どうにか...
このページの内容は公式ページとだいたい同じなので、そちら...
*Interfaceの概要
Interfaceは要素の存在が指定できるオブジェクトのようなもの。
function printLabel(labelledObj: {label: string}) {
console.log(labelledObj.label);
}
var myObj = {size: 10, label: "Size 10 Object"};
printLabel(myObj);
もしmyObjにlabelという要素が無いと変換時にエラーとなる。
これによりJavaScript開発でよくある、オブジェクトの中に要...
毎回上のように「{label: string}」と書いていくのは大変なの...
interface LabelledValue {
label: string;
}
すると次からこれを使って型を指定できる。
function printLabel(labelledObj: LabelledValue) {
console.log(labelledObj.label);
}
要素の存在を指定するのがInterfaceの良い所だが、とはいえ実...
interface LabelledValue {
label?: string;
}
要素が無いこともあるので使うときはチェックして使う。
if(labelledObj.label){
console.log(labelledObj.label);
}else{
console.log("no label");
}
この場合、要素の存在を保証するという利点は失われるが、エ...
*関数型
JavaScriptは変数に関数を入れられるので、コールバック関数...
関数のInterfaceは「(引数のリスト):戻り値の型」という形式...
interface MyFunction{
(arg1:string,arg2:string):boolean;
}
これで２つのstring型の引数を持ち、戻り値がbooleanの関数の...
var myFunc:MyFunction = function(arg1:string,arg2:string...
//なにか処理
}
もちろん、Interfaceで指定した引数と戻り値を持たない関数を...
*配列型
Interfaceには配列も定義できる。添字にはnumberとstringが設...
interface Dictionary {
[index: string]: string;
}
ただし、他の要素を加えるときにはその型が配列の添字と同じ...
interface Dictionary {
[index: string]: string;
length: number;//stringじゃないのでエラー
}
interface Dictionary {
[index: string]: string;
length: string;//stringなのでOK
}
「[]」でアクセスしたときに矛盾するからと思われる。
*クラス型
クラスの型定義。他の言語でInterfaceという時と同じもの。「...
interface ClockInterface {
currentTime: Date;
setTime(d: Date);
}
class Clock implements ClockInterface {
currentTime: Date;
setTime(d: Date) {
this.currentTime = d;
}
constructor(h: number, m: number) { }
}
**new
newを使うとインスタンス製作時の引数を指定できる。ただし、...
interface ClockInterface {
new (hour: number, minute: number);
}
class Clock implements ClockInterface {
currentTime: Date;
constructor(h: number, m: number) { }
}
これはエラー。
interface ClockStatic {
new (hour: number, minute: number);
}
class Clock {
currentTime: Date;
constructor(h: number, m: number) { }
}
var cs: ClockStatic = Clock;
var newClock = new cs(7, 30);
こちらはOK。コンストラクタはstaticに属するが、newでチェッ...
*Interfaceの継承
extendsでInterfaceからInterfaceを継承できる。何個でもでき...
interface Shape {
color: string;
}
interface PenStroke {
penWidth: number;
}
interface Square extends Shape, PenStroke {
sideLength: number;
}
var square = <Square>{};
square.color = "blue";
square.sideLength = 10;
square.penWidth = 5.0;
*ハイブリッド型
一つのInterfaceをいろいろな型として使える。
interface Counter {
(start: number): string;
interval: number;
reset(): void;
}
var c: Counter;
c(10);//関数型として
c.reset();//クラス型としてメソッド呼び出し
c.interval = 5.0;//プロパティ
クラスで良いし、理解しづらいのであまり使われなさそうな気...
終了行:
Interfaceというと、他の言語ならクラス定義の型のようなもの...
おそらく、JavaScriptで起こる型関係のエラーを全部どうにか...
このページの内容は公式ページとだいたい同じなので、そちら...
*Interfaceの概要
Interfaceは要素の存在が指定できるオブジェクトのようなもの。
function printLabel(labelledObj: {label: string}) {
console.log(labelledObj.label);
}
var myObj = {size: 10, label: "Size 10 Object"};
printLabel(myObj);
もしmyObjにlabelという要素が無いと変換時にエラーとなる。
これによりJavaScript開発でよくある、オブジェクトの中に要...
毎回上のように「{label: string}」と書いていくのは大変なの...
interface LabelledValue {
label: string;
}
すると次からこれを使って型を指定できる。
function printLabel(labelledObj: LabelledValue) {
console.log(labelledObj.label);
}
要素の存在を指定するのがInterfaceの良い所だが、とはいえ実...
interface LabelledValue {
label?: string;
}
要素が無いこともあるので使うときはチェックして使う。
if(labelledObj.label){
console.log(labelledObj.label);
}else{
console.log("no label");
}
この場合、要素の存在を保証するという利点は失われるが、エ...
*関数型
JavaScriptは変数に関数を入れられるので、コールバック関数...
関数のInterfaceは「(引数のリスト):戻り値の型」という形式...
interface MyFunction{
(arg1:string,arg2:string):boolean;
}
これで２つのstring型の引数を持ち、戻り値がbooleanの関数の...
var myFunc:MyFunction = function(arg1:string,arg2:string...
//なにか処理
}
もちろん、Interfaceで指定した引数と戻り値を持たない関数を...
*配列型
Interfaceには配列も定義できる。添字にはnumberとstringが設...
interface Dictionary {
[index: string]: string;
}
ただし、他の要素を加えるときにはその型が配列の添字と同じ...
interface Dictionary {
[index: string]: string;
length: number;//stringじゃないのでエラー
}
interface Dictionary {
[index: string]: string;
length: string;//stringなのでOK
}
「[]」でアクセスしたときに矛盾するからと思われる。
*クラス型
クラスの型定義。他の言語でInterfaceという時と同じもの。「...
interface ClockInterface {
currentTime: Date;
setTime(d: Date);
}
class Clock implements ClockInterface {
currentTime: Date;
setTime(d: Date) {
this.currentTime = d;
}
constructor(h: number, m: number) { }
}
**new
newを使うとインスタンス製作時の引数を指定できる。ただし、...
interface ClockInterface {
new (hour: number, minute: number);
}
class Clock implements ClockInterface {
currentTime: Date;
constructor(h: number, m: number) { }
}
これはエラー。
interface ClockStatic {
new (hour: number, minute: number);
}
class Clock {
currentTime: Date;
constructor(h: number, m: number) { }
}
var cs: ClockStatic = Clock;
var newClock = new cs(7, 30);
こちらはOK。コンストラクタはstaticに属するが、newでチェッ...
*Interfaceの継承
extendsでInterfaceからInterfaceを継承できる。何個でもでき...
interface Shape {
color: string;
}
interface PenStroke {
penWidth: number;
}
interface Square extends Shape, PenStroke {
sideLength: number;
}
var square = <Square>{};
square.color = "blue";
square.sideLength = 10;
square.penWidth = 5.0;
*ハイブリッド型
一つのInterfaceをいろいろな型として使える。
interface Counter {
(start: number): string;
interval: number;
reset(): void;
}
var c: Counter;
c(10);//関数型として
c.reset();//クラス型としてメソッド呼び出し
c.interval = 5.0;//プロパティ
クラスで良いし、理解しづらいのであまり使われなさそうな気...
ページ名:
ぺージ情報
ぺージ名 :
TypeScriptのInterface
ページ別名 :
未設定
ページ作成 :
njf
閲覧可
グループ :
すべての訪問者
ユーザー :
すべての訪問者
編集可
グループ :
すべての訪問者
ユーザー :
すべての訪問者
Counter: 0, today: 0, yesterday: 0
MenuBar
20
最新の0件
広告
ログイン
ユーザー名:
パスワード:
パスワード紛失
新規
下位
一覧
検索
最新
ヘルプ
ページへ戻る
編集
複製
履歴
添付
印刷
