JSFiddle - React, Tailwind, and code Playground

HTML

<div id="result1">
</div>
<div id="result2">
</div>

JavaScript

class Hello {
	constructor() {
  	this.ary = ['a', 'b', 'c'];
  }
  
	* [Symbol.iterator](){
		for (let v of this.ary) {
    	yield v + v;
    }
  }
  map(f) {
  	return this.ary.map(f);
  }
};

const hello = new Hello();
const ary = [];
for (let v of hello) {
  ary.push(v);
}

document.getElementById('result1').innerHTML = ary.join('<br />');

document.getElementById('result2').innerHTML = hello.map((v) => v + v + v).join('<br />');