任何人都可以解释es7反映的内容 - 元数据是什么?

Mat*_*ood 24 npm ecmascript-6 systemjs jspm ecmascript-7

一直在研究ES6,JSPM和angular2一周,我找到了这个repo ES6-loader

如果我们查看底部脚本中的index.html,您会看到

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

这是使用JSPM的systemjs polyfill来获取ES6 import.

问题: 在这种情况下,反射元数据到底是做什么的?npm reflect-meta我阅读的文档越多,我就越不了解它的作用吗?

Mat*_*ood 48

'reflect-metadata' 是一个包,它是ES7的提案.它允许将元数据包含在类或函数中; 基本上它是语法糖.

例.Angular 2 ES6:

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

正如您所看到的,在@Component和@View之后没有分号.这是因为它们本质上是类的(元)数据的链.

现在让我们看一下Angular 2中的相同代码但是在ES5中:

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

        template: "<div><h1>Hello everyone</h1></div>"
    })
];
Run Code Online (Sandbox Code Playgroud)

正如您所看到的,@符号抽象出了很多类的注释属性,并使其更加干净.

更进一步,Angular团队知道注释对于新用户来说有点抽象.而且,ES5太冗长了.这就是为什么他们制作a.js哪个会更好地与注释接口:

视频了解这一点

  • 很好的答案.谢谢. (3认同)
  • 什么是a.js?我的评论不够长 (2认同)