JSFiddle - React, Tailwind, and code Playground

HTML

<div id="sweets-menu" class="menu">
    <span class="title">Сладости</span>
    <ul>
      <li>Торт</li>
      <li>Пончик</li>
      <li>Пирожное</li>
      <li>Шоколадка</li>
      <li>Мороженое</li>
    </ul>
  </div>

CSS

.menu ul {
  display: none;
  margin: 0;
}

.menu .title {
  font-weight: bold;
  cursor: pointer;
}

.menu .title:before {
  content: '▶';
  padding-right: 6px;
  color: green;
}

.menu.open ul {
  display: block;
}

.menu.open .title:before {
  content: '▼';
}

JavaScript

var div = document.body.children[0];

function Menu(nun) {
  
  var elem = nun.elem;

    elem.onclick = function() {
    elem.classList.toggle('open');
  };

}

// использование - короче я понял, что аргументом передается анонимный обьект  {elem: div} который "присваивается" в атрибут nun функции Menu. И там уже выплняется.
var  j = Menu({ elem: div});

// теперь такой вопрос - нахуя все это присваивается в j (так в примере у кантора)? Ведь по итогу в J пишется пустой обьект, так как ни одного this  в функции нету? Или это типа задел на будущее, когда в конструкторе будет this использоваться?