1

I'm taking an online web development course. I've come across some code that is confusing me. Within the index.js file there is a variable titled defaultCardList which instantiates a new instance of Section class. However, before the declaration is finished, within the renderer property, the defaultCardList variable is used to call the setItem method.

How is it possible to call the method from the defaultCardList variable before it's completely declared?

const defaultCardList = new Section({
  data: items,
  renderer: (item) => {
    const card = new DefaultCard(item, ".default-card");
    const cardElement = card.generateCard();
    defaultCardList.setItem(cardElement); //How can this be called before its completion?
  }
}, cardListSelector);
Eddie Melendez
  • 15
  • 5
  • 1
    It's inside the `renderer` function. Which is not called until after the `defaultCardList` is initialised (or else the code would indeed break). – Bergi Sep 05 '20 at 19:00
  • 1
    It's *not* called before it's completely declared. The body of that method won't be executed until you have the instance, at which point it has been completely decorated. – jonrsharpe Sep 05 '20 at 19:01
  • I believe I understand it a bit more. I guess the use/syntax of the defaultCardList confuses me, especially when thinking about what happens to it when it enters the Section class. Thanks for clarifying. :v) – Eddie Melendez Sep 05 '20 at 19:09
  • `defaultCardList` never enters the `Section` constructor. The value that is passed is (an object with) a function, and that function [closes over the `defaultCardList` variable](https://stackoverflow.com/q/111102/1048572) (not the value). Maybe also see [this](https://stackoverflow.com/q/52879220/1048572) – Bergi Sep 05 '20 at 19:20

0 Answers0