使用以下两种方法定义的方法之间的区别

Question

Snippet1:

 var box = function() {};

 box.prototype.open = function {
 };

Snippet2:

  var box = function() {
      this.open = function() {
      };
  }

Any difference between those two, which one is better?

Answer 1

Shall we assume that box is a constructor, so you're doing new box() ?

If so...

• The first version will share the open function among all objects created from the box constructor.

• The second will generate a new function object for every object created from the box constructor.

As such, the first will be more memory efficient than the second.

---

First version:

    new box                 box prototype            object prototype
+--------------+          +--------------+          +--------------+
|              |          |              |          |              |
|              |--------->|  open func   |--------->|              |
|              |       /  |              |          |              |
+______________+      /   +______________+          +______________+
                     /
                    /
    new box        /
+--------------+  /
|              | /
|              |/
|              |
+______________+

Second version:

    new box                box prototype            object prototype
+--------------+          +--------------+          +--------------+
|              |          |              |          |              |
|  open func   |--------->|              |--------->|              |
|              |       /  |              |          |              |
+______________+      /   +______________+          +______________+
                     /
                    /
    new box        /
+--------------+  /
|              | /
|  open func   |/
|              |
+______________+

Answer 2

@am not i am is correct. First method is the efficient way to do it. Second method is useful if you need private variables.

var box = function() {
     var _message = "hello world";
     this.func2 = function(){
       console.log(_message);   // prints hello world
     }
};

box.prototype.func1 = function() {
     this.func2();              // prints hello world
     console.log(_message);     // throws ReferenceError: _message is not defined 
};