面试题：JavaScript中调用表达式性能优化之常见优化点

Question

在JavaScript中，对于函数调用表达式，列举至少3种常见的性能优化方式，并简要说明原因。

Answer 1

• 减少函数调用次数：
  • 原因：每次函数调用都有一定开销，包括创建执行上下文、压栈出栈等操作。减少调用次数可降低这些额外开销，提升性能。例如在循环中，如果每次循环都调用相同的无副作用函数获取固定值，可将该函数调用移到循环外部，只调用一次。
• 使用函数防抖和节流：
  • 函数防抖：
    • 原因：当事件频繁触发时，防抖确保在一定时间内只执行一次函数。如窗口resize事件，若不处理，事件处理函数可能每秒被调用几十次，使用防抖可避免不必要的高频调用，提升性能。
  • 函数节流：
    • 原因：规定在一个单位时间内，只能触发一次函数。像滚动条滚动事件，节流可限制处理函数的执行频率，避免过度计算，优化性能。
• 避免在循环中定义函数：
  • 原因：每次循环都会创建新的函数实例，占用额外内存，增加垃圾回收的负担。应将函数定义移到循环外部，这样只创建一个函数实例，提高内存使用效率和性能。
• 优化函数内部逻辑：
  • 减少不必要的计算：
    • 原因：函数内避免重复计算已有的结果，提前计算并缓存结果可减少重复操作，提高执行效率。例如计算某个复杂公式结果，如果该结果在函数内多次使用，可先计算并保存。
  • 避免深度嵌套的条件判断：
    • 原因：深度嵌套的条件判断增加了代码复杂度和执行时间，尽量优化条件判断逻辑，可使用更简洁高效的方式，如对象映射等，提升执行速度。