如何解决如何遍历模板文字数组并打印一定数量的“用户”
我用模板文字制作了一个“假数据库”,并将其制作成具有不同属性的员工列表,例如姓名、薪水、地址、电话号码以及最重要的当月收入。我想创建一种扫描仪,它可以遍历所有员工并打印出 3 名收入最高的员工,并在另一张卡片中打印出 3 名“表现最差”的员工。
我将如何继续完成上面提到的事情?我只打印了一个,我会添加上面的代码。希望你们能帮我解决这个问题。
如果有人想知道,我正在使用 BULMA、Sass 和 chart.js。
我尝试了什么
// Print best selling employee
const bestSellingEmployees = () => {
let biggestRevenue = 0;
let htmlTxt = "";
EmployeeModule.getAll().forEach(employee => {
if(employee.revenue >= biggestRevenue) {
htmlTxt = `
<img src="images/employee-images/${employee.img}" width="50%" class="is-horizontal-center" alt="Bilde ${employee.name}">
<h6 class="title is-6 has-text-centered mt-5">${employee.name}</h6>
<div class="columns ml-4">
<div class="column">
<p>Profit</p>
<p>400 000</p>
</div>
<div class="column">
<p>Income</p>
<p>${employee.revenue}</p>
</div>
</div>
`;
}
})
bestPerformingEmployee.innerHTML = htmlTxt;
}
employee.html
<!--Card start-->
<div id="bottom-3" class="card mt-5">
<!--Card content-->
<div class="card-content">
<!--Card title-->
<h5 class="title is-5">Populære kategorier</h5>
<div class="content">
Lorem ipsum leo risus,porta ac consectetur ac,vestibulum at eros. Donec id elit non mi porta gravida
at eget metus. Cum sociis natoque penatibus et magnis dis parturient montes,nascetur ridiculus mus.
Cras mattis consectetur purus sit amet fermentum.
</div>
</div>
</div>
<!--Card end-->
employeeModule.js
const EmployeeModule = ( function(){
//employeeArray start
const employeeArray = [
{
name: "Jan Nordmann",address: "Vollsveien 137b",phoneNumber: "46983312",revenue: 15392,salary: 188,position: "Deltid",img: "employee-avatar.png"
},{
name: "Cecillie Holme",address: "Sørumgata 3",phoneNumber: "92591093",revenue: 32574,salary: 192,position: "Fulltid",img: "employee-avatar.png"
},{
name: "Suresh Rajesh",address: "Holmlia Senter vei 3",phoneNumber: "93589012",revenue: 42021,salary: 200,{
name: "Elias Khalil",address: "Aslakveien 1",phoneNumber: "43492316",revenue: 9026,salary: 171,position: "Vikar",{
name: "Andrea Ris",address: "Holtegata 8",phoneNumber: "9201942",revenue: 13102,{
name: "Noah Amundsen",address: "Askeladveien 3",phoneNumber: "43363366",revenue: 21023,salary: 180,{
name: "Gregorz Braun",address: "Trosterudveien 38",revenue: 20301,{
name: "Märta Vittsjö",address: "Kirkerudveien 20",revenue: 14212,{
name: "Max Felix",address: "Storgaten 59",revenue: 39890,salary: 179,{
name: "Nicholas Kjellberg",address: "Bergensgate 95",phoneNumber: "43493131",revenue: 29401,{
name: "Ben McDonald",address: "Midtveien 169",phoneNumber: "49482911",revenue: 18594,salary: 184,{
name: "Jakob Sæther",address: "Dr. Dedichens vei 20",phoneNumber: "92583901",revenue: 39394,salary: 199,{
name: "Nora Gulbrandsen",address: "Toftes gate 12",phoneNumber: "40019313",revenue: 28491,{
name: "Hoyo Ahmed",address: "Stovner senter gata 30",phoneNumber: "93194212",revenue: 102941,{
name: "Bengt Husby",address: "Husbygata 12",phoneNumber: "49392911",salary: 189,{
name: "Harald Pedersen",address: "Frydenbergveien 43D",revenue: 22812,{
name: "Amir Khan ",address: "Glitre veien 31",{
name: "Laila Sharoon",address: "Sorgenfrigata 12",revenue: 51362,{
name: "Emilie Jakobssen",address: "Krafts gate 8",phoneNumber: "92481021",revenue: 28190,];
//employeeArray end
const getAll = () => employeeArray;
return {getAll};
})
export default EmployeeModule;
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。