ES6

Question

में फ़ंक्शन पैरामीटर परिभाषाएं मुझे यकीन है कि यह अपेक्षाकृत सरल है और मुझे कुछ स्पष्ट याद आ रहा है। मैं ES6 पर Mozilla's tutorials के माध्यम से पढ़ रहा हूँ, और उनके chapter on destructuring निम्नलिखित पैटर्न शामिल हैं:

फंक्शन पैरामीटर परिभाषाओं

डेवलपर्स रूप में, हम अक्सर कई के साथ एक एक वस्तु को स्वीकार कर अधिक ergonomic एपीआई का पर्दाफाश कर सकते हैं के बजाय पैरामीटर के रूप में गुण हमारे एपीआई उपभोक्ताओं को कई व्यक्तिगत पैरामीटर के क्रम को याद रखने के लिए मजबूर करते हैं। हम इस एक पैरामीटर वस्तु दोहरा से बचने के लिए destructuring उपयोग कर सकते हैं जब भी हम अपने गुणों में से एक का संदर्भ लेना चाहते:

function removeBreakpoint({ url, line, column }) { 
    // ... 
} 

यह फ़ायरफ़ॉक्स DevTools JavaScript डीबगर से असली दुनिया कोड का एक सरलीकृत स्निपेट (जो भी लागू किया गया है है जावास्क्रिप्ट-यो डॉग में)। हमें इस पैटर्न को विशेष रूप से प्रसन्नता मिली है।

जो मुझे समझ में नहीं आता है यह यह है कि यह विनाश से कैसे संबंधित है। क्या यह विचार है कि आप किसी ऑब्जेक्ट को इस फ़ंक्शन में पास करने की क्षमता की अनुमति देते हैं जो मनमाने ढंग से क्रम में हो सकता है जब तक कि इसमें सभी आइटम शामिल हों, यानी { line: 10, column: 20, url: 'localhost' }?

यदि हां, तो क्या

function removeBreakpoint(params) { 
    // ... 
} 

जहां पैरामीटर वाला url, line, और column एक वस्तु है की तरह कुछ से अधिक लाभ है? क्या विचार यह है कि आप जावास्क्रिप्ट को किसी फ़ंक्शन के पैरामीटर को सत्यापित करने के लिए बाध्य करते हैं जब किसी विनाशकारी संदर्भ में स्पष्ट रूप से उन्हें परिभाषित करके उपयोग किया जाता है?

Answer 1

जो मुझे समझ में नहीं आता है यह यह है कि यह विनाश से कैसे संबंधित है।

removeBreakpoint के भीतर, आप url, line, और column सीधे उपयोग कर सकते हैं। विनाशकारी होता है जब removeBreakpoint को ऑब्जेक्ट ऑब्जेक्ट के साथ बुलाया जाता है; उस ऑब्जेक्ट की मिलान करने वाली गुण अलग-अलग तर्कों में नष्ट हो जाती हैं। 10, कॉलम:: 20, यूआरएल: 'स्थानीय होस्ट'

विचार यह है कि आप इस समारोह है कि मनमाने ढंग से क्रम में जब तक यह सभी आइटम, यानी {पंक्ति है हो सकता है में एक वस्तु पारित करने की क्षमता की अनुमति है }?

हां, लेकिन इसमें सभी आइटम शामिल नहीं हैं; यदि ऐसा नहीं होता है, तो तर्क किसी ऑब्जेक्ट प्रॉपर्टी से प्रारंभ होता है जो मौजूद नहीं है, तर्क undefined है (जब तक कोई डिफ़ॉल्ट मान निर्दिष्ट नहीं किया जाता है)।

सरल उदाहरण (Babel के आरईपीएल पर Live Copy with ES5 translation) destructuring प्रदर्शन:

"use strict"; 
function removeBreakpoint({ url, line, column }) { 
    console.log("removeBreakpoint:"); 
    console.log("url: " + url); 
    console.log("line: " + line); 
    console.log("column: " + column); 
} 
removeBreakpoint({ 
    url: "the url", 
    line: "the line", 
    column: "the column" 
}); 
removeBreakpoint({ 
    url: "the url", 
    line: "the line" 
}); 

आउटपुट:

 
removeBreakpoint: 
url: the url 
line: the line 
column: the column 
removeBreakpoint: 
url: the url 
line: the line 
column: undefined 

यदि हां, तो क्या

function removeBreakpoint(params) { 
    // ... 
} 

की तरह कुछ से अधिक लाभ है

जहां परम यूआरएल, रेखा, और कॉलम के साथ एक वस्तु है?

सिंटेक्टिक चीनी। विकल्प ऑब्जेक्ट्स को स्वीकार करने के लिए नया वाक्यविन्यास एक संक्षिप्त पैटर्न स्वचालित करने, अधिक संक्षिप्त और घोषणात्मक है। यह विशेष रूप से स्पष्ट है जब आप मूलभूत मूल्यों के साथ संयोजित (Live Copy) है:

"use strict"; 
function removeBreakpoint(
    {        // <= { starts destructuring arg 
     url = "url default",  // <= Default for `url` 
     line = "line default",  // <= ...for `line` 
     column = "column default" // <= ...for `column` 
    }        // <= } ends destructuring arg 
    = {}       // <= Default for the options object iself 
) {         // (see notes after the code block) 
    console.log("removeBreakpoint:"); 
    console.log(url); 
    console.log(line); 
    console.log(column); 
} 
removeBreakpoint({ 
    url: "the url", 
    line: "the line", 
    column: "the column" 
}); 
removeBreakpoint({ 
    url: "the url", 
    line: "the line" 
}); 
removeBreakpoint(); 

आउटपुट:

 
removeBreakpoint: 
the url 
the line 
the column 
removeBreakpoint: 
the url 
the line 
column default 
removeBreakpoint: 
url default 
line default 
column default 

ऊपर, यहां तक ​​कि विकल्पों में वस्तु ही वैकल्पिक है, यही वजह है कि पिछले कॉल काम करता है :

removeBreakpoint(); 

हम एक डिफ़ॉल्ट विकल्प के लिए खुद को आपत्ति है कि कॉल विफल रहे हैं क्योंकि हम संपत्ति को पढ़ने का प्रयास होगी नहीं दिया था तो का। कभी-कभी आप इसे चाहते हैं, और इसलिए आप समग्र विकल्प बंद कर देंगे। अन्य बार आप नहीं करते हैं।

---

साइड नोट: डिफ़ॉल्ट विकल्प के कुछ हिस्सों पर आपत्ति है और यह भी, अलग से, पूरे विकल्प होता है कि आप अलग चूक पर कि क्या एक विकल्प वस्तु दिया गया था आधार पर हो सकता है जहां एक दिलचस्प स्थिति पर आपत्ति की क्षमता है, लेकिन बनाम कोई विकल्प सब पर दी जा रही वस्तु एक विशिष्ट विकल्प नहीं था, सब एलान के तौर पर किया: Live Copy

"use strict"; 
function test(
    num, 
    { 
     foo = "foo default", 
     bar = "options given without bar" 
    } = {bar: "options not given at all"} 
) { 
    console.log(num + ": foo = " + foo + ", bar = " + bar); 
} 
test(1, {foo: "foo value", bar: "options given with bar"}); 
test(2, {bar: "options given with bar"}); 
test(3, {}); 
test(4); 

आउटपुट:

 
1: foo = foo value, bar = options given with bar 
2: foo = foo default, bar = options given with bar 
3: foo = foo default, bar = options given without bar 
4: foo = foo default, bar = options not given at all