Question

在 ES6 中，您可以让自定义类扩展javascript内置对象。像这样，您可以使用自定义方法制作Array，Number，String，Date个对象。

我正在尝试使用它，并尝试将我的对象包装在名为My的容器对象中，只需遵循示例here from MDN (Mozilla Developer Network)。但是当我在对象中定义我的自定义Date类时，如下所示：

var My = {};

class My.Date extends Date {
  constructor() {
    super();
  }

  getFormattedDate() {
    var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
    return this.getDate() + "-" + months[this.getMonth()] + "-" + this.getFullYear();
  }
}

我得到以下 SyntaxError ：

Uncaught SyntaxError：意外的令牌。

Here is a fiddle 证明了这一点。

我打赌有办法解决这个问题，但我不知道该怎么做......

Answer 1

不允许在您的类名中使用.。但是可以将类实例添加到命名空间。

var My = {};

class MyDate extends Date {
  constructor() {
    super();
  }

  getFormattedDate() {
    var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
    return this.getDate() + "-" + months[this.getMonth()] + "-" + this.getFullYear();
  }
}

My.Date = MyDate;

或直接

var My = {};

My.Date = class MyDate extends Date {
  constructor() {
    super();
  }

  getFormattedDate() {
    var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
    return this.getDate() + "-" + months[this.getMonth()] + "-" + this.getFullYear();
  }
}

Answer 2

解决方法是将逻辑包装在函数中，以便在函数本地范围内声明新类，然后将其添加到函数内的全局reactimate容器中。
像这样，您可以使用自定义对象（扩展基元）而不会弄乱全局对象，它们看起来仍然相似（例如，在控制台中打印时类名称为My。）

Date

this answer here的另一个解决方案：

var My = {};

function init(){

    class Date extends window.Date {
        constructor() {
            super();
        }

        getFormattedDate() {
            var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
            return this.getDate() + "-" + months[this.getMonth()] + "-" + this.getFullYear();
        }
    }

    My.Date = Date;

}

init();

Date === window.Date; // true
My.Date === window.Date; // false
My.Date.name // Date -> class name
new My.Date().getFormattedDate(); // 2-Jun-2016

扩展javascript类并将它们包装在容器对象中

2 个答案: