将今天日期与生日/假期数组进行比较的 JS 函数

Posted 2023-05-07

【中文标题】将今天日期与生日/假期数组进行比较的 JS 函数

【英文标题】：JS function that compare today date to array of birthdays/holidays

【发布时间】：2020-10-25 17:44:28

【问题描述】：

我正在尝试创建一个 JS 函数，将今天的日期与生日/假期数组进行比较并将其显示到我的静态网页中，下面是我的代码...有什么建议吗？

我正在尝试使用 innerhtml 将其发布到网页中，但它不起作用，非常感谢您的帮助。

//array of special days
const specialDays = [
  //tech birthdays
   name: "Sharon Wagner", birthMonth: 1, birthDate: 8 ,
   name: "Lisa Vonhauser", birthMonth: 1, birthDate: 12 ,
   name: "Coleen Druby", birthMonth: 1, birthDate: 27 ,
   name: "Kayla Wilburn", birthMonth: 2, birthDate: 1 ,
   name: "Anita Krivenko", birthMonth: 2, birthDate: 2 ,
   name: "Tracy Schaffer", birthMonth: 2, birthDate: 3 ,
   name: "Casey Wolf", birthMonth: 2, birthDate: 29 ,
   name: "Jane Moyer", birthMonth: 3, birthDate: 12 ,
   name: "Marissa Conti", birthMonth: 3, birthDate: 16 ,
   name: "Nathan Heltebridle", birthMonth: 3, birthDate: 17 ,
   name: "Cheyann Wasssel", birthMonth: 3, birthDate: 17 ,
   name: "Jason Hatter", birthMonth: 4, birthDate: 3 ,
   name: "Barbara Butler", birthMonth: 4, birthDate: 12 ,
   name: "Marge Lopretto", birthMonth: 4, birthDate: 14 ,
   name: "Mary Beth Hellberg", birthMonth: 4, birthDate: 15 ,
   name: "Anne Tonkin", birthMonth: 5, birthDate: 12 ,
   name: "Derek Knisely", birthMonth: 5, birthDate: 13 ,
   name: "Dana Fortney", birthMonth: 5, birthDate: 23 ,
   name: "Brad Mikitko", birthMonth: 5, birthDate: 28 ,
   name: "Chuck Saltern", birthMonth: 6, birthDate: 13 ,
   name: "Bradlee Harvey", birthMonth: 6, birthDate: 13 ,
   name: "Russell DiCristina", birthMonth: 7, birthDate: 5 ,
   name: "David Fortney", birthMonth: 7, birthDate: 6 ,
   name: "Heather Raudenbush", birthMonth: 7, birthDate: 8 ,
   name: "Anngel Rickrode", birthMonth: 7, birthDate: 21 ,
   name: "Amanda Renninger", birthMonth: 7, birthDate: 26 ,
   name: "Heather Pugh", birthMonth: 8, birthDate: 19 ,
   name: "Joan Hartman", birthMonth: 8, birthDate: 31 ,
   name: "Alexis Luna", birthMonth: 9, birthDate: 4 ,
   name: "Jeremy Luong", birthMonth: 9, birthDate: 7 ,
   name: "Lauryn Hench", birthMonth: 9, birthDate: 12 ,
   name: "Dan Flannery", birthMonth: 9, birthDate: 13 ,
   name: "Matt Getz", birthMonth: 9, birthDate: 13 ,
   name: "Lizz Robb", birthMonth: 9, birthDate: 20 ,
   name: "Debbie Lister", birthMonth: 10, birthDate: 2 ,
   name: "Elizabeth Kurtz", birthMonth: 10, birthDate: 2 ,
   name: "Andrew Ebersole", birthMonth: 10, birthDate: 12 ,
   name: "Tricia Burns", birthMonth: 11, birthDate: 6 ,
   name: "Robin Kline", birthMonth: 11, birthDate: 14 ,
   name: "Julie Tobias", birthMonth: 11, birthDate: 20 ,
   name: "Louis Kabamba", birthMonth: 12, birthDate: 7 ,
   name: "Krista Rector", birthMonth: 12, birthDate: 12 ,
   name: "Carly Klinedinst", birthMonth: 12, birthDate: 27 ,
  //holidays
   name: "Happy New Year! ????", holidayMonth: 1, holidayDate: 1 ,
   name: "Happy July 4th! ????", holidayMonth: 7, holidayDate: 4,
   name: "Merry Xmas! ????", holidayMonth: 12, holidayDate: 25 ,
];

//get today's date & month
const today = new Date();
const month = today.getMonth() + 1;
const date = today.getDate();

//function to compare today's date & month to array of birthdays

const birthDays = specialDays.find((it) => it.birthDate === date && it.birthMonth === month);
document.getElementById("birthday").innerHTML = birthDays;


const holidayDates = specialDays.find(it => it.holidayDate === date && it.holidayMonth === month);

【参考方案1】：

我建议您将生日数组与假期数组分开，因为它们是不同的对象。除此之外，如果您希望单个对象与当前日期匹配，请使用 find() 。对于多个对象（即多个具有相同生日的人），使用filter()

//array of special days
const specialBirthDays = [
   name: "Sharon Wagner", birthMonth: 1, birthDate: 8 ,
   name: "Lisa Vonhauser", birthMonth: 1, birthDate: 12 ,
   name: "Coleen Druby", birthMonth: 1, birthDate: 27 ,
   name: "Kayla Wilburn", birthMonth: 2, birthDate: 1 ,
   name: "Anita Krivenko", birthMonth: 2, birthDate: 2 ,
   name: "Tracy Schaffer", birthMonth: 2, birthDate: 3 ,
   name: "Casey Wolf", birthMonth: 2, birthDate: 29 ,
   name: "Jane Moyer", birthMonth: 3, birthDate: 12 ,
   name: "Marissa Conti", birthMonth: 3, birthDate: 16 ,
   name: "Nathan Heltebridle", birthMonth: 3, birthDate: 17 ,
   name: "Cheyann Wasssel", birthMonth: 3, birthDate: 17 ,
   name: "Jason Hatter", birthMonth: 4, birthDate: 3 ,
   name: "Barbara Butler", birthMonth: 4, birthDate: 12 ,
   name: "Marge Lopretto", birthMonth: 4, birthDate: 14 ,
   name: "Mary Beth Hellberg", birthMonth: 4, birthDate: 15 ,
   name: "Anne Tonkin", birthMonth: 5, birthDate: 12 ,
   name: "Derek Knisely", birthMonth: 5, birthDate: 13 ,
   name: "Dana Fortney", birthMonth: 5, birthDate: 23 ,
   name: "Brad Mikitko", birthMonth: 5, birthDate: 28 ,
   name: "Chuck Saltern", birthMonth: 6, birthDate: 13 ,
   name: "Bradlee Harvey", birthMonth: 6, birthDate: 13 ,
   name: "Russell DiCristina", birthMonth: 7, birthDate: 5 ,
   name: "David Fortney", birthMonth: 7, birthDate: 6 ,
   name: "Heather Raudenbush", birthMonth: 7, birthDate: 8 ,
   name: "Anngel Rickrode", birthMonth: 7, birthDate: 21 ,
   name: "Amanda Renninger", birthMonth: 7, birthDate: 26 ,
   name: "Heather Pugh", birthMonth: 8, birthDate: 19 ,
   name: "Joan Hartman", birthMonth: 8, birthDate: 31 ,
   name: "Alexis Luna", birthMonth: 9, birthDate: 4 ,
   name: "Jeremy Luong", birthMonth: 9, birthDate: 7 ,
   name: "Lauryn Hench", birthMonth: 9, birthDate: 12 ,
   name: "Dan Flannery", birthMonth: 9, birthDate: 13 ,
   name: "Matt Getz", birthMonth: 9, birthDate: 13 ,
   name: "Lizz Robb", birthMonth: 9, birthDate: 20 ,
   name: "Debbie Lister", birthMonth: 10, birthDate: 2 ,
   name: "Elizabeth Kurtz", birthMonth: 10, birthDate: 2 ,
   name: "Andrew Ebersole", birthMonth: 10, birthDate: 12 ,
   name: "Tricia Burns", birthMonth: 11, birthDate: 6 ,
   name: "Robin Kline", birthMonth: 11, birthDate: 14 ,
   name: "Julie Tobias", birthMonth: 11, birthDate: 20 ,
   name: "Louis Kabamba", birthMonth: 12, birthDate: 7 ,
   name: "Krista Rector", birthMonth: 12, birthDate: 12 ,
   name: "Carly Klinedinst", birthMonth: 12, birthDate: 27 
];

const specialHolidays = [
   name: "Happy New Year! ?", holidayMonth: 1, holidayDate: 1 ,
   name: "Happy July 4th! ?", holidayMonth: 7, holidayDate: 5,
   name: "Merry Xmas! ?", holidayMonth: 12, holidayDate: 25 
]

//get today's date & month
const today = new Date();
const month = today.getMonth() + 1;
const date = today.getDate();

//function to compare today's date & month to array of birthdays

const birthDays = specialBirthDays.filter((it) => it.birthDate === date && it.birthMonth === month);


const holidayDates = specialHolidays.find((holiday)=>holiday.holidayMonth == month && holiday.holidayDate == date)

console.log(birthDays, holidayDates)

【讨论】：

谢谢！代码有效，但仅在 Chrome 中有效，我该如何制作才能在 Internet Explorer 上工作？

Array.prototype.find() 在 IE 中不受支持。我建议做一个解决方法（或者使用filter()，或者使用for循环）。