इंस्टेंस फ़ंक्शन वैरिएबल नहीं बदला गया है?

Question

मैंने फ़ंक्शन चलाने के बाद परिवर्तनीय पूर्ण नाम को कंसोल करने का प्रयास किया, लेकिन यह मान नहीं बदला है, बस कंसोल डिफ़ॉल्ट मान Not Set कंसोल क्यों था?

function Test() { 
    this.clientData = { 
     fullName : "Not Set", 
     setUserName: function (firstName, lastName) { 
      this.fullName = firstName + " " + lastName; 
     }, 
     getUserInput2: function (firstName, lastName, callback) { 
      callback(firstName, lastName); 
     } 
    }; 

    this.getUserInput1 = function (firstName, lastName, callback) { 
     callback(firstName, lastName); 
    }; 
} 

var test = new Test(); 

test.getUserInput1("A1", "B1", test.clientData.setUserName); 

console.log("test.clientData.fullName : " + test.clientData.fullName);//Not Set 
//expected => A1 B1 

test.clientData.getUserInput2("A2", "B2", test.clientData.setUserName); 
console.log("test.clientData.fullName : " + test.clientData.fullName);//Not Set 
//expected => A2 B2 

Answer 1

यह काम कर रहा है का उपयोग कर सेट कर सकते हैं। आप बाइंड() फ़ंक्शन का उपयोग किए बिना ऐसा कर सकते हैं। आपको केवल टेस्ट ऑब्जेक्ट को चर में स्टोर करने की आवश्यकता है।

function Test() { 
 
var t = this 
 
this.clientData = { 
 
      fullName : "Not Set", 
 
      setUserName: function (firstName, lastName) { 
 
      t.clientData.fullName = firstName + " " + lastName; 
 
      }, 
 
      getUserInput2: function (firstName, lastName, callback) { 
 
       callback(firstName, lastName); 
 
      } 
 
     }; 
 
this.getUserInput1 = function (firstName, lastName, callback) { 
 
    callback(firstName, lastName); 
 
     }; 
 
} 
 

 
var test = new Test(); 
 
test.getUserInput1("A1", "B1", test.clientData.setUserName); 
 
console.log("test.clientData.fullName : " + test.clientData.fullName);//Not Set 
 
//expected => A1 B1 
 
test.clientData.getUserInput2("A2", "B2", test.clientData.setUserName); 
 
console.log("test.clientData.fullName : " + test.clientData.fullName);//Not Set 
 

Answer 2

यह इसलिए क्योंकि जब कॉलबैक कहा जाता है, संदर्भ (this) कॉलबैक का मूल्य नहीं clientData वस्तु है।

आप कॉलबैक manualy Function.bind()

function Test() { 
 
    this.clientData = { 
 
    fullName: "Not Set", 
 
    setUserName: function(firstName, lastName) { 
 
     this.fullName = firstName + " " + lastName; 
 
    }, 
 
    getUserInput2: function(firstName, lastName, callback) { 
 
     callback(firstName, lastName); 
 
    } 
 
    }; 
 
    this.getUserInput1 = function(firstName, lastName, callback) { 
 
    callback(firstName, lastName); 
 
    }; 
 
} 
 

 
var test = new Test(); 
 
var userInput = new test.getUserInput1("A1", "B1", test.clientData.setUserName.bind(test.clientData)); 
 
snippet.log("test.clientData.fullName : " + test.clientData.fullName); //Not Set 
 
//expected => A1 B1 
 
test.clientData.getUserInput2("A2", "B2", test.clientData.setUserName.bind(test.clientData)); 
 
snippet.log("test.clientData.fullName : " + test.clientData.fullName); //Not Set 
 
//expected => A2 B2

<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 --> 
 
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

Answer 3

स्पष्ट रूप से समझ this कथन के बारे में है, तो आप को समझना चाहिए कि यह वर्तमान समारोह के अंदर "गुंजाइश" का प्रतिनिधित्व करने के लिए।

आप जब घोषित:

function Test() { 
    this.clientData = { 
    .... 
    }; 
} 

thisTest समारोह के वर्तमान क्षेत्र का प्रतिनिधित्व करता है। यही कारण है कि, जब आप var test = new Test(); करेंगे, तो आप test.clientData का उपयोग करने में सक्षम होंगे और फिर अपने ऑब्जेक्ट के प्रारंभ में सेट किए गए डेटा तक पहुंच प्राप्त कर सकेंगे।

अब, अपने test वस्तु की अपनी clientData संपत्ति के अंदर, आपके पास एक setUserName (मेरा सुझाव है कि आप इसे setFullName नाम हैं) जो फिर एक समारोह (JavaScript is function scoped)। तो अगर हम अपने कोड को देखो:

function Test() { 
    this.clientData = { 
     fullName: "Not Set", 
     setFullName: function(firstName, lastName) { 
      /* 
      * `this` represents the scope of the `setFullName` function, 
      * and not the scope of the `Test` function 
      */ 
      this.fullName = firstName + " " + lastName; 
     } 
    }; 
} 

तो चाल शीर्ष स्तर में एक चर में this स्टोर करने के लिए, क्योंकि जावास्क्रिप्ट समारोह scoped है, चर गुंजाइश के अंदर हर कार्य के लिए उपलब्ध हो जाएगा। तो अब हम यह कर सकते हैं:

function Test() { 
    var self = this; 
    self.clientData = { 
     fullName: "Not Set", 
     setFullName: function(firstName, lastName) { 
      self.clientData.fullName = firstName + " " + lastName; 
     } 
    }; 
} 

मैं आपको अपने डेटा और अपनी विधि को अलग तरीके से विभाजित करने की सलाह देता हूं। अब आप सब कुछ clientData ऑब्जेक्ट में डालते हैं जो आपके ऐप में कुछ जटिलता जोड़ता है। आप संग्रहीत मूल्यों (नाम, आयु, किसी भी भंडारण जानकारी) और डेटा के साथ बातचीत करने वाली विधियों को अलग कर सकते हैं।

मैं ऐसा ही कुछ सुझाव देते हैं:

function Person() { 
 
    var self = this; 
 
    self.fullName = "Not Set" 
 
    self.setFullName = function(firstName, lastName) { 
 
     self.fullName = firstName + " " + lastName; 
 
    }; 
 
} 
 
var john = new Person(); 
 
john.setFullName("John", "Doe"); 
 
console.log("john.fullName : " + john.fullName); // Display : John Doe 
 
var bruce = new Person() 
 
bruce.setFullName("Bruce", "Wayne"); 
 
console.log("bruce.fullName : " + bruce.fullName); // Display : Bruce Wayne

इस तरह से आप को पढ़ने के लिए एक बहुत आसान कोड और निष्पादित करने के लिए एक बहुत आसान कोड है। इसके बाद, आप जिस ऑब्जेक्ट को चाहते हैं, उसे अपने ऑब्जेक्ट तर्क को व्यवस्थित और डिज़ाइन करने के लिए आप पर निर्भर है।

उम्मीद है कि यह मदद करता है।