面试题：JavaScript 函数属性优化之内存管理与函数属性

函数属性对内存占用的影响

闭包导致的内存占用：
- 当函数内部定义另一个函数，并在外部返回内部函数时，就形成了闭包。内部函数会持有对外部函数作用域的引用。例如：
```
function outer() {
  let largeObject = { /* 一个占用大量内存的对象 */ };
  return function inner() {
    return largeObject;
  };
}
let innerFunc = outer();
```
- 在这个例子中，inner函数形成了闭包，只要innerFunc存在，largeObject就不会被垃圾回收，因为inner函数对其有引用，从而导致内存占用持续存在。
全局函数属性：
- 如果将函数定义为全局对象（如window对象在浏览器环境中）的属性，函数会一直存在于内存中，直到页面卸载。例如：
```
window.myGlobalFunction = function() {
  // 函数逻辑
};
```
- 只要页面不卸载，myGlobalFunction就占用内存，并且可能导致相关数据也无法被垃圾回收，因为函数可能持有对其他对象的引用。
函数自身属性的内存占用：
- 函数本身也可以有属性，例如：
```
function myFunc() {
  // 函数逻辑
}
myFunc.customProp = { /* 一个占用内存的对象 */ };
```
- 这里myFunc的customProp属性所指向的对象会占用内存，并且只要myFunc函数存在，这个对象就不会被释放，除非手动将myFunc.customProp设置为null。

优化过程中合理管理内存以避免内存泄漏

避免不必要的闭包：
- 如果闭包不是必需的，尽量避免创建。例如，在上述outer和inner函数的例子中，如果不需要在外部保持对largeObject的引用，可以直接在outer函数内处理完相关逻辑并返回结果，而不是返回一个闭包。
解除全局引用：
- 对于定义为全局属性的函数，在不需要使用时，将其从全局对象中移除。例如：
```
window.myGlobalFunction = function() {
  // 函数逻辑
};
// 后续不需要该函数时
delete window.myGlobalFunction;
```

释放函数自身属性的引用：

当函数自身属性所指向的对象不再需要时，手动将属性设置为null，以便垃圾回收机制回收内存。例如：

function myFunc() {
  // 函数逻辑
}
myFunc.customProp = { /* 一个占用内存的对象 */ };
// 当不再需要customProp指向的对象时
myFunc.customProp = null;

复杂的函数属性优化案例

案例场景：

假设我们正在开发一个单页应用（SPA），其中有一个模块负责管理用户的消息通知。有一个NotificationManager函数，它有一个属性notifications，用于存储所有的通知对象。并且该函数内部有一个闭包函数用于更新通知状态。

function NotificationManager() {
  this.notifications = [];
  let self = this;
  return function updateNotificationStatus(notificationId, status) {
    for (let i = 0; i < self.notifications.length; i++) {
      if (self.notifications[i].id === notificationId) {
        self.notifications[i].status = status;
        break;
      }
    }
  };
}
let updateNotification = NotificationManager();
// 模拟添加通知
for (let i = 0; i < 1000; i++) {
  updateNotification.notifications.push({ id: i, message: 'Notification'+ i, status: 'unread' });
}

内存分析：
- 闭包导致的内存占用：updateNotification函数形成了闭包，持有对NotificationManager函数作用域的引用，这使得NotificationManager函数中的notifications属性一直存在于内存中，即使NotificationManager函数执行完毕。
- 大量通知对象的内存占用：在模拟添加通知的过程中，notifications数组中存储了1000个通知对象，这些对象占用了大量内存。如果不及时处理，随着用户操作不断添加更多通知，内存占用会持续增长。

优化步骤：

减少闭包引用：可以将闭包函数中的逻辑提取到NotificationManager函数外部，这样可以减少闭包对NotificationManager函数作用域的引用。

function NotificationManager() {
  this.notifications = [];
}
NotificationManager.prototype.updateNotificationStatus = function(notificationId, status) {
  for (let i = 0; i < this.notifications.length; i++) {
    if (this.notifications[i].id === notificationId) {
      this.notifications[i].status = status;
      break;
    }
  }
};
let manager = new NotificationManager();
// 模拟添加通知
for (let i = 0; i < 1000; i++) {
  manager.notifications.push({ id: i, message: 'Notification'+ i, status: 'unread' });
}

内存管理：在适当的时候，如用户关闭通知模块，需要手动清除notifications数组中的对象引用。

// 用户关闭通知模块时
manager.notifications = [];

使用WeakMap（可选优化）：如果notifications数组中的对象在其他地方没有强引用需求，可以考虑使用WeakMap来存储通知对象。WeakMap的键是弱引用，当键所指向的对象没有其他强引用时，会被垃圾回收机制回收，从而进一步优化内存占用。

function NotificationManager() {
  this.notificationMap = new WeakMap();
}
NotificationManager.prototype.addNotification = function(notification) {
  this.notificationMap.set(notification, { status: 'unread' });
};
NotificationManager.prototype.updateNotificationStatus = function(notification, status) {
  if (this.notificationMap.has(notification)) {
    this.notificationMap.get(notification).status = status;
  }
};
let manager = new NotificationManager();
// 模拟添加通知
for (let i = 0; i < 1000; i++) {
  let notification = { id: i, message: 'Notification'+ i };
  manager.addNotification(notification);
}

在这种情况下，当notification对象在其他地方没有强引用时，会被垃圾回收，WeakMap中的相关记录也会自动被清理，有助于避免内存泄漏。

星途面试题库

面试题：JavaScript 函数属性优化之内存管理与函数属性

知识考点

面试题答案

函数属性对内存占用的影响

优化过程中合理管理内存以避免内存泄漏

复杂的函数属性优化案例