क्रोम डेवलपर टूल्स कंसोल में console.dir का उपयोग करते समय फीका गुणों का महत्व क्या है

Question

क्रोम के कंसोल में console.dir() का उपयोग करते समय किसी ऑब्जेक्ट की संपत्ति को थोड़ा फीका होने पर इसका क्या अर्थ होता है।

उदाहरण के लिए, इस स्क्रीनशॉट में "शीर्ष, चौड़ाई, विश्व दृश्यमान, x & y" पर एक नज़र डालें।

मैं API संदर्भ यहाँ https://developer.chrome.com/devtools/docs/console-api#consoledirobject देखा है, लेकिन कोई किस्मत थी।

धन्यवाद

Answer 1

गैर-संख्यात्मक गुणों को इंगित करने के लिए फीका गुण apper। यदि हम ऐसा करते:

var a = {}; 
Object.defineProperties(a, { 
    hello: { enumerable: false }, 
    world: { enumerable: true } 
}); 
console.dir(a); 

फिर हम, देखते हैं कि hello फीका है, जबकि world नहीं है।

अपने कोड में, आप for(prop in obj) { console.log(prop); } करते हैं (जहां obj है जो कुछ भी वस्तु आप हमें अपनी सांत्वना स्क्रीनशॉट में दिखा रहे हैं), तो आप देखेंगे कि केवल फीका गुण उनका वर्णन नहीं कर रहे हैं।

आप इसे Object.getOwnPropertyDescriptor(obj, "worldVisible") के साथ भी देख सकते हैं, जो किसी ऑब्जेक्ट को enumerable: false संपत्ति के साथ वापस कर देना चाहिए।

ध्यान दें कि संपत्ति नामों पर इटालिक्स इंगित करता है कि संपत्ति मूल्य को गेटटर फ़ंक्शन द्वारा परिभाषित किया गया है। (यह फ़ंक्शन चलाने से पहले (...) मान प्रदर्शित करने का मान भी देता है।) यह संख्यात्मकता से एक बिल्कुल अलग मुद्दा है, जिसके कारण नामों को फीका किया जा सकता है। आपके पास इटैलिक गेटर-परिभाषित गुण हो सकते हैं जो गैर-संख्यात्मक गुणों को फीका नहीं करते हैं, और इसके विपरीत।

Answer 2

मैं दस्तावेज में कोई आधिकारिक स्पष्टीकरण खोजने के लिए नहीं कर पाए हैं, लेकिन मैं कुछ परीक्षण है कि गुण धूसर हो के आधार पर कर रहे हैं एक अच्छा अनुमान है उन है कि चूक रहे हैं/जावास्क्रिप्ट इंजन द्वारा निर्धारित और कोड द्वारा ही नहीं। किसी सरणी

var foo = [1,2,3,45,1337]; 
console.dir(foo); 

कंसोल में देता में

length: कुछ उदाहरण हैं

सूचना है कि सूचकांक धूसर हो जाते हैं नहीं लेकिन length और सब कुछ __proto__ है में।

कोड प्रोटोटाइप से https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype#Examples

var Person = function() { 
    this.canTalk = true; 
}; 

Person.prototype.greet = function() { 
    if (this.canTalk) { 
    console.log('Hi, I am ' + this.name); 
    } 
}; 

var Employee = function(name, title) { 
    Person.call(this); 
    this.name = name; 
    this.title = title; 
}; 

Employee.prototype = Object.create(Person.prototype); 
Employee.prototype.constructor = Employee; 

Employee.prototype.greet = function() { 
    if (this.canTalk) { 
    console.log('Hi, I am ' + this.name + ', the ' + this.title); 
    } 
}; 

var bob = new Employee('Bob', 'Builder'); 
bob.greet(); 
console.dir(bob); 

कंसोल में देता है:

यहां दिलचस्प बातें की एक बहुत कुछ कर रहे हैं। greet के सभी उदाहरण भूरे रंग के नहीं हैं। हालांकि हर जगह __proto__ ग्रे हो गया है (शायद क्योंकि यह इंजन द्वारा प्रोटोटाइप पर सेट किया गया है)। Person से ओवरराइड कन्स्ट्रक्टर भी ग्रे हो गया है, लेकिन Employee का स्पष्ट रूप से सेट कन्स्ट्रक्टर ग्रे नहीं हुआ है।

तो मुझे लगता है कि यहां एक मोटा पैटर्न है, जो कि क्रोम (ई/आईयूएम) गुणों को समझता है जो आपको लगता है कि आपको इसकी परवाह करने की संभावना कम होगी, या तो क्योंकि उन्हें विरासत में मिला या सेट किया गया था इंजन के निर्माण के रूप में इंजन, लेकिन ऐसा लगता है कि यह सही नहीं है। (लेकिन कौन है, है ना?) कोशिश करने के लिए एक और दिलचस्प बात एफ 12 और console.dir(window) टाइप करें। वेबसाइट की जावास्क्रिप्ट द्वारा वैश्विक विंडो नेमस्पेस में रखी गई चीजों को छोड़कर आप लगभग सब कुछ भूरे रंग के बाहर देखेंगे।