Several optimization schemes for closure memory leaks!

This article uses examples to explain the solution to the problem of js function closure memory leak from the shallower to the deeper, and share it with everyone for your reference. The specific content is as follows

Original code:

<span style="font-size:14px;">function Cars(){
  this.name = "Benz";
  this.color = ["white","black"];
}
Cars.prototype.sayColor = function(){
  var outer = this;
  return function(){
    return outer.color
  };
};
 
var instance = new Cars();
console.log(instance.sayColor()())</span>

Optimized:

<span style="font-size:14px;">function Cars(){
  this.name = "Benz";
  this.color = ["white","black"];
}
Cars.prototype.sayColor = function(){
  var outerColor = this.color; //保存一个副本到变量中
  return function(){
    return outerColor; //应用这个副本
  };
  outColor = null; //释放内存
};
 
var instance = new Cars();
console.log(instance.sayColor()())</span>

Example:

<span style="font-size:14px;">function inheritPrototype(subType,superType){
  var prototype = Object(superType.prototype);
  prototype.constructor = subType;
  subType.prototype = prototype;
}
 
function Cars(){
  this.name = "Benz";
  this.color = ["white","black"];
}
Cars.prototype.sayColor = function(){
  var outer = this;
  return function(){
    return outer.color;
  };
};
 
function Car(){
  Cars.call(this);
  this.number = [321,32];
}
inheritPrototype(Car,Cars);
Car.prototype.sayNumber = function(){
  var outer = this;
  return function(){
    return function(){
      return outer.number[outer.number.length - 1];
    }
  };
};
 
var instance = new Car();
console.log(instance.sayNumber()()());</span>

First, this example uses the constructor mode and the prototype mode to create the Cars object, and uses the parasitic combined inheritance mode to create the Car object and obtain the inheritance of properties and methods from the Cars object;

Second, create an instance of the Car object named instance; the instance instance contains two methods: sayColor and sayNumber;

Finally, among the two methods, the former uses a closure, and the latter uses two closures, and modifies its this so that it can access this.color and this.number.

There is a memory leak problem here, and the optimized code is as follows:

<span style="font-size:14px;">function inheritPrototype(subType,superType){
  var prototype = Object(superType.prototype);
  prototype.constructor = subType;
  subType.prototype = prototype;
}
 
function Cars(){
  this.name = "Benz";
  this.color = ["white","black"];
}
Cars.prototype.sayColor = function(){
  var outerColor = this.color; //这里
  return function(){
    return outerColor; //这里
  };
  this = null; //这里
};
 
function Car(){
  Cars.call(this);
  this.number = [321,32];
}
inheritPrototype(Car,Cars);
Car.prototype.sayNumber = function(){
  var outerNumber = this.number; //这里
  return function(){
    return function(){
      return outerNumber[outerNumber.length - 1]; //这里
    }
  };
  this = null; //这里
};
 
var instance = new Car();
console.log(instance.sayNumber()()());</span>