javascript - 类与原型(prototype) Array.isArray

Question

我总是被告知“类只是原型(prototype)的语法糖。”

但在这个例子中，这表明这不是真的。

function SubArray() {}
SubArray.prototype = new Array( );
console.log(Array.isArray(new SubArray()))  // false

以及类的相同示例。

SubArray = class extends Array{}
console.log(Array.isArray(new SubArray()))  // true

有趣的是，instanceof 在 new SubArray instanceof Array 上都能正常工作。为什么 Array.isArray 不返回带有原型(prototype)的 true？

Answer 1

那是因为你没有写class实际上是语法糖的代码:

function SubArray () {
  if (!(new.target)) {
    throw new TypeError("Class constructor SubArray cannot be invoked without 'new'")
  }

  return Reflect.construct(Array, arguments, new.target)
}

Object.setPrototypeOf(SubArray.prototype, Array.prototype)
Object.setPrototypeOf(SubArray, Array)

console.log(Array.isArray(new SubArray())) // true

上面的行为应该与您使用 class 语法提供的示例相同。不幸的是，如果没有其他 ES6 构造(例如 new.target 和 Reflect.construct())，并非所有这些行为都可以准确地重现，但至少这些行为不一定需要顺序产生你想要的行为:

function SubArray () {
  if (!(this instanceof SubArray)) {
    throw new TypeError("Class constructor SubArray cannot be invoked without 'new'")
  }

  return Array.apply(this, arguments)
}

SubArray.prototype = Object.create(Array.prototype)
// the line below is not necessary for Array.isArray()
// but accurately reproduces behavior of `class SubArray extends Array {}`
SubArray.__proto__ = Array // implementation hack if Object.setPrototypeOf() is not available

console.log(Array.isArray(new SubArray())) // true

这里的关键是将实例化对象的构造委托(delegate)给 Array 构造函数，以便将对象初始化为 Array 奇异对象。因此，假设严格需要的是以下内容:

function SubArray () {
  return Array.call(this)
}

console.log(Array.isArray(new SubArray())) // true

当然，在这种情况下您将无法访问 Array.prototype 方法，因此您应该坚持使用 class 语法或第二个示例(如果有)支持 ES5。

编辑

我做了一些修改，我个人认为这是一个可怕的想法，但如果你想在 ES5 中尽可能地模拟 class，你可以选择退出 strict mode 以便访问 arguments.caller:

// DON'T ACTUALLY DO THIS
// just for demonstration purposes

function SubArray () {
  // this is about as close as you can get to new.target in ES5
  if (!(this instanceof SubArray) && !(arguments.caller && this instanceof arguments.caller)) {
    throw new TypeError("Class constructor SubArray cannot be invoked without 'new'")
  }

  return Array.apply(this, arguments)
}

SubArray.prototype.__proto__ = Array.prototype
SubArray.__proto__ = Array

// we want FooBar to extend SubArray sloppily
function FooBar () {
  if (!(this instanceof SubArray) && !(arguments.caller && this instanceof arguments.caller)) {
    throw new TypeError("Class constructor FooBar cannot be invoked without 'new'")
  }

  return SubArray.apply(this, arguments)
}

FooBar.prototype.__proto__ = SubArray.prototype
FooBar.__proto__ = SubArray

try {
  SubArray()
} catch (e) {
  console.log(e.toString())
}

console.log(new SubArray(1, 2, 3))

try {
  FooBar()
} catch (e) {
  console.log(e.toString())
}

console.log(new FooBar(1, 2, 3))