Property Getter / Setter Techniques

JavaScript performance comparison

Test case created by Mike Chambers

Info

Testing various techniques for creating getters / setters in JavaScript.

Preparation code

<script>
  var obj = {
   _prop: 0
  }
  
  var obj1 = {
   _prop: 0,
   getProp: function() {
    return this._prop;
   },
   setProp: function(value) {
    this._prop = value;
   }
  };
  
  var obj2 = {
   _prop: 0,
   get prop() {
    return this._prop;
   },
   set prop(value) {
    this._prop = value;
   },
  };
  
  
  var obj3 = {
   _prop: 0
  }
  
  
  Object.defineProperty(obj3, "prop", {
   get: function() {
    return this._prop;
  
   },
   set: function(val) {
    this._prop = val;
   }
  });
  
  var obj4 = {
   _prop: 0
  }
  
  
  obj4.__defineGetter__("_prop", function() {
   return this._prop;
  });
  
  obj4.__defineSetter__("_prop", function(val) {
   this._prop = val;
  });
</script>

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
Methods
 
obj1.setProp(obj1.getProp() + 1);
 pending…
get / set
 
obj2.prop = obj2.prop + 1;
 pending…
Object.defineProperty
 
obj3.prop = obj3.prop + 1;
 pending…
__defineGetter__
 
obj4.prop = obj4.prop + 1;
 pending…
Property
 
obj.prop = obj.prop + 1;
 pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

0 comments

Add a comment