JSON কে পার্সড অবজেক্ট মুদ্রণ করবেন?


200

আমি একটি জাভাস্ক্রিপ্ট অবজেক্ট পেয়েছি যা JSON কে বিশ্লেষণ করে পার্স করা হয়েছে JSON.parseআমি এখন অবজেক্টটি মুদ্রণ করতে চাই যাতে আমি এটি ডিবাগ করতে পারি (ফাংশনটিতে কিছু ভুল হচ্ছে)। আমি যখন নিম্নলিখিতগুলি করি ...

for (property in obj) {
    output += property + ': ' + obj[property]+'; ';
}
console.log(output);

আমি একাধিক [অবজেক্ট অবজেক্ট] এর তালিকাভুক্ত পেয়েছি। আমি ভাবছি বিষয়গুলি দেখার জন্য আমি কীভাবে এটি মুদ্রণ করব?


5
সাইডেনোট হিসাবে, (অবজেক্টে সম্পত্তি) সমস্ত সম্পত্তি এমনকি উত্তরাধিকার সূত্রে তালিকাভুক্ত করবে। সুতরাং আপনি অবজেক্ট.প্রোটোটাইপ এবং যে কোনও 'মাদার ক্লাস' এর জন্য প্রচুর বহিরাগত ওপেন পাবেন। এটি json অবজেক্টগুলির সাথে অসুবিধাজনক নয়। এই বস্তুর মালিকানাধীন বৈশিষ্ট্যগুলি পেতে আপনাকে তাদের ওসনপ্রোপার্টি () দিয়ে ফিল্টার করতে হবে।
বিআইএইবি

উত্তর:


124

বেশিরভাগ ডিবাগার কনসোলগুলি সরাসরি অবজেক্ট প্রদর্শন করার জন্য সমর্থন করে। শুধু ব্যবহার

console.log(obj);

আপনার ডিবাগারের উপর নির্ভর করে এটি সম্ভবত কনসোলে একটি ধসে পড়া গাছ হিসাবে বস্তুটি প্রদর্শন করবে। আপনি গাছটি খুলুন এবং অবজেক্টটি পরীক্ষা করতে পারেন।


122
এটি উল্লেখ করার মতো যে ক্রোম (এবং সম্ভবত অন্যান্য ব্রাউজারগুলি) যখন এই জাতীয় স্ট্রিংয়ের সাথে মিলিত হয়: console.log("object: " + obj)এটি বস্তুটি প্রদর্শন করে না, তবে পরিবর্তে "অবজেক্ট: [অবজেক্ট অবজেক্ট]" আউটপুট দেবে।
শাহর

24
@ সাহার console.log("object: %O", obj)(ক্রোম) বা console.log("object: %o", obj)(ফায়ারফক্স | সাফারি) আপনাকে অবজেক্টের বিশদটিতে অ্যাক্সেস দেবে, নীচে আমার উত্তরটি দেখুন।
ডেভ অ্যান্ডারসন

1
@ ডেভএন্ডারসন কনসোলে অবজেক্ট ফর্ম্যাটিংয়ের জন্য ভাল শট।
lekant

@ সাহার ধন্যবাদ, আপনার আমার প্রয়োজনীয় তথ্য ছিল। উত্তরে যুক্ত করা উচিত।
লিও ফ্ল্যাটার্টি

3
@ ডেভএন্ডারসনের পদ্ধতি ছাড়াও বস্তু থেকে পৃথক স্ট্রিংয়ের জন্য কমা ব্যবহার করাও কাজ করতে পারে:console.log("My object: ", obj)
শাহর

571

আপনি জেএসএন মানে কি জানেন? জাভাস্ক্রিপ্ট অবজেক্ট নোটেশন । এটি বস্তুর জন্য বেশ ভাল ফর্ম্যাট তৈরি করে।

JSON.stringify(obj) আপনাকে বস্তুর একটি স্ট্রিং প্রতিনিধিত্ব ফিরিয়ে দেবে।


12
আমি অবাক হচ্ছি এই উত্তরটি নীচে রয়েছে ...... এটি গ্রহণযোগ্য উত্তর হওয়া উচিত :-)
মিংগু

1
আপনি যদি স্ট্রিং প্রতিনিধিত্ব না চান, তবে বস্তুটি কোনও কোড সম্পাদকে প্রদর্শিত হবে?
সুপারউবারডুপার

5
@ সুপারউবারডুপার: ... তাহলে আপনি এখন স্ট্রিং প্রতিনিধিত্ব তৈরি করার চেষ্টা করছেন না। :)
সিএইচও

আমি বিশ্বাস করি সুপারউবারডুপার জিজ্ঞাসা করেছিল যে কোনও বস্তুকে স্ট্রিংয়ে রূপান্তর না করে লগ করা যায় বা দেখা যায় কিনা। ব্রাউজারে যদি ডিওএমএর কোনও উপাদান প্রয়োজন হয় তবে আপনি জসনকে স্ট্রিংফাই করতে পারেন এবং পৃষ্ঠায় এটি দেখার জন্য কোনও উপাদানগুলির অভ্যন্তরীণ এইচটিএমএল সেট করতে পারেন।
জেসনলোনহার্ড

উদাহরণস্বরূপ: './data.json' থেকে জেসন আমদানি করুন; var এল = ডকুমেন্ট.ক্রেটএলিমেন্ট ('ডিভ'); el.innerHTML = JSON.stringify (জসন);
জেসনলোনহার্ড

54

console.dir()পরিবর্তে চেষ্টা করুনconsole.log()

console.dir(obj);

এমডিএন বলছে এর console.dir()দ্বারা সমর্থিত:

  • FF8 + +
  • IE9 + +
  • অপেরা
  • ক্রৌমিয়াম
  • আফ্রিকায় শিকার অভিযান

1
কেবলমাত্র
আইই 9

3
console.dir()এফএফ 8 +, অপেরা, ক্রোম এবং সাফারি এও উপলব্ধ: ডেভেলপার.মোজিলা.আর.ইন-
কনসোল.ডির

গ্রেট! এটি আমার পক্ষে সেরা সমাধান। ধন্যবাদ।
হোয়াং লে

1
নোড জেএস সম্পর্কে কি?
এক্সএমএল

ভাল, তবে লগের ("স্ট্রিং" + ভেরিয়েবল) মতো স্ট্রিং কনটেনটেশন সমর্থন করে না
নাসিম

47

যদি আপনি ইন্ডেন্টেশন সহ একটি সুন্দর, বহুরেখা JSON চান তবে আপনি JSON.stringifyএটির তৃতীয় যুক্তি দিয়ে ব্যবহার করতে পারেন :

JSON.stringify(value[, replacer[, space]])

উদাহরণ স্বরূপ:

var obj = {a:1,b:2,c:{d:3, e:4}};

JSON.stringify(obj, null, "    ");

অথবা

JSON.stringify(obj, null, 4);

আপনাকে নিম্নলিখিত ফলাফল দেবে:

"{
    "a": 1,
    "b": 2,
    "c": {
        "d": 3,
        "e": 4
    }
}"

একটি ব্রাউজারে console.log(obj)আরও ভাল কাজ করে তবে শেল কনসোলে (নোড.জেএস) এটি হয় না।



25

স্ট্রিং ফর্ম্যাট ব্যবহার করুন;

console.log("%s %O", "My Object", obj);

নিম্নলিখিতগুলির সাথে ক্রোমের ফর্ম্যাট স্পেসিফায়ার রয়েছে;

  • %s স্ট্রিং হিসাবে মান ফর্ম্যাট।
  • %dঅথবা %iমানটিকে পূর্ণসংখ্যা হিসাবে ফর্ম্যাট করে।
  • %f ভাসমান পয়েন্টের মান হিসাবে মানটি ফর্ম্যাট করে।
  • %o মানকে একটি প্রসারণযোগ্য ডিওএম উপাদান হিসাবে রূপ দেয় (এলিমেন্ট প্যানেলের মতো)।
  • %O প্রসারিত জাভাস্ক্রিপ্ট অবজেক্ট হিসাবে মানটি ফর্ম্যাট করে।
  • %c আপনার সরবরাহিত CSS স্টাইল অনুসারে আউটপুট স্ট্রিং ফর্ম্যাট করে।

ফায়ারফক্সে স্ট্রিং সাবস্টিটিশন রয়েছে যা একই বিকল্প রয়েছে।

  • %oএকটি জাভাস্ক্রিপ্ট অবজেক্টের একটি হাইপার লিঙ্ক আউটপুট করে। লিঙ্কটি ক্লিক করা একটি পরিদর্শক খোলে।
  • %dঅথবা %iএকটি পূর্ণসংখ্যা আউটপুট করে। ফর্ম্যাট করা এখনও সমর্থিত নয়।
  • %s একটি স্ট্রিং আউটপুট।
  • %fভাসমান-পয়েন্টের মান আউটপুট করে। ফর্ম্যাট করা এখনও সমর্থিত নয়।

সাফারিতে প্রিন্টফ স্টাইলের ফর্ম্যাটর রয়েছে

  • %dবা %iপূর্ণসংখ্যা
  • %[0.N]f নির্ভুলতার এন অঙ্ক সহ ভাসমান-পয়েন্ট মান
  • %o উদ্দেশ্য
  • %s দড়ি

1
চমৎকার রেফারেন্স উত্তর
ডেভিড

1
% O সত্যিই সহায়ক
এভারটন

4

সুন্দর এবং সহজ:

console.log("object: %O", obj)

1
আপনি কি দয়া করে% O এর জন্য বর্ণনা করতে পারেন? এটি বিশেষত ও হওয়া উচিত? - আপনার সমাধানটি
মনোমুগ্ধের

ও অবজেক্টের জন্য দাঁড়িয়েছে, সুতরাং যতক্ষণ না অবজেক্টটি স্ট্রিং হিসাবে মুদ্রণ করা যায় ততক্ষণ এটি কোনও সমস্যা ছাড়াই মুদ্রিত হওয়া উচিত। এটি আমাকে অনেক ক্ষেত্রে সমস্যা সমাধানে সহায়তা করেছে যেখানে আমি নিশ্চিত ছিলাম না যে ত্রুটিটি কোথায় রয়েছে
এমবেনহালিম

আমি এখানে জানাতে ভুলে গেছি, আসলে আমাদের% O ব্যবহার করার দরকার নেই। আমরা সরাসরি console.log ব্যবহার করতে পারেন: ( "বস্তু", obj) ধন্যবাদ @mbenhalima
Anthonius

3

শুধু ব্যবহার

console.info("CONSOLE LOG : ")
console.log(response);
console.info("CONSOLE DIR : ")
console.dir(response);

এবং আপনি এটি ক্রোম কনসোলে পাবেন:

CONSOLE LOG : 
facebookSDK_JS.html:56 Object {name: "Diego Matos", id: "10155988777540434"}
facebookSDK_JS.html:57 CONSOLE DIR : 
facebookSDK_JS.html:58 Objectid: "10155988777540434"name: "Diego Matos"__proto__: Object

2

কোনও অবজেক্ট বা অ্যারের সামগ্রীর বিষয়ে সতর্ক করার জন্য সাধারণ ফাংশন।
এই ফাংশনটিকে একটি অ্যারে বা স্ট্রিং বা কোনও অবজেক্টের সাথে কল করুন এটি বিষয়বস্তুগুলিকে সতর্ক করে।

ক্রিয়া

function print_r(printthis, returnoutput) {
    var output = '';

    if($.isArray(printthis) || typeof(printthis) == 'object') {
        for(var i in printthis) {
            output += i + ' : ' + print_r(printthis[i], true) + '\n';
        }
    }else {
        output += printthis;
    }
    if(returnoutput && returnoutput == true) {
        return output;
    }else {
        alert(output);
    }
}

ব্যবহার

var data = [1, 2, 3, 4];
print_r(data);

2

নিম্নলিখিত কোডটি সতর্কতা বাক্সে সম্পূর্ণ জসন ডেটা প্রদর্শন করবে

var data= '{"employees":[' +
'{"firstName":"John","lastName":"Doe" },' +
'{"firstName":"Anna","lastName":"Smith" },' +
'{"firstName":"Peter","lastName":"Jones" }]}';

json = JSON.parse(data);
window.alert(JSON.stringify(json));

2

আপনি যদি ডিবাগ করতে চান তবে কেন কনসোল ডিবাগ ব্যবহার করবেন না

window.console.debug(jsonObject);

0

আপনি যদি সার্ভারে জেএস-এ কাজ করে থাকেন তবে আরও কিছুটা জিমন্যাস্টিকস অনেক দূর এগিয়ে যায় ... এখানে আমার পপোস (সুন্দর-প্রিন্ট-অন-সার্ভার):

ppos = (object, space = 2) => JSON.stringify(object, null, space).split('\n').forEach(s => console.log(s));

যা আমি যখন সার্ভার কোডটি লিখছি তখন আসলেই পড়তে পারি এমন কিছু তৈরির কাজটি গুছিয়ে তোলে।


0

আমি জানি না কিভাবে এটা আনুষ্ঠানিকভাবে তৈরি না হয়, কিন্তু আমি আমার নিজের জুড়েছেন jsonপদ্ধতি থেকে consoleসহজ মুদ্রণ stringified লগ জন্য বস্তু:

জাভাস্ক্রিপ্টে অবজেক্টস (নন-আদিম) পর্যবেক্ষণ করা কিছুটা কোয়ান্টাম মেকানিক্সের মতো..আপনি "পরিমাপ "টি প্রকৃত অবস্থা হতে পারে না, যা ইতিমধ্যে পরিবর্তিত হয়েছে।

console.json = console.json || function(argument){
    for(var arg=0; arg < arguments.length; ++arg)
        console.log(  JSON.stringify(arguments[arg], null, 4)  )
}

// use example
console.json(   [1,'a', null, {a:1}], {a:[1,2]}    )

অনেক সময় এটি কোনও বস্তুর স্ট্রাইডাইজড ভার্সন দেখার প্রয়োজন হয় কারণ এটি প্রচ্ছদ হিসাবে (কাঁচা অবজেক্ট) মুদ্রণ করা হবে যা প্রোগ্রামের অগ্রগতির সাথে সাথে রূপান্তরিত হয়ে ওঠে এবং এমন একটি অবজেক্টের "লাইভ" সংস্করণ প্রিন্ট করবে এবং বস্তুর অবস্থার প্রতিচ্ছবি করবে না will লগড পয়েন্ট অফ-টাইমে, উদাহরণস্বরূপ:

var foo = {a:1, b:[1,2,3]}

// lets peek under the hood
console.log(foo) 

// program keeps doing things which affect the observed object
foo.a = 2
foo.b = null
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.