जावास्क्रिप्ट: Class.method बनाम class.prototype.method

Question

निम्नलिखित दो घोषणाओं के बीच क्या अंतर है?

Class.method = function() { /* code */ } 
Class.prototype.method = function() { /* code using this.values */ } 

तो वह एक स्थिर विधि की घोषणा, और एक उदाहरण विधि की घोषणा के रूप में दूसरा बयान के रूप में पहले बयान के बारे में सोचना ठीक है?

Answer 1

हां, पहले फ़ंक्शन का constructor function के ऑब्जेक्ट इंस्टेंस के साथ कोई संबंध नहीं है, तो आप इसे 'स्थिर विधि' पर विचार कर सकते हैं।

जावास्क्रिप्ट कार्यों में first-class वस्तुओं रहे हैं, इसका मतलब है कि आप बस किसी भी वस्तु की तरह उन्हें इलाज कर सकते हैं इस मामले में, आप केवल समारोह वस्तु किसी प्रॉपर्टी को जोड़ रहे हैं।

दूसरा समारोह, जैसा कि आप निर्माता समारोह प्रोटोटाइप बढ़ा रहे हैं, यह सब वस्तु new कीवर्ड के साथ बनाया उदाहरणों लिए उपलब्ध हो जाएगा, और कहा कि समारोह (this कीवर्ड) के भीतर संदर्भ वास्तविक वस्तु उदाहरण के पास भेजेगा जहां आप इसे कहते हैं।

इस उदाहरण पर विचार:

// constructor function 
function MyClass() { 
    var privateVariable; // private member only available within the constructor fn 

    this.privilegedMethod = function() { // it can access private members 
    //.. 
    }; 
} 

// A 'static method', it's just like a normal function 
// it has no relation with any 'MyClass' object instance 
MyClass.staticMethod = function() {}; 

MyClass.prototype.publicMethod = function() { 
    // the 'this' keyword refers to the object instance 
    // you can access only 'privileged' and 'public' members 
}; 

var myObj = new MyClass(); // new object instance 

myObj.publicMethod(); 
MyClass.staticMethod(); 

Answer 2

जब आप MyClass के एक से अधिक उदाहरण बनाते हैं, आप अभी भी केवल स्मृति में publicMethod उसमें केवल एक ही होगा लेकिन privilegedMethod के मामले में आप उदाहरणों की बहुत सारी बनाने खत्म हो जाएगा और staticMethod के ऑब्जेक्ट उदाहरण के साथ कोई संबंध नहीं है।

यही कारण है कि प्रोटोटाइप स्मृति को बचाता है।

इसके अलावा, यदि आप मूल वस्तु के गुणों को बदलते हैं, तो क्या बच्चे की इसी संपत्ति को बदला नहीं गया है, यह अपडेट हो जाएगा।

Answer 3

विज़ुअल शिक्षार्थियों के लिए, जब बिना .prototype

ExampleClass = function(){}; 
ExampleClass.method = function(customString){ 
      console.log((customString !== undefined)? 
          customString : 
          "called from func def.");} 
ExampleClass.method(); // >> output: `called from func def.` 

var someInstance = new ExampleClass(); 
someInstance.method('Called from instance'); 
    // >> error! `someInstance.method is not a function` 

---

एक ही कोड के साथ

समारोह को परिभाषित करने, अगर .prototype जोड़ा जाता है,

ExampleClass.prototype.method = function(customString){ 
      console.log((customString !== undefined)? 
          customString : 
          "called from func def.");} 
ExampleClass.method(); 
     // > error! `ExampleClass.method is not a function.` 

var someInstance = new ExampleClass(); 
someInstance.method('Called from instance'); 
       // > output: `Called from instance` 

---

बनाने के मैं स्पष्ट टी,

ExampleClass = function(){}; 
ExampleClass.directM = function(){} //M for method 
ExampleClass.prototype.protoM = function(){} 

var instanceOfExample = new ExampleClass(); 

ExampleClass.directM();  ✓ works 
instanceOfExample.directM(); x Error! 

ExampleClass.protoM();  x Error! 
instanceOfExample.protoM(); ✓ works 

**** उदाहरण के लिए नोट से ऊपर, someInstance.method(),
ExampleClass.method के रूप में निष्पादित नहीं किया जाएगा() का कारण बनता है त्रुटि & निष्पादन जारी नहीं रख सकते।
लेकिन चित्रण & आसान समझ के लिए, मैं इस क्रम रखा है। **** कोड से निकलने के लिए से ऊपर jsbin लिंक पर chrome developer console & JS Bin
क्लिक करें उत्पन्न

परिणाम।
टॉगल ctrl + /