如何缓存JS对象内计算值传给同对象其他键函数避免重复计算

原始代码片段如下：

"sideCardInfo": {
    "title": "Hospital Admission",
    "reportTitle": "Hospital Admission Report",
    "subTitle": "Per 1000 Members",
    "dateFilter": [
        {
            "date": previousYearRange,
            "value": calculateAverage(allInsightData.map(obj => Number(obj.hospital_admissions_cnt_py))),
        },
        {
            "date": currentYearRange,
            "value": calculateAverage(allInsightData.map(obj => Number(obj.hospital_admissions_cnt))),
        }
    ],
    "percentage": calculatePercentage( calculateAverage(allInsightData.map(obj => Number(obj.hospital_admissions_cnt_py))), calculateAverage(allInsightData.map(obj => Number(obj.hospital_admissions_cnt)))),
    "tooltipText": ""
},

上述代码的sideCardInfo对象中，dateFilter数组项的value字段通过调用calculateAverage函数计算平均值，同对象下percentage字段调用calculatePercentage时，又重复执行了两次完全相同的平均值计算逻辑，需要存储dateFilter中calculateAverage的计算结果直接复用，避免重复计算。

核心思路是把需要重复使用的计算结果提前存为变量，所有用到该值的位置直接引用变量即可，不需要重复执行计算函数，有两种常见实现方式：

方式1：外部提前声明变量（最直观常用） #

在定义sideCardInfo对象前，先把两个平均值计算完成并存为常量，后续对象内直接引用常量：

// 提前计算两个复用的平均值，仅执行一次计算
const prevYearAdmissionAvg = calculateAverage(allInsightData.map(obj => Number(obj.hospital_admissions_cnt_py)));
const curYearAdmissionAvg = calculateAverage(allInsightData.map(obj => Number(obj.hospital_admissions_cnt)));

const sideCardInfo = {
    title: "Hospital Admission",
    reportTitle: "Hospital Admission Report",
    subTitle: "Per 1000 Members",
    dateFilter: [
        {
            date: previousYearRange,
            value: prevYearAdmissionAvg,
        },
        {
            date: currentYearRange,
            value: curYearAdmissionAvg,
        }
    ],
    percentage: calculatePercentage(prevYearAdmissionAvg, curYearAdmissionAvg),
    tooltipText: ""
};

方式2：立即执行函数封装（不污染外层作用域） #

如果不想在外层作用域额外声明变量，可以用立即执行函数包裹对象生成逻辑，计算用的临时变量只在函数内部生效：

const sideCardInfo = (() => {
    // 临时变量仅在函数内部存在，不会污染外层
    const prevYearAvg = calculateAverage(allInsightData.map(obj => Number(obj.hospital_admissions_cnt_py)));
    const curYearAvg = calculateAverage(allInsightData.map(obj => Number(obj.hospital_admissions_cnt)));
    
    return {
        title: "Hospital Admission",
        reportTitle: "Hospital Admission Report",
        subTitle: "Per 1000 Members",
        dateFilter: [
            { date: previousYearRange, value: prevYearAvg },
            { date: currentYearRange, value: curYearAvg }
        ],
        percentage: calculatePercentage(prevYearAvg, curYearAvg),
        tooltipText: ""
    }
})();

两种方式都能保证calculateAverage对同一份数据只执行一次计算，从根源上避免重复执行的性能损耗。

内容的提问来源于stack exchange，提问作者kichu