जावास्क्रिप्ट वस्तुओं का निरीक्षण कैसे करें

Question

मैं किसी अलर्ट बॉक्स में किसी वस्तु का निरीक्षण कैसे कर सकता हूं? आम तौर पर एक वस्तु को सचेत करने से सिर्फ नामकरण होता है:

alert(document);

लेकिन मैं अलर्ट बॉक्स में ऑब्जेक्ट के गुण और तरीके प्राप्त करना चाहता हूं। यदि संभव हो तो मैं यह कार्यक्षमता कैसे प्राप्त कर सकता हूं? या कोई और सुझाव हैं?

विशेष रूप से, मैं एक उत्पादन वातावरण के लिए एक समाधान की मांग कर रहा हूं जहां कंसोल.लॉग और फायरबग उपलब्ध नहीं हैं।

Comments

कर console.logफ़ायरफ़ॉक्स या क्रोम पर

— KJYe.Name葉家仁

मैं उलझन में हूं। उत्पादन के माहौल में, आपको वास्तविक उपयोगकर्ता मिले हैं, है ना? तो आप ऑब्जेक्ट प्रॉपर्टी के साथ अलर्ट क्यों फेंकना चाहेंगे? हो सकता है कि एक बेहतर उपाय यह है कि आप ऑब्जेक्ट को क्रमबद्ध करें और इसे एक फ़ाइल में लॉग इन करें या ईमेल भेजें?

— नाथन लॉन्ग

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

— क्रिश्चियन

Node.js पर संबंधित: stackoverflow.com/questions/24902061/…

— Ciro Santilli 病 j j j 事件

कभी-कभी JSON.stringifyमददगार होता है।

— BrainSlugs83 20

Answer 1

for- inएक वस्तु या सरणी में प्रत्येक प्रॉपर्टी के लिए लूप। आप इस संपत्ति का उपयोग मूल्य को प्राप्त करने के साथ-साथ इसे बदलने के लिए भी कर सकते हैं।

नोट: निजी संपत्तियाँ निरीक्षण के लिए उपलब्ध नहीं हैं, जब तक कि आप "जासूस" का उपयोग नहीं करते हैं; मूल रूप से, आप ऑब्जेक्ट को ओवरराइड करते हैं और कुछ कोड लिखते हैं जो ऑब्जेक्ट के संदर्भ में फॉर-इन लूप करता है।

इस तरह दिखता है:

for (var property in object) loop();

कुछ नमूना कोड:

function xinspect(o,i){
    if(typeof i=='undefined')i='';
    if(i.length>50)return '[MAX ITERATIONS]';
    var r=[];
    for(var p in o){
        var t=typeof o[p];
        r.push(i+'"'+p+'" ('+t+') => '+(t=='object' ? 'object:'+xinspect(o[p],i+'  ') : o[p]+''));
    }
    return r.join(i+'\n');
}

// example of use:
alert(xinspect(document));

संपादित करें: कुछ समय पहले, मैंने अपना स्वयं का निरीक्षक लिखा था, यदि आप रुचि रखते हैं, तो मुझे साझा करने में खुशी होगी।

संपादन 2: ठीक है, मैंने वैसे भी एक को लिखा है।

Comments

किसी भी तरह से पुनरावृत्ति से बचाया जाना चाहिए। कुछ आंतरिक HTML-रेंडरर आईडी के साथ हैशिंग ( शब्दकोष )? इस चेक को कोड में धकेलने के लिए noobs के लिए उपयोगी हो सकता है।

— नकीलोन

@ नाकिलोन मैंने हमेशा अनंत पुनरावृत्ति के साथ मुद्दा उठाया है, खासकर PHP में। इसे ठीक करने के दो तरीके हैं: एक गहराई पैरामीटर का उपयोग करना, या हैश को संशोधित करना और अपनी खुद की संपत्ति जोड़ना जो आप का उपयोग कर रहे हैं। गहराई एक सुरक्षित है।

— क्रिश्चियन

मुझे लाइन 7 का यह संस्करण बेहतर लगता है। यह माणिक की तरह थोड़ा अधिक दिखता है और कुछ अच्छे व्हॉट्सएप r.push (i + '' '+ p +' '' => '+ (t ==' ऑब्जेक्ट '?) {\ N' + xinspect (o / p), i + करता है? '') + ('\ n' + i + '},'): ओ [पी] + ''));

— ई.पू.

कोड का वह टुकड़ा पूरी तरह से iPhone पर सफारी मोबाइल बर्बाद कर दिया। मैं सुरक्षित विकल्प के लिए नीचे JSON.stringify समाधान के लिए जाऊँगा।

— डैनियल

इस बात से सफारी दुर्घटनाग्रस्त हो गई, क्रोम एक वस्तु का निरीक्षण कर रहा है, यह अनुशंसा नहीं करेगा।

— केनो

Answer 2

कैसे alert(JSON.stringify(object))एक आधुनिक ब्राउज़र के साथ?

के मामले में TypeError: Converting circular structure to JSON, यहां और अधिक विकल्प हैं: डोम नोड को जौन पर कैसे प्रसारित करें, भले ही परिपत्र संदर्भ हों?

दस्तावेज़ीकरण: JSON.stringify()आउटपुट स्वरूपण या पूर्व-निर्धारण पर जानकारी प्रदान करता है।

Comments

+1 अच्छा सुझाव। मुझे लगता है कि वह अच्छी तरह से देखने के लिए jsonview ( jsonviewer.stack.hu ) का उपयोग कर सकता है ।

— क्रिश्चियन

यदि आप इसे अच्छी तरह से स्वरूपित करना चाहते हैं तो आप कॉल कर सकते हैं: alert(JSON.stringify(object, null, 4)जहां 4इंडेंटेशन के लिए उपयोग किए जाने वाले रिक्त स्थान की संख्या है।

— जन मोलक

यह मुझे आउटपुट के रूप में 'अपरिभाषित' देता है। मैं कर्म परीक्षणों को ख़त्म करने की कोशिश कर रहा हूँ।

— एलेक्स सी

इस दृष्टिकोण के लिए चेतावनी हैं। ओपी का कहना है कि वह ऑब्जेक्ट के तरीकों का निरीक्षण करना चाहता है। stringify तरीकों दिखाई नहीं देंगे: JSON.stringify({f: ()=>{}}) => "{}"। इसके अलावा, यदि toJSONआप ऑब्जेक्ट को लागू करते हैं, तो आपको वह विधि वापस मिल जाती है, जो बेकार है यदि आप ऑब्जेक्ट का निरीक्षण करना चाहते हैं JSON.stringify({toJSON: () => 'nothin'}) => '"nothin"':।

— मोरोज़ोव

Answer 3

console.dir(object)Firebug प्लगइन का उपयोग करें

Comments

इसने मुझे जो कुछ भी था उसके लिए सबसे पूर्ण और उपयोगी जानकारी दी। धन्यवाद।

— शॉन

मुझे इस console.dirसुविधा के बारे में पता नहीं था । मैं काम नहीं कर सकता था इसलिए मैं अब फायरबग में पूरी वस्तु नहीं देख सकता था। इसने अब इसे मेरे लिए हल कर दिया है। धन्यवाद!

— एंड्रयू न्यूबी

मुझे यह जानने की आवश्यकता है कि क्या console.logप्रदर्शन सुविधा के अलावा इस पर अन्य लाभ हैं , कृपया

— user10089632

Answer 4

कुछ विधियाँ हैं:

 1. typeof tells you which one of the 6 javascript types is the object. 
 2. instanceof tells you if the object is an instance of another object.
 3. List properties with for(var k in obj)
 4. Object.getOwnPropertyNames( anObjectToInspect ) 
 5. Object.getPrototypeOf( anObject )
 6. anObject.hasOwnProperty(aProperty) 

कंसोल संदर्भ में, कभी-कभी .constructor या .prototyp शायद उपयोगी हो:

console.log(anObject.constructor ); 
console.log(anObject.prototype ) ; 

Answer 5

अपने कंसोल का उपयोग करें:

console.log(object);

या यदि आप html डोम तत्वों का निरीक्षण कर रहे हैं तो कंसोल कंसोल (ऑब्जेक्ट) का उपयोग करें। उदाहरण:

let element = document.getElementById('alertBoxContainer');
console.dir(element);

या यदि आपके पास js ऑब्जेक्ट्स का एक सरणी है जिसका आप उपयोग कर सकते हैं:

console.table(objectArr);

यदि आप बहुत से कंसोल.लॉग (ऑब्जेक्ट्स) आउटपुट कर रहे हैं तो आप भी लिख सकते हैं

console.log({ objectName1 });
console.log({ objectName2 });

यह आपको कंसोल पर लिखी गई वस्तुओं को लेबल करने में मदद करेगा।

Comments

वे प्रदर्शित मूल्य गतिशील रूप से बदलते हैं, वास्तविक समय में जो डिबगिंग के उद्देश्यों के लिए भ्रामक हो सकते हैं

— user10089632

क्रोम में अपनी कंसोल वरीयताओं का उपयोग करें और लॉग को संरक्षित करें पर क्लिक करें। अब भले ही आपकी स्क्रिप्ट आपको किसी अन्य पृष्ठ पर रीडायरेक्ट करती हो, आपका कंसोल क्लियर नहीं किया गया है।

— रिचर्ड टोरकाटो

ऐसा लगता है कि यह मुद्दा फ़ायरफ़ॉक्स से संबंधित है क्योंकि क्रोम में जब तक आप कंसोल नहीं करते हैं। () प्रदर्शित मूल्य अभी भी हैं। आप Chrome में जाने का सुझाव दे सकते हैं लेकिन कभी-कभी आप ब्राउज़र सुविधाओं की उपलब्धता का परीक्षण कर रहे हैं। वैसे भी टिप के लिए धन्यवाद जो उपयोगी हो सकता है।

— user10089632

मैं उपयोग नहीं कर सकता consoleक्योंकि मैं स्टाइल स्टैकओवरफ़्लो का उपयोग कर रहा / रही हूं / 7505623/1480391 और यह संगत नहीं है

— यवेस एम।

Answer 6

var str = "";
for(var k in obj)
    if (obj.hasOwnProperty(k)) //omit this test if you want to see built-in properties
        str += k + " = " + obj[k] + "\n";
alert(str);

Comments

कंसोल.लॉग () कैसे करता है? :)

— क्रिश्चियन

फ़ायरफ़ॉक्स या क्रोम का उपयोग करें। फ़ायरफ़ॉक्स के लिए फ़ायरबग प्राप्त करें। एक होना चाहिए

— मो

मैं व्यंगात्मक बन रहा था। ओपी ने विशेष रूप से जेएस कोड के लिए कहा, और जब तक आप सुझाव दे रहे हैं कि वह फायरबग / लोमड़ी / क्रोम में तल्लीन है, मुझे नहीं पता कि वह जवाब कहां मिलेगा।

— क्रिश्चियन

Answer 7

यह क्रिश्चियन के उत्कृष्ट उत्तर के प्रति उदासीन चीर-फाड़ है। मैंने अभी इसे थोड़ा और पठनीय बनाया है:

/**
 * objectInspector digs through a Javascript object
 * to display all its properties
 *
 * @param object - a Javascript object to inspect
 * @param result - a string of properties with datatypes
 *
 * @return result - the concatenated description of all object properties
 */
function objectInspector(object, result) {
    if (typeof object != "object")
        return "Invalid object";
    if (typeof result == "undefined")
        result = '';

    if (result.length > 50)
        return "[RECURSION TOO DEEP. ABORTING.]";

    var rows = [];
    for (var property in object) {
        var datatype = typeof object[property];

        var tempDescription = result+'"'+property+'"';
        tempDescription += ' ('+datatype+') => ';
        if (datatype == "object")
            tempDescription += 'object: '+objectInspector(object[property],result+'  ');
        else
            tempDescription += object[property];

        rows.push(tempDescription);
    }//Close for

    return rows.join(result+"\n");
}//End objectInspector

Answer 8

यहाँ मेरा ऑब्जेक्ट इंस्पेक्टर है जो अधिक पठनीय है। क्योंकि कोड को लिखने में लंबा समय लगता है इसलिए आप इसे http://etto-aa-js.googlecode.com/svn/trunk/inspector.js पर डाउनलोड कर सकते हैं

इस तरह का उपयोग करें:

document.write(inspect(object));

Comments

आमतौर पर ऐसा होता है (और यह निश्चित रूप से आधिकारिक मार्गदर्शन है - लिंक पोस्ट न करें), ओटीओएच, कुछ इस तरह का संस्करण है, यह एक तरह से अच्छा हो सकता है, क्योंकि आप जानते हैं कि आप हमेशा इसे देखते रहेंगे नवीनतम कोड, और कुछ बासी चीज़ जो सालों पहले पोस्ट की गई थी और शायद अब और काम न करे ... - इसके अलावा, कोड का बहुत बड़ा ब्लॉक बहुत ही भयानक लगेगा जो टेक्स्ट SO उत्तर की दीवार में चिपका दिया गया है ... - विषय से बाहर: यदि कोड के लिए "स्पॉइलर" जैसे टैग होना और किसी बाहरी स्रोत से लिंक करने में सक्षम होना और इसे ऑटो अपडेट (जब संभव हो) करना अच्छा होगा, तो यह अच्छा होगा

— ब्रेनस्ल्गस83