ecmascript-6 – 使用ES6类扩展阵列

前端之家收集整理的这篇文章主要介绍了ecmascript-6 – 使用ES6类扩展阵列前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我听说ES6现在终于允许子类Array了.这是一个例子
class Stack extends Array {
    constructor() { super() }
    top() { return this[this.length - 1]; }
  }

  var s = new Stack();
  s.push("world");
  s.push("hello");
  console.log(s.top());  // "hello"
  console.log(s.length); // 2

当然可以.至少在Traceur中,显式设置长度不会截断数组.而当通过console.log进行打印时,输出是以对象形式而不是数组形式,这表明有人并不把它视为一个“真实”数组.

这是Traceur如何实现子类化内置对象的问题,还是ES6的限制?

解决方法

长答案

在正常情况下,Ecmascript 6中的子类化仅仅是句法糖,所以它仍然是Ecmascript 5的原型链接.这意味着Traceur中的扩展类型在大多数情况下与“实际”标签6中的扩展类似.

数组实例是特殊的 – ECMAScript 6规范将其称为异域.他们处理属性长度不能通过普通的JavaScript来复制.如果您调用构造函数,则会创建一个Stack的实例,而不是一个异乎寻常的对象(异乎寻常的是ES6规范中的官方名称).

但不要绝望,解决方案不是由类扩展本身提供的,而是通过(重新)介绍__proto__属性.

解决方

Ecmascript 6重新引入可写的__proto__属性.它曾经只能在Firefox上可用,并且已被弃用,但现在已经在ES6中恢复正常运行.这意味着您可以创建一个真正的数组,然后“升级”到您的自定义类.

所以现在你可以执行以下操作:

function Stack(len) {
    var inst = new Array(len);
    inst.__proto__ = Stack.prototype;
    return inst;
}
Stack.prototype = Object.create(Array.prototype);

简短答案

所以子类应该在ES6中工作.如果他们没有使用新的类扩展语法来设计过程,那么您可能必须手动使用__proto__技巧,还有一些尚未公开的诡计.您将无法使用Traceur和Typescript等透明器在ES5中完成此任务,但您可能可以使用Firefox(尽可能记住)已经支持__proto__一段时间的ES5中使用上述代码.

猜你在找的JavaScript相关文章