web-dev-qa-db-ja.com

誰でもes7のReflect-metadataについて説明できますか?

ES6、JSPM、angular2を1週間勉強していて、このリポジトリを見つけた ES6-loader

下のスクリプトのindex.htmlを見ると、

 System.import('reflect-metadata')
  .then(function() {
    return System.import('app/index');
  })
  .catch(console.log.bind(console));

これは、JSPMのsystemjsポリフィルを使用してES6のimportを取得しています。

質問:この状況で、reflect-metadataは実際に何をしますか? npm Reflect-meta ドキュメントを読むほど、ドキュメントの内容が理解できなくなりますか?

25
Matthew Harwood

'reflect-metadata'はES7の提案であるパッケージです。これにより、メタデータをクラスまたは関数に含めることができます。本質的には 構文糖 です。

例。 Angular 2 ES6:

@Component({selector: "thingy"})
@View({template: "<div><h1>Hello everyone</h1></div>"})
class Thingy{};

ご覧のとおり、@ Componentと@Viewの後にセミコロンはありません。これは、それらが本質的にクラスの(メタ)データのチェーンであるためです。

ここで、同じコードをAngular 2で、ただしES5で)見てみましょう。

function Thingy(){}
Thingy.annotations = [
    new angular.ComponentAnnotation({
        selector: "thingy"
    }),
    new angular.ViewAnnotation({

        template: "<div><h1>Hello everyone</h1></div>"
    })
];

ご覧のとおり、@記号はクラスの注釈プロパティの多くを抽象化し、それをMore D.R.Y にします。

この一歩をさらに踏み出すAngularチームは、注釈が新しいユーザーにとって少し抽象的であることを知っています。さらに、ES5は冗長すぎるため、a.jsアノテーションとのインターフェースを改善します:

これを理解するためのビデオ

50
Matthew Harwood