Polymer 聚合物2.0语法差异

我对聚合物还不熟悉，我正在努力澄清这些想法

我看到了以下语法：

<script>

Polymer({
  is: 'shop-app',
  properties: {
    page: {
      type: String,
      reflectToAttribute: true,
      observer: '_pageChanged'
    },
    //...
    </script>

聚合物({
是：“商店应用程序”，
特性：{
第页：{
类型：字符串，
reflectToAttribute:true，
观察者：''u pageChanged'
},
//...

但是在很多教程中（包括这本来自谷歌的教程），使用了另一种语法。我似乎无法理解其中的区别。为什么使用一种而不是另一种

<script>

// Extend Polymer.Element base class
class MyCarousel extends Polymer.Element {

  static get is() { return 'my-carousel' }

  connectedCallback() {
    super.connectedCallback();
  }

}

// Register custom element definition using standard platform API
customElements.define(MyCarousel.is, MyCarousel);

 </script>

//扩展聚合物。元素基类
类MyCarousel.Element{
静态get是（）{return'my carousel'}
connectedCallback（）{
super.connectedCallback（）；
}
}
//使用标准平台API注册自定义元素定义
自定义元素。定义（MyCarousel.is，MyCarousel）；

您发布的第一个代码块是Polymer 1.x的工作方式。通过导入

Polymer/Polymer.html

以及

Polymer/Polymer elements.html

，您仍然可以在Polymer 2.0中实际使用这些元素。它们被称为混合组件

类类型语法与javascript ES6一起出现。并非所有javascript引擎都理解ES6，因此通常需要使用Babel将ES6代码传输到ES5

---

Polymer 2.0对ES6充满了热情，因此您现在可以使用发布的第二个代码块中的代码来编写Polymer元素。这种新方法旨在向开发人员展示您与浏览器组件的距离。Polymer.Element实际上是HtmleElement的扩展，HtmleElement是bro中元素的基本构建块wser.

谢谢您的回复。您能提供文档链接来论证您的答案吗？在这种情况下，我将把这个问题标记为解决方案。如果您阅读github页面上的自述文件：，它将在标题“1.0兼容层”和“2.0 ES6基于类的语法”下更详细地解释上述导入它还解释了“聚合物在1分钟内”下顶部HTMLElement的延伸