【问题标题】:Class vs Function Constructors in JavaScriptJavaScript 中的类与函数构造函数
【发布时间】:2019-03-10 23:59:24
【问题描述】:

背景:C# 开发人员最近涉足 javascript

以下是在 JavaScript 中创建对象的两种方法。它们之间有什么区别,在创建对象时我应该使用/优先考虑哪种方法以及为什么?

class John {
    constructor(name, birth, height) {
        this.name = name;
        this.birth = birth;
        this.height = height;} }

var Person = function(name, birth, height) {
    this.name = name;
    this.birth = birth;
    this.height = height;}

【问题讨论】:

  • 注意事项 1. 你想支持 Internet Exploder 并且害怕转译器吗?那就别无选择了。

标签: javascript


【解决方案1】:

class 语法是来自被称为 ES6 的较新“版本”JavaScript 的代码。

虽然之前使用过 function 声明并被称为“原型”。

因此,要回答您的问题,优先考虑什么,这实际上取决于您想要支持的浏览器。您可以使用 caniuse 检查浏览器支持:https://caniuse.com/#search=es6%20classes

来自 C#,我认为对您来说最大的不同将是浏览器支持。由于您不知道您的代码将在哪里真正运行,因此您应该经常检查 caniuse。

正如其他人所提到的,有一些编译器可以帮助您摆脱这种痛苦,例如 bublébabel。但是,请注意,它们有自己的优点/缺点。这是我找到的关于该主题的第一个教程:https://scotch.io/tutorials/javascript-transpilers-what-they-are-why-we-need-them

话虽如此,欢迎来到 JavaScript 社区。​​p>

【讨论】:

    【解决方案2】:

    在 es6 之前,构造函数是我们实现类结构和 oop 的方式。您仍然可以,但作为 c# 开发人员,您将更习惯于类表示法。只要浏览器支持es6。它们都是函数

    【讨论】:

      【解决方案3】:

      他们在很大程度上做同样的事情。 class 语法是在 ES2015 中引入的,它为你做了一些事情:

      • 它内置检查函数是否被作为创建新对象的一部分调用,从而消除了在没有new 的情况下调用构造函数所允许的一整类错误。

      • 它允许在构造函数和方法中使用super

      • 更简单,特别是如果你做子类。

      • 如果您使用 ErrorArray 之类的内置函数的子类,它要简单得多(您可以不使用 class)。

      但如果您更喜欢使用旧语法,则无需 class 即可完成所有这些操作。

      当然,如果不通过 Babel 等工具转换为旧语法,您就无法在 IE 等过时浏览器上使用新语法。

      (并且必须注意:在 JavaScript 的原型继承上使用类类陷阱是一种样式选择,而不是要求。如果您愿意,可以直接使用原型继承。)

      您可能还会发现 this answer 很有用,比较 class 语法与使用 function 语法做同样的事情。

      【讨论】:

      • 计划是使用webpack和babel
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2018-06-09
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-01-29
      相关资源
      最近更新 更多