功能语法

之前我创建了一些类，但我使用的语法一直在创建一个函数。见下文。

function myFunction(myProp1, myProp2)
{
    // see if set, otherwise use the default value (after the colon)
    myProp1 = typeof myProp1 !== "undefined" ? myProp1 : 1;
    myProp2 = typeof myProp2 !== "undefined" ? myProp2 : 2;

    // simple function
    this.doSomething = function ()
    {
        return myProp1 + myProp2;
    }
}
var myObj = new myFunction(2, 4);
myObj.doSomething(); // returns 6

类语法

今天我发现可以使用以下代码实现相同目的。

class myClass
{
    constructor(myProp1, myProp2)
    {
        // see if set, otherwise use the default value (after the colon)
        this.myProp1 = typeof myProp1 !== "undefined" ? myProp1 : 1;
        this.myProp2 = typeof myProp2 !== "undefined" ? myProp2 : 2;
    }

    // simple function
    doSomething()
    {
        return this.myProp1 + this.myProp2;
    }
}
var myObj = new myClass(2, 4);
myObj.doSomething(); // returns 6

现在就是问题

是否存在真正的差异，或者仅仅是我在使用哪种方法创建新对象时的品味差异？

修改
为了澄清，我将在下面提出一些问题。

问题：

@MasterBob提到了支持。所有浏览器都不支持class方式吗？如果没有，那么不支持哪些浏览器？
继承。这两个版本是继承不同的属性还是完全相同？

Answer 1

没有太多差异，但这里有一些：

class myClass extends myClass2

现在，这可能不是那么有问题，因为有myFunction.prototype = Object.create(myFunction2);，但是，它可能有点复杂。

浏览器支持。

ECMAScript 6引入了类，但构造函数有多长时间了？当然，相当长的一段时间。有些浏览器可能不支持类。

所以，总而言之，在我看来，你应该使用构造函数来支持浏览器。但是如果你要在遥远的未来某个时候编写代码 - 课程更整洁，更容易阅读。

Answer 2

引用MDN

ECMAScript 2015中引入的JavaScript类是语法糖通过JavaScript现有的基于原型的继承。

进一步说

类语法没有向JavaScript引入新的面向对象的继承模型

我认为考虑到这一点，我们可以说这只是品味的差异，至少取决于

ECMAScript 2015（第6版，ECMA-262）

Answer 3

我发现的一个区别是，使用旧语法扩展像Promise这样的内置类是不可能的，但我认为使用新语法可以实现。我不确定它目前的支持情况。此问题中的更多详细信息：Extending a Promise in Javascript。

Answer 4

存在一些差异，这不仅仅是品味问题。两者之间最重要的区别：您可以忘记在第一个示例中使用new，第二个示例则需要它。

new myFunction（）vs new myClass（）

功能语法

类语法

现在就是问题

4 个答案: