Type casting an object in Javascript to tell VSCode about it

Question

Is there a way to tell VSCode that an object is of a certain type so that code hinting and code intelligence work? I am using ES2015 I believe.

As an example, let's say I'm populating an array with specific objects:

var person = new Person();
var person2 = new Person();
var person3 = new Person();

var people = [person, person2, person3];

// later on - see second example

var person = people[0];

I don't think that VSCode knows what type of object this is.

I know I can use JSDoc hinting something like so:

/* {Person} */
var person = people[0];

But this looks out of place and unformatted when reading it back later.

Is there a way to tell VSCode the type of object any other way?

I have figured out one way but I don't like it:

var person = new Person();
person = people[0];

Update:
I'm actually defining the value on an HTML Option element and retrieving it later in the List change handler:

function createList() {
   // loop through items and add them as option
   {    
      var optionName = useListItem ? "li" : "option";
      var option = document.createElement(optionName);
      option.name = people[i].name;
      option.value = people[i]; // in the browser this is converted to a primitive but it remains an object in the environment i'm in
      myList.appendChild(option);
   }
}

function listChangeHandler() {
    var person = myList.value; // vscode does not know what this is
}

Answer 1

You clarified in a comment that you would like to associate non-string data with a series of <option> elements within a <select> element, and later retrieve that data based on the currently-selected option.

For associating arbitrary data with objects that are not owned (e.g. DOM elements), JavaScript offers the WeakMap. Read more at: What are the actual uses of ES6 WeakMap?

Here's an example of associating instances of a Person class to Option elements, and retrieving the associated Person depending on which one is selected. It demonstrates various JSDoc type-related syntax, including inline type casting:

JS code in TS Playground

class Person {
  /** @param {string} name */
  constructor (name) {
    this.name = name;
  }
}

/**
 * @param {Person} person
 * @returns {HTMLOptionElement}
 */
function createOption (person) {
  return new Option(person.name.slice(0, 1), person.name);
}

const select = /** @type {HTMLSelectElement} */(document.getElementById("person-select"));
const output = /** @type {HTMLSpanElement} */(document.getElementById("output"));

const personMap = /** @type {WeakMap<HTMLElement, Person>} */(new WeakMap());

const updateOutput = () => {
  const [option] = select.selectedOptions;
  output.textContent = personMap.get(option)?.name ?? "none";
};

const persons = [
  new Person("Austin"),
  new Person("Blake"),
  new Person("Charlie"),
];

for (const person of persons) {
  const option = createOption(person);
  personMap.set(option, person);
  select.appendChild(option);
}

select.addEventListener("change", updateOutput);
updateOutput();

body, select { font-family: sans-serif; font-size: 1rem; }

<div>Selected person: <span id="output"></span></div>
<select id="person-select"></select>