Examine the supplied $($ch$08-$proj$03.$html$)$ file. It provides the markup for a

sample company contained within a card $($i$.$e$.,$ the rectangular box$).$ You are

going to eventually dynamically generate the card markup. If you follow the

same structure as the sample, the supplied CSS will style it similar to that

shown in Figure $8\mathrm{.}32.$

$2.$ You have been supplied with a JSON file named companies.json. Convert this

file into an array of company objects using JSON.parse.

$3.$ Create a constructor function $($see Section $8\mathrm{.}8\mathrm{.}6)$ named CompanyCard which

will be passed a company object from the JSON data. Within the constuctor

function, create properties named symbol, name, day$50,$ day$200,$ revenue,

marketCap$50,$ marketCap$200,$ equity, and tags, whose values are extracted

from the passed company object.

$4.$ Add a method to CompanyCard named currency$()$ using arrow syntax that is

passed a number named num and returns a currency formatted number using

the Intl.NumberFormat$()$ function $($lookup the details online$).$ Add another

method to CompanyCard named billions$()$ using arrow syntax that is passed

a number named num and returns a currency using compact notation, also

using the Intl.NumberFormat$()$ function. This will display the large number in

the data set as a short billions or millions value.

$5.$ Add a method to CompanyCard named outputCard$()$ that uses the methods

and properties created in the two previous steps to output the markup for a

single company card.

$6.$ Create a function named outputCompanyCards that loops through the

company data, instantiate a CompanyCard object using the new keyword, and

then call the outputCard$()$ method of the CompanyCard object.