ब्लॉक के भीतर जावास्क्रिप्ट चर को परिभाषित करने में क्या गलत है?

Question

मेरे पास कुछ कोड है:

if (condition) { 
var variable = blah; 
} 

if (differentcondition) { 
var variable = blah; 
} 

क्या यह सही है?

मुझे लगता है कि अगर स्थिति सही नहीं होती है तो वैरिएबल असाइन नहीं किया जाएगा।

JSLint मुझे बता रहा है, चर पहले से परिभाषित है।

क्या मैं यह गलत कर रहा हूं?

धन्यवाद।

ठीक है, मेरा वास्तविक उपयोग यहां है, मैं इस तरह इवेंट प्रतिनिधिमंडल कर रहा हूं:

$("#container").click(function (event){ 

    if ($(event.target).is('img.class1')) { 
     var imagesrc = $(event.target).attr('src'); 
     // Do something with imagesrc 
    } 

    if ($(event.target).is('img.class2')) { 
     var imagesrc = $(event.target).attr('src'); 
     // Do something with imagesrc 
    } 

    // This condition is mutually exclusive to the above 2 
    if ($(event.target).is('img.class3')) { 
     var imagesrc = $(event.target).attr('src'); 
     // Do something with imagesrc 
    } 

    // This condition is mutually exclusive to 1 and 2 but not to 3 
    if ($(event.target).is('img.class4')) { 
     var imagesrc = $(event.target).attr('src'); 
     // Do something with imagesrc 
    } 

}); 

असल में ये 2 वर्ग पारस्परिक रूप से अनन्य नहीं हैं।

यह मेरे लिए काम करता है, लेकिन क्या यह सही है?

उत्तर बहुत जानकारीपूर्ण थे, लेकिन मुझे अभी भी समझ में नहीं आता कि मुझे चर को कैसे स्थापित करना चाहिए।

दरअसल मैं यह भी कहना चाहता हूं कि कुछ स्थितियां पारस्परिक रूप से अनन्य हैं, और कुछ स्थितियां नहीं हैं।

मुझे इसे कैसे ढूढ़ना चाहिए?

मुझे शायद शुरुआत से इस उदाहरण का उपयोग करना चाहिए था।

Answer 1

क्योंकि जावास्क्रिप्ट कुछ जो अपने कोड करना बातें यह है कि यह करना चाहिए नहीं लगती है बनाता है "उत्थापन" कहलाता है। असल में, इसका मतलब है कि एक जावास्क्रिप्ट दुभाषिया सभी विभिन्न घोषणाओं को स्थानांतरित करेगा, भले ही वे फ़ंक्शन बॉडी के शीर्ष पर फ़ंक्शन के शरीर में हों। फिर यह सभी कार्य परिभाषाओं को शीर्ष पर, सभी वर्रों के नीचे ले जायेगा। फिर यह समारोह संकलित खत्म हो जाएगा।

अगर किसी कथन के अंदर एक var डालना भाषा के "नियम" के खिलाफ नहीं है, लेकिन इसका मतलब है कि, var hoisting की वजह से, उस var को परिभाषित किया जाएगा कि क्या बयान की स्थिति संतुष्ट है या नहीं।

ध्यान रखें कि उत्थान में असाइनमेंट शामिल नहीं है, इसलिए जैसे कि अन्य ने इंगित किया है, विभिन्न घोषणाओं को शीर्ष पर ले जाया जाएगा, और बाद में उन्हें असाइन किए जाने तक अपरिभाषित छोड़ दिया जाएगा।

यह उस सुविधा का एक उदाहरण है जो उस समय एक अच्छा विचार प्रतीत होता था, लेकिन यह सहायक से अधिक भ्रमित हो गया है।

Answer 2

ऐसा इसलिए है क्योंकि जावास्क्रिप्ट में, चर के केवल फ़ंक्शन ब्लॉक के भीतर अलग-अलग दायरे होते हैं। अन्य भाषाओं के विपरीत, अगर ब्लॉक में जावास्क्रिप्ट में एक अलग दायरा नहीं है।

आपके मामले में, जेएसलिंट आपको बताएगा कि चर पहले ही परिभाषित है क्योंकि यह संभव है कि दोनों स्थितियां सत्य हों, इस स्थिति में आप अपने चर को ओवरराइट कर रहे होंगे।

function Something() { 
    var thing1 = "hello"; 

    (function() { 
     var thing2 = "world"; 
    })(); 

    // This line will throw a ReferenceError because "thing2" is not defined in this scope 
    // It only exists within the scope of the function executed above 
    alert(thing1 + thing2); 
} 

function SomethingElse() { 
    var thing1 = "hello"; 

    if(true) { 
     var thing2 = "world"; 
    } 

    // This line will work because thing2 is not limited to the if-block 
    alert(thing1 + thing2); 
} 

Answer 3

दो अगर-स्थिति परस्पर अनन्य हैं:

यहाँ कैसे स्कोप जावास्क्रिप्ट में काम का एक उदाहरण है?

if (condition) { 
    var variable = blah; 
} 
else if (differentcondition) { 
    var variable = blah; 
} 

इसका मतलब यह है कि अगर पहली शर्त सत्य है, तभी कोड के दूसरे भाग क्रियान्वित किया जा कभी नहीं होगा: शायद आप "और" नियंत्रण संरचना का उपयोग करना चाहते हैं।

सामान्य में, यह संरचना वे में इस्तेमाल किया जा रहा भीतर चर घोषित करने के लिए बेहतर है चर केवल अगर बयान के भीतर मौजूद हैं चाहिए, यह घोषित वहाँ ठीक है, अन्यथा, यह बाहर ले जाने के तो जैसे:।

var variable; 
if (condition) { 
    variable = blah; 
} 
else if (differentcondition) { 
    variable = blah; 
} 
// continue to use variable here... 

नोट: यदि आप अन्य के बिना अलग ifs का उपयोग कर रहे हैं, तो आपको चर को डिफ़ॉल्ट मान पर सेट करना होगा।

Answer 4

केवल कार्य आंतरिक दायरे बनाते हैं। यह इस उदाहरण में भी बालों वाली हो जाता है।

var x = 2; 
function foo() { 
    alert(x); // will alert undefined?!? 

    var x = 4; 
} 
foo(); 
alert(x); // will alert 2 

पहली चेतावनी वास्तव में अपरिभाषित कहती है। क्यूं कर?क्योंकि फ़ंक्शन में होने वाली सभी परिवर्तनीय प्रारंभिकताओं को फ़ंक्शन की शुरुआत में अपरिभाषित करने के लिए आरंभ किया जाता है। यही कारण है कि क्रॉकफोर्ड कहते हैं कि जितनी जल्दी हो सके सभी चर शुरू करना।

तो अपने कोड शायद इस तरह दिखना चाहिए:

$("#container").click(function (event){ 
     var imagesrc; 
     if ($(event.target).is('img.class1')) { 
       imagesrc = $(event.target).attr('src'); 
       // Do something with imagesrc 
     } 

     if ($(event.target).is('img.class2')) { 
       imagesrc = $(event.target).attr('src'); 
       // Do something with imagesrc 
     } 

     // This condition is mutually exclusive to the above 2 
     if ($(event.target).is('img.class3')) { 
       imagesrc = $(event.target).attr('src'); 
       // Do something with imagesrc 
     } 

     // This condition is mutually exclusive to 1 and 2 but not to 3 
     if ($(event.target).is('img.class4')) { 
       imagesrc = $(event.target).attr('src'); 
       // Do something with imagesrc 
     } 

}); 

Answer 5

मुझे इसे कैसे व्यवस्थित करना चाहिए?

इस मामले में, ऐसा लगता है कि यह घोंसला करने के लिए बेहतर स्थिति होगी:

$("#container").click(function (event) { 
    if ($(event.target).is('img')) { 
     var imagesrc = $(event.target).attr('src'); 

     if ($(event.target).is('.class1')) { 
      // Do something with imagesrc 
     } 

     if ($(event.target).is('.class2')) { 
      // Do something with imagesrc 
     } 

     // This condition is mutually exclusive to the above 2 
     if ($(event.target).is('.class3')) { 
      // Do something with imagesrc 
     } 

     // This condition is mutually exclusive to 1 and 2 but not to 3 
     if ($(event.target).is('.class4')) { 
      // Do something with imagesrc 
     } 
    } 
}); 

या बेहतर अभी तक jQuery के घटना प्रतिनिधिमंडल का उपयोग करें:

$("#container").on("click", "img", function (event) { 
    var imagesrc = $(this).attr('src'); 

    if ($(this).is('.class1')) { 
     // Do something with imagesrc 
    } 

    if ($(this).is('.class2')) { 
     // Do something with imagesrc 
    } 

    // This condition is mutually exclusive to the above 2 
    if ($(this).is('.class3')) { 
     // Do something with imagesrc 
    } 

    // This condition is mutually exclusive to 1 and 2 but not to 3 
    if ($(this).is('img.class4')) { 
     // Do something with imagesrc 
    } 
});