Different ways to add functions to Javascript object

后端 未结 2 1727
温柔的废话
温柔的废话 2021-02-02 01:12

In Javascript is there any difference between these two ways of adding a function to an object? Is one preferable for any reason?

function ObjA() {
    this.A         


        
相关标签:
2条回答
  • 2021-02-02 01:17

    Sure there is a difference. If you define this.AlertA, you are defining a method that is local for the instance of ObjA. If you add AlertA to the prototype of the ObjA constructor, it is defined for every instance of ObjA. The latter is, in this case, more efficient, because it's only assigned once, whilst a local method is assigned every time you create an instance of ObjA.

    So using this.AlertA in:

    var A = new ObjA, 
        B = new ObjA,
        C = new ObjA;
    

    for A, B and C the constructor has to add the method AlertA. AlertB on the other hand, is only added once. You can check that using:

    function ObjA() {
            alert('adding AlertA!');
            this.AlertA = function() { 
                alert("A"); 
            };
    
            if (!ObjA.prototype.AlertB) {
                alert('adding AlertB!');
                ObjA.prototype.AlertB = function() { 
                    alert("B"); 
                };
            }
    }
    
    var A = new ObjA,  //=>  alerts adding AlertA! and alerts adding AlertB!
        B = new ObjA,  //=>  alerts adding AlertA!
        C = new ObjA;  //=>  alerts adding AlertA!
    
    0 讨论(0)
  • 2021-02-02 01:43

    Using the object constructor will assign a copy of that function to every new instance of your object. Using prototyping will result in one function being shared across all instances.

    0 讨论(0)
提交回复
热议问题