Javascript ES6 类属性赋值

Posted 2023-02-18

【中文标题】Javascript ES6 类属性赋值

【英文标题】：Javascript ES6 classes property assignment

【发布时间】：2018-10-03 15:04:50

【问题描述】：

今天我看到了一种新的语法 JS 类可以分配它们的属性，像这样：

// Syntax 1
class foo 
  constructor(prop)
    this.prop = prop;
  



// Syntax 2
class bar 
  prop = 5;



let testBar  = new foo(5);
let testFoo  = new bar();


console.log(testBar.prop);
console.log(testFoo.prop);

除了第二种语法不是动态的（现在 5 是硬编码的）之外，它们在第一种和第二种语法之间是否有任何区别？第二种语法是在底层转换为第一种语法还是它们具有不同的特征？

如果我找不到有关此特定主题的任何内容，我将不胜感激。

【问题讨论】：

第二个不是有效的 ES6

tc39.github.io/proposal-class-public-fields

是的，我使用了 babel。感谢来源

【参考方案1】：

第二个还没有有效的 ES，但有一个建议，以便将来可能会起作用。如果你今天使用像 Babel 这样的转译器来使用它，那么第二个将被转译为第一个，所以是的，它们是相等的。

【讨论】：

考虑到它在 frontendmasters.com 上的 React Intro v4 中使用，现在似乎已经发货了，但我可以看到它未能进入最终规范......

【参考方案2】：

第二种语法不是类，而是构造函数属性赋值，需要静态关键字

class Bar 
    static prop = 5;

等价于

function Bar() ;
Bar.prop = 5;