Интервьюер: Почему '[] instanceof Object' возвращает "true"?

Это то, что должны знать все разработчики.

Все мы знаем, что [] instanceof Array возвращает true, но почему [] instanceof Object тоже возвращает true?

Друзья, если бы вам задали этот вопрос на собеседовании, как бы вы на него ответили?

Что такое instanceof?

Давайте посмотрим на объяснение на MDN :

"Оператор instanceof проверяет, появляется ли свойство prototype конструктора где-либо в цепочке прототипов объекта. Возвращаемое значение - булево значение. Его поведение может быть настроено с помощью Symbol.hasInstance".

// from mdn
const Cat = function (name) {
  this.name = name
}
Cat.prototype.showName = function () {
  console.info(this.name)
}
const cat = new Cat('miao')

console.info(cat instanceof Cat) // true

Итак, почему cat instanceof Cat возвращает true? Все очень просто, и будет легче понять, если мы нарисуем картинку.

Поскольку Cat.prototype появляется в цепочке прототипов кошки, правильно будет вернуть true.

Давайте рассмотрим более сложный пример:

const Animal = function (name) {
  this.name = name
}

Animal.prototype.showName = function () {
  console.info(this.name)
}

const Cat = function (name) {
  Animal.call(this, name)
}

Cat.prototype = new Animal()
Cat.prototype.constructor = Cat

const cat = new Cat('miao')

console.info(cat instanceof Cat) // true
console.info(cat instanceof Animal) // true
console.info(cat instanceof Object) // true

Из этого рисунка мы можем четко объяснить, почему все три выражения возвращают true, потому что Cat.prototype, Animal.prototype, Object.prototype все появляются в прототипе кошки, поэтому результат будет true.

1. cat instanceof Cat
2. cat instanceof Animal
3. at instanceof Object

Почему "[] instanceof Object" возвращает true

Давайте вернемся к самому вопросу и вместе нарисуем простую картинку, чтобы увидеть ответ.

const arr = []

console.info(arr instanceof Array) // true
console.info(arr instanceof Object) // true

Как реализовать оператор instanceof?

После вышеприведенного объяснения, когда интервьюер спросит нас, как реализовать оператор instanceof, достаточно освоить эти пункты знаний.

1. Прототип функции-конструктора
2. Цепочка прототипов объекта

Решение 1

Решение 2

Решение 3

Наконец,

Спасибо за чтение. Я с нетерпением жду, что вы будете следить за мной и читать больше качественных статей.

• Интервьюер: Что случилось с "npm run xxx"?
• 20 методов массивов JavaScript, которые должен знать каждый разработчик
• 8 крутых трюков GitHub, которые заставят вас выглядеть как старший разработчик
• Интервьюер: Может ли "x !== x" возвращать True в JavaScript？
• Что выводит (123['toString'].length + 123) в JavaScript?

Подпишитесь на нашу бесплатную еженедельную рассылку . Следите за нами в Twitter , LinkedIn , YouTube , и Discord .

Заинтересованы в масштабировании своего программного стартапа? Посмотрите Circuit.