サンプルコード：angular2でモックを作る

Question

私はAngular2を学んでいます。 DIページには、模擬用のサンプルコードがあります。 https://angular.io/docs/ts/latest/guide/dependency-injection.html

それはHeroService関数からmockService関数を定義ように見えます

let mockService = <HeroService> {getHeroes:() => expectedHeroes } 

を何を意味します。

<HeroService>とは何ですか？ <HeroService>はキャストされていますか？

let expectedHeroes = [{name: 'A'}, {name: 'B'}] 
let mockService = <HeroService> {getHeroes:() => expectedHeroes } 

it('should have heroes when HeroListComponent created',() => { 
    let hlc = new HeroListComponent(mockService); 
    expect(hlc.heroes.length).toEqual(expectedHeroes.length); 
}); 

Answer 1

JB Nizet's answerに追加し、コードの背後にある理由について少し説明します。

タイプスクリプトは、Structural Type Systemを使用します。これが意味することは、もしそれがアヒルのように噛み砕くならば、それはアヒル（またはより正確にはと互換性があり、とアヒルと考えられる）と考えることができるということです。例えば取る

class Duck { 
    quack() { } 
} 

let duck = { 
    quack:() => {} 
} 

duckがquackメソッドを持っているので、あなたは、Duckを期待するものに渡し

function doQuack(duck: Duck) { 
    duck.quack(); 
} 

doQuack(duck); 

活字体がduckオブジェクトリテラルを考えることができることを知っているのに十分にスマートであるようにすることができますたとえ実際にを使用してDuckのインスタンスを作成していない場合でも、Duckとなります。これは、duckの構造がと互換性があり、タイプの型で十分であるため、構造に一致するためです。構造は単一のquackメソッドのみである。

duckをDuckと入力すると、quackメソッドがないと、コンパイルエラーが発生します。あなたの例と言われていること

let duck: Duck = { // compile error 
    mooo:() => {} 
}; 

let duck: Duck = { 
    quack:() => {} // OK 
} 

は、HeroSerivceは、idで英雄を得るために、すべての英雄を得るために1、および1つの二つの方法があります。 HeroService

class HeroComponent { 
    constructor(heroService: HeroService) {} 
} 

を受け取るコンストラクタを持つ

class HeroService { 
    getHeroes(): Hero[] { .. } 
    getHeroById(id: number): Hero { .. } 
} 

そしてHeroComponent我々はHeroComponentコンストラクタに次の

let mockService = { getHeroes:() => expectedHeroes } 

に合格しようと今、私たちは、コンパイルエラーになりますmockServiceが構造に一致しないため、のHeroService。構造体が実際にの2つのメソッド、getHeroesおよびgetHeroで構成されている場合、1つのgetHeroesメソッドしかありません。

コンパイラにそれを受け入れるように強制するには、<HeroService>にキャストします。

構造体と一致するため、次のように渡すことができます（キャストなし）。

let mockService = { 
    getHeroes:() => expectedHeroes, 
    getHero: (id: number) => null 
}; 

---

_{- 活字体のドキュメントの章Type Compatibility}

からの続きを読みます

Answer 2

JavaScriptおよびTypeScriptでは、{a: b}はオブジェクトリテラルです。それは値bを持つ1つのプロパティーaを持つオブジェクトを定義しました。

ので

{getHeroes:() => expectedHeroes } 

は値() => expectedHeroes() => expectedHeroesあるgetHeroes命名つのプロパティを持つオブジェクトです。したがって、値は引数を取らず（()）、値expectedHeroesを返す関数です。

<HeroService>をtype assertionと呼ばれている：

時々、あなたは活字体はよりも価値についての詳細を知っているよな状況になってしまいます。通常、これは、あるエンティティのタイプが現在のタイプよりも具体的である可能性があることが分かったときに発生します。

タイプアサーションは、コンパイラに「信頼して、私がしていることを知っている」と伝える方法です。タイプアサーションは、他の言語の型キャストと似ていますが、特別なチェックやデータの再構築を行いません。実行時の影響はなく、純粋にコンパイラによって使用されます。