मैं कंसोल कैसे बना सकता हूं। किसी वस्तु की वर्तमान स्थिति दिखा सकते हैं?


146

बिना किसी ऐड-ऑन (और वास्तव में अधिकांश अन्य ब्राउज़र) के साथ सफारी में console.log, निष्पादन की अंतिम स्थिति में ऑब्जेक्ट दिखाएगा, न कि उस स्थिति में जब console.logइसे कॉल किया जाता है।

मुझे console.logउस लाइन पर ऑब्जेक्ट की स्थिति प्राप्त करने के लिए इसके माध्यम से आउटपुट करने के लिए ऑब्जेक्ट को क्लोन करना होगा ।

उदाहरण:

var test = {a: true}
console.log(test); // {a: false}
test.a = false; 
console.log(test); // {a: false}

2
समस्या के jsfiddle उदाहरण और नीचे दिए गए विभिन्न समाधान: jsfiddle.net/luken/M6295
ल्यूक

7
यह ऑब्जेक्ट के लिए एक लाइव संदर्भ आउटपुट करने के लिए लॉग फ़ंक्शन के लिए बेहद उलट है । वह घड़ी कहलाती है , जो लॉग एंट्री से बहुत अलग होती है। किसी ऑब्जेक्ट को लॉग इन करते समय ऐसा करने से कोई अधिक समझ में नहीं आता है जब एक आदिम मान को संग्रहीत करने वाले चर को लॉग करना होता है।
faintsignal

2
मैंने इससे पहले कभी कुछ कैसे नहीं किया? मुझे यह भयावह लगता है
एरिकाफ्रिन

जवाबों:


171

मुझे लगता है कि आप ढूंढ रहे हैं console.dir()

console.log()आप जो चाहते हैं वह नहीं करते क्योंकि यह ऑब्जेक्ट के संदर्भ को प्रिंट करता है, और जब तक आप इसे खोलते हैं, तब तक यह बदल जाता है। console.dirजिस समय आप इसे कहते हैं, उस ऑब्जेक्ट में गुणों की एक निर्देशिका प्रिंट करता है।

नीचे JSON विचार एक अच्छा है; आप JSON स्ट्रिंग को पार्स करने के लिए भी जा सकते हैं और क्या .dir () आपको दे सकते हैं जैसे एक ब्राउज़ करने योग्य वस्तु प्राप्त कर सकते हैं।

console.log(JSON.parse(JSON.stringify(obj)));


38
मेरे लिए Chrome13 में कोई अंतर नहीं हैconsole.logconsole.dir
एंड्रयू डी।

हम्म, यह आश्चर्य की बात है - यह फायरबग में काम करता है। मैंने सोचा था कि वेबकिट में भी ऐसा ही था।
इवान सेप

1
क्रोम में जो मैं देख रहा हूं वह यह है कि यदि आप लॉग स्टेटमेंट चलने के बाद कंसोल को खोलते हैं, तो जब आप इसका विस्तार करेंगे तो यह आलसी मूल्यांकन करेगा। लेकिन यदि कंसोल पहले से ही खुला है (जैसे आप कंसोल को खोलते हैं और फिर पेज पर रिफ्रेश हिट करते हैं), तो यह उत्सुक मूल्यांकन करेगा - अर्थात लॉग स्टेटमेंट चलाने के समय मूल्य को प्रिंट करें।
पोलमर्च

6
इसके अलावा, JSON को उथली-प्रतिलिपि के रूप में डीप-कॉपी करना है। Comfort.dir () केवल शीर्ष-स्तरीय ऑब्जेक्ट के गुणों का मूल्यांकन करेगा (अन्य अधिक गहराई से नेस्टेड ऑब्जेक्ट का मूल्यांकन नहीं किया जाएगा), जबकि JSON पुनरावर्ती जाएगा।
पोलमर्च

9
इसी तरह मेरे लिए console.dirक्रोम (v33) में काम नहीं करता है। यहाँ उन समाधानों की तुलना है जो लोगों ने पेश किए हैं: jsfiddle.net/luken/M6295
ल्यूक

71

यदि मैं यह देखना चाहता हूं कि मैं जिस समय लॉग इन हुआ था, तो मैं आमतौर पर यह देखना चाहता हूं कि क्या मैं इसे केवल JSON स्ट्रिंग में बदल सकता हूं।

console.log(JSON.stringify(a));

4
महान, यह मेरे लिए एक अच्छा संकेत था: मुझे बस कंसोल में अपनी वस्तु सही होने के लिए इसे फिर से पार्स करना था। function odump(o){ console.log($.parseJSON(JSON.stringify(o))); }
क्रिस

1
धन्यवाद यह मेरे लिए काम करता है! कंसोल.डियर ने इसे प्रिंट नहीं किया
आह-शियांग ने

1
क्या होगा अगर आपकी वस्तु एक वृत्ताकार संरचना समाहित करती है?
एलेक्स मैकमिलन

1
@AlexMcMillan आप कई पुस्तकालयों में से एक का उपयोग कर सकते हैं जो परिपत्र संदर्भों के साथ वस्तुओं के JSON कड़ाई के लिए अनुमति देते हैं।
एलेक्स टरपिन

7
गीज़। यह करने में सक्षम होने के लिए एक सरल, स्पष्ट बात होनी चाहिए। इसके बजाय हमें एक विशेष परिपत्र संदर्भ पुस्तकालय को कठोर करना, पार्स करना, लॉग करना और उपयोग करना है !? मुझे लगता है कि ब्राउज़र को सरल डिबगिंग की जरूरतों का समर्थन करने का एक बेहतर काम करने की आवश्यकता है।
मंगल

26

वेनिला जेएस:

@ इवान का जवाब यहां सबसे अच्छा लगता है। बस (ab) JSON.parse / stringify का उपयोग प्रभावी ढंग से ऑब्जेक्ट की कॉपी बनाने के लिए करते हैं।

console.log(JSON.parse(JSON.stringify(test)));

JQuery के विशिष्ट समाधान:

आप किसी निश्चित समय पर किसी वस्तु का एक स्नैपशॉट बना सकते हैं jQuery.extend

console.log($.extend({}, test));

वास्तव में यहाँ क्या हो रहा है jQuery के साथ एक नई वस्तु बना रहा है test वस्तु की सामग्री के है, और यह लॉगिंग (ताकि यह नहीं बदलेगा)।

AngularJS (1) विशिष्ट समाधान:

कोणीय एक copyफ़ंक्शन प्रदान करता है जिसका उपयोग उसी प्रभाव के लिए किया जा सकता है:angular.copy

console.log(angular.copy(test));

वेनिला जेएस आवरण समारोह:

यहाँ एक फ़ंक्शन है जो रैप करता है console.logलेकिन उन्हें लॉग आउट करने से पहले किसी भी ऑब्जेक्ट की प्रतिलिपि बना देगा।

मैंने जवाब में कुछ समान लेकिन कम मजबूत कार्यों के जवाब में यह लिखा था। यह कई तर्कों का समर्थन करता है, और यदि वे नियमित वस्तु नहीं हैं तो चीजों को कॉपी करने की कोशिश नहीं करेंगे ।

function consoleLogWithObjectCopy () {
  var args = [].slice.call(arguments);
  var argsWithObjectCopies = args.map(copyIfRegularObject)
  return console.log.apply(console, argsWithObjectCopies)
}

function copyIfRegularObject (o) {
  const isRegularObject = typeof o === 'object' && !(o instanceof RegExp)
  return isRegularObject ? copyObject(o) : o
}

function copyObject (o) {
  return JSON.parse(JSON.stringify(o))
}

उदाहरण का उपयोग :consoleLogWithObjectCopy('obj', {foo: 'bar'}, 1, /abc/, {a: 1})


6

उस > Object कंसोल में, केवल वर्तमान स्थिति दिखा रहा है। यह वास्तव में ऑब्जेक्ट को पढ़ने से इनकार कर रहा है और जब तक आप इसे विस्तारित नहीं करते तब तक यह गुण है।

उदाहरण के लिए,

var test = {a: true}
console.log(test);
setTimeout(function () {
    test.a = false; 
    console.log(test);
}, 4000);

फिर पहली कॉल का विस्तार करें, यह सही होगा, यदि आप इसे दूसरे console.logरिटर्न से पहले करते हैं


2

Xeon06 के संकेत का उपयोग करते हुए, आप अपने JSON को किसी ऑब्जेक्ट में पार्स कर सकते हैं, और यहां लॉग फ़ंक्शन है जो अब मैं अपनी वस्तुओं को डंप करने के लिए उपयोग करता हूं:

function odump(o){
   console.log($.parseJSON(JSON.stringify(o)));
}

1

मैंने एक उपयोगिता परिभाषित की:

function MyLog(text) {
    console.log(JSON.stringify(text));
}

और जब मैं कंसोल पर लॉग इन करना चाहता हूं, तो मैं बस यही करता हूं:

MyLog("hello console!");

ये अच्छी तरह काम करता है!


1

आप ऑब्जेक्ट को मानव पठनीय तरीके से लॉग इन करना चाह सकते हैं:

console.log(JSON.stringify(myObject, null, 2));

यह प्रत्येक स्तर पर 2 स्थानों के साथ ऑब्जेक्ट को इंडेंट करता है।

मैं जावास्क्रिप्ट का उपयोग करके JSON को कैसे प्रिंट कर सकता हूं?


1

डिबगर लाइब्रेरी का उपयोग करने का विकल्प है।

https://debugjs.net/

बस स्क्रिप्ट को अपने वेब पेज में शामिल करें और लॉग स्टेटमेंट डालें।

<script src="debug.js"></script>

लॉगिंग

var test = {a: true}
log(test); // {a: true}
test.a = false; 
log(test); // {a: false}

0

मुझे यह सुझाव देने के लिए गोली मारी जा सकती है, लेकिन इसे एक कदम आगे बढ़ाया जा सकता है। हम कंसोल ऑब्जेक्ट को सीधे और अधिक स्पष्ट करने के लिए विस्तारित कर सकते हैं।

console.logObject = function(o) {
  (JSON.stringify(o));
}

मुझे नहीं पता कि इससे स्पेसटाइम कॉन्टिनम में किसी प्रकार की लाइब्रेरी टक्कर / न्यूक्लियर मेल्टडाउन / रिप का कारण होगा। लेकिन यह मेरे qUnit परीक्षणों में खूबसूरती से काम करता है। :)


1
यह कुछ भी लॉग नहीं करता है। यह बस कुछ-कुछ स्ट्रिंग-आईएनजी के परिणाम को निगलता है। मजेदार बात यह है कि इसके उत्थान को
बढ़ावा

0

कंसोल को खोलने के बाद पृष्ठ को ताज़ा करें या लक्षित पृष्ठ पर अनुरोध सबमिट करने से पहले कंसोल खोलें ...।


हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.