Блог

Я создал фрагмент кода javascript, и вот ссылка на визуализатор

 function Foo(name) {
  this.name = name
  this.speak = function() {
    console.log(this.name)
  }
}

function init() {
  function init_() {
    var foo = new Foo('foo')
    foo.hear = function() {
      console.log('i can hear')
    }
    var bar = new Foo('bar')
    bar.look = function() {
      console.log('i can look')
    }
    foo.speak()
    bar.speak()
  }
  
  init_()
}

init()
  

У меня есть несколько вопросов:

1. На каком этапе создается объект прототипа, он же Foo.prototype ? Когда интерпретатор загружается Foo в глобальную область видимости или когда new Foo() вызывается в первый раз, или на любом другом этапе? В какой лексической области хранится его ссылка? (поскольку в визуализаторе нет такой ссылки)

2. Должен foo ли и bar совместно использовать метод speak() , который принадлежит Foo.prototype , а не владеет их собственными копиями, как показано в визуализаторе?

3. Не связаны ли цепочка прототипов и цепочка областей? Например, когда foo.speak() вызывается, сначала мы отслеживаем цепочку областей, чтобы получить значение foo , затем цепочку прототипов, чтобы получить speak() ?

На каком этапе создается объект прототипа, он же Foo.prototype ? Когда интерпретатор загружается Foo в глобальную область?

Да, объект прототипа создается при создании Foo функции.

В какой лексической области хранится его ссылка? (поскольку в визуализаторе нет такой ссылки)

Вообще нет. Он хранится только в свойстве Foo .

Должен foo ли и bar совместно использовать метод speak() , который принадлежит Foo.prototype , а не владеет их собственными копиями, как показано в визуализаторе?

ДА. Похоже, что этот визуализатор был создан для Python и вообще не поддерживает ссылки на прототипы.

Не связаны ли цепочка прототипов и цепочка областей? Например, когда foo.speak() вызывается, сначала мы отслеживаем цепочку областей, чтобы получить значение foo , затем цепочку прототипов, чтобы получить speak() ?

Да, да.

Однако обратите внимание, что найденный вами визуализатор не отображает цепочку областей, он отображает только стек вызовов и очень плохо визуализирует лексическую область и замыкания правильно.