জাভাস্ক্রিপ্টে কোনও বস্তুর কী কী পদ্ধতি / ক্ষেত্র রয়েছে তা আমাদের দেখতে হবে।
জাভাস্ক্রিপ্টে কোনও বস্তুর কী কী পদ্ধতি / ক্ষেত্র রয়েছে তা আমাদের দেখতে হবে।
উত্তর:
অন্যরা যেমন বলেছে, আপনি ফায়ারব্যাগ ব্যবহার করতে পারেন এবং এটি আপনাকে ফায়ারফক্সে কোনও উদ্বেগ সমাধান করতে পারে না। ক্রোম এবং সাফারি উভয়েরই বিল্ট-ইন বিকাশকারী কনসোল রয়েছে যা ফায়ারবগের কনসোলের সাথে প্রায় অভিন্ন ইন্টারফেস রয়েছে, সুতরাং আপনার কোডটি সেই ব্রাউজারগুলির মধ্যে বহনযোগ্য হতে হবে। অন্যান্য ব্রাউজারগুলির জন্য ফায়ারবগ লাইট রয়েছে ।
যদি ফায়ারব্যাগ আপনার জন্য বিকল্প না হয়, তবে এই সাধারণ স্ক্রিপ্টটি ব্যবহার করে দেখুন:
function dump(obj) {
var out = '';
for (var i in obj) {
out += i + ": " + obj[i] + "\n";
}
alert(out);
// or, if you wanted to avoid alerts...
var pre = document.createElement('pre');
pre.innerHTML = out;
document.body.appendChild(pre)
}
আমি প্রতিটি পৃথক সম্পত্তিকে সতর্ক করার বিরুদ্ধে সুপারিশ করব: কিছু বস্তুর প্রচুর সম্পত্তি রয়েছে এবং আপনি সারাদিন সেখানে "ওকে", "ওকে", "ওকে", "ও ... ড্যামিট ক্লিক করে থাকতেন যে সম্পত্তি আমি ছিলাম খুঁজছি".
আপনি যদি ফায়ারফক্স ব্যবহার করছেন তবে ফায়ারব্যাগ প্লাগ-ইন কনসোল হ'ল অবজেক্টগুলি পরীক্ষা করার একটি দুর্দান্ত উপায়
console.debug(myObject);
বিকল্পভাবে আপনি এই জাতীয় বৈশিষ্ট্যগুলি (পদ্ধতি সহ) দ্বারা লুপ করতে পারেন:
for (property in object) {
// do what you want with property, object[property].value
}
প্রচুর আধুনিক ব্রাউজারগুলি নিম্নলিখিত বাক্য গঠন সমর্থন করে:
JSON.stringify(myVar);
console.
বিকল্পগুলির মতো এটি কেবল ভেরিয়েবলের বিষয়বস্তুগুলি দেখায়, এটি ভেরিয়েবলটিকে লেবেল দেয় না, তাই আপনি যদি ভেরিয়েবলগুলির একটি গুচ্ছটি ডাম্প করেন তবে আপনাকে প্রত্যেকটিকে ম্যানুয়ালি লেবেল করতে হবে। :-(
এটি পর্যাপ্তভাবে বলা যায় না যে আপনি এর জন্য কনসোল.দেবগ (অবজেক্ট) ব্যবহার করতে পারেন। আপনি যদি জীবিকা নির্বাহের জন্য এটি করেন তবে এই কৌশলটি আপনাকে বছরে আক্ষরিক অর্থে কয়েক ঘন্টা বাঁচাতে পারে: পি
console.debug({object})
। আপনি একাধিক প্রয়োজন: console.debug({object1, object2})
।
এই প্রশ্নের শিরোনামের প্রসঙ্গে প্রশ্নের উত্তর দেওয়ার জন্য, এখানে একটি ফাংশন যা পিএইচপি var_dump এর অনুরূপ কিছু করে। এটি প্রতি কল অনুযায়ী কেবল একটি পরিবর্তনশীল ডাম্প করে, তবে এটি ডাটা টাইপের পাশাপাশি মানকেও নির্দেশ করে এবং এটি অ্যারের এবং অবজেক্টগুলির মাধ্যমে পুনরাবৃত্তি করে [এমনকি তারা বস্তুর অ্যারে এবং তদ্বিপরীত]। আমি নিশ্চিত যে এটি আরও উন্নত করা যেতে পারে। আমি একজন পিএইচপি লোক বেশি।
/**
* Does a PHP var_dump'ish behavior. It only dumps one variable per call. The
* first parameter is the variable, and the second parameter is an optional
* name. This can be the variable name [makes it easier to distinguish between
* numerious calls to this function], but any string value can be passed.
*
* @param mixed var_value - the variable to be dumped
* @param string var_name - ideally the name of the variable, which will be used
* to label the dump. If this argumment is omitted, then the dump will
* display without a label.
* @param boolean - annonymous third parameter.
* On TRUE publishes the result to the DOM document body.
* On FALSE a string is returned.
* Default is TRUE.
* @returns string|inserts Dom Object in the BODY element.
*/
function my_dump (var_value, var_name)
{
// Check for a third argument and if one exists, capture it's value, else
// default to TRUE. When the third argument is true, this function
// publishes the result to the document body, else, it outputs a string.
// The third argument is intend for use by recursive calls within this
// function, but there is no reason why it couldn't be used in other ways.
var is_publish_to_body = typeof arguments[2] === 'undefined' ? true:arguments[2];
// Check for a fourth argument and if one exists, add three to it and
// use it to indent the out block by that many characters. This argument is
// not intended to be used by any other than the recursive call.
var indent_by = typeof arguments[3] === 'undefined' ? 0:arguments[3]+3;
var do_boolean = function (v)
{
return 'Boolean(1) '+(v?'TRUE':'FALSE');
};
var do_number = function(v)
{
var num_digits = (''+v).length;
return 'Number('+num_digits+') '+v;
};
var do_string = function(v)
{
var num_chars = v.length;
return 'String('+num_chars+') "'+v+'"';
};
var do_object = function(v)
{
if (v === null)
{
return "NULL(0)";
}
var out = '';
var num_elem = 0;
var indent = '';
if (v instanceof Array)
{
num_elem = v.length;
for (var d=0; d<indent_by; ++d)
{
indent += ' ';
}
out = "Array("+num_elem+") \n"+(indent.length === 0?'':'|'+indent+'')+"(";
for (var i=0; i<num_elem; ++i)
{
out += "\n"+(indent.length === 0?'':'|'+indent)+"| ["+i+"] = "+my_dump(v[i],'',false,indent_by);
}
out += "\n"+(indent.length === 0?'':'|'+indent+'')+")";
return out;
}
else if (v instanceof Object)
{
for (var d=0; d<indent_by; ++d)
{
indent += ' ';
}
out = "Object \n"+(indent.length === 0?'':'|'+indent+'')+"(";
for (var p in v)
{
out += "\n"+(indent.length === 0?'':'|'+indent)+"| ["+p+"] = "+my_dump(v[p],'',false,indent_by);
}
out += "\n"+(indent.length === 0?'':'|'+indent+'')+")";
return out;
}
else
{
return 'Unknown Object Type!';
}
};
// Makes it easier, later on, to switch behaviors based on existance or
// absence of a var_name parameter. By converting 'undefined' to 'empty
// string', the length greater than zero test can be applied in all cases.
var_name = typeof var_name === 'undefined' ? '':var_name;
var out = '';
var v_name = '';
switch (typeof var_value)
{
case "boolean":
v_name = var_name.length > 0 ? var_name + ' = ':''; // Turns labeling on if var_name present, else no label
out += v_name + do_boolean(var_value);
break;
case "number":
v_name = var_name.length > 0 ? var_name + ' = ':'';
out += v_name + do_number(var_value);
break;
case "string":
v_name = var_name.length > 0 ? var_name + ' = ':'';
out += v_name + do_string(var_value);
break;
case "object":
v_name = var_name.length > 0 ? var_name + ' => ':'';
out += v_name + do_object(var_value);
break;
case "function":
v_name = var_name.length > 0 ? var_name + ' = ':'';
out += v_name + "Function";
break;
case "undefined":
v_name = var_name.length > 0 ? var_name + ' = ':'';
out += v_name + "Undefined";
break;
default:
out += v_name + ' is unknown type!';
}
// Using indent_by to filter out recursive calls, so this only happens on the
// primary call [i.e. at the end of the algorithm]
if (is_publish_to_body && indent_by === 0)
{
var div_dump = document.getElementById('div_dump');
if (!div_dump)
{
div_dump = document.createElement('div');
div_dump.id = 'div_dump';
var style_dump = document.getElementsByTagName("style")[0];
if (!style_dump)
{
var head = document.getElementsByTagName("head")[0];
style_dump = document.createElement("style");
head.appendChild(style_dump);
}
// Thank you Tim Down [http://stackoverflow.com/users/96100/tim-down]
// for the following addRule function
var addRule;
if (typeof document.styleSheets != "undefined" && document.styleSheets) {
addRule = function(selector, rule) {
var styleSheets = document.styleSheets, styleSheet;
if (styleSheets && styleSheets.length) {
styleSheet = styleSheets[styleSheets.length - 1];
if (styleSheet.addRule) {
styleSheet.addRule(selector, rule)
} else if (typeof styleSheet.cssText == "string") {
styleSheet.cssText = selector + " {" + rule + "}";
} else if (styleSheet.insertRule && styleSheet.cssRules) {
styleSheet.insertRule(selector + " {" + rule + "}", styleSheet.cssRules.length);
}
}
};
} else {
addRule = function(selector, rule, el, doc) {
el.appendChild(doc.createTextNode(selector + " {" + rule + "}"));
};
}
// Ensure the dump text will be visible under all conditions [i.e. always
// black text against a white background].
addRule('#div_dump', 'background-color:white', style_dump, document);
addRule('#div_dump', 'color:black', style_dump, document);
addRule('#div_dump', 'padding:15px', style_dump, document);
style_dump = null;
}
var pre_dump = document.getElementById('pre_dump');
if (!pre_dump)
{
pre_dump = document.createElement('pre');
pre_dump.id = 'pre_dump';
pre_dump.innerHTML = out+"\n";
div_dump.appendChild(pre_dump);
document.body.appendChild(div_dump);
}
else
{
pre_dump.innerHTML += out+"\n";
}
}
else
{
return out;
}
}
কনসোল.ডির (সংযুক্ত পৃষ্ঠার নীচের দিকে) ফায়ারব্যাগে বা গুগল-ক্রোম ওয়েব-ইন্সপেক্টর কোনও বস্তুর বৈশিষ্ট্যের একটি ইন্টারেক্টিভ তালিকা আউটপুট দেবে।
এই স্ট্যাক-ও উত্তরটিও দেখুন
আপনি JSON আকারে পুরো অবজেক্টটি (তার অভ্যন্তরের সমস্ত নেস্টেড স্তরের এবং ভেরিয়েবলগুলি) দেখতে চান। জেএসএন মানে জাভাস্ক্রিপ্ট অবজেক্ট নোটেশন, এবং আপনার অবজেক্টের একটি JSON স্ট্রিং প্রিন্ট করা var_dump
(জাভাস্ক্রিপ্ট অবজেক্টের স্ট্রিং উপস্থাপনা পেতে) এর সমতুল্য । ভাগ্যক্রমে, JSON কোডে ব্যবহার করা খুব সহজ, এবং JSON ডেটা ফর্ম্যাটটিও বেশ মনুষ্য-পঠনযোগ্য।
উদাহরণ:
var objectInStringFormat = JSON.stringify(someObject);
alert(objectInStringFormat);
আপনি যদি ফায়ারব্যাগ ব্যবহার করেন তবে আপনি কোনও বিষয় আউটপুট করতে কনসোল.লগ ব্যবহার করতে পারেন এবং কনসোলে একটি হাইপার লিঙ্কযুক্ত, ব্যবহারযোগ্য আইটেম পেতে পারেন।
আমি নিকফের উত্তরের উন্নতি করেছি, সুতরাং এটি পুনরাবৃত্তভাবে বস্তুর মাধ্যমে লুপ করে:
function var_dump(obj, element)
{
var logMsg = objToString(obj, 0);
if (element) // set innerHTML to logMsg
{
var pre = document.createElement('pre');
pre.innerHTML = logMsg;
element.innerHTML = '';
element.appendChild(pre);
}
else // write logMsg to the console
{
console.log(logMsg);
}
}
function objToString(obj, level)
{
var out = '';
for (var i in obj)
{
for (loop = level; loop > 0; loop--)
{
out += " ";
}
if (obj[i] instanceof Object)
{
out += i + " (Object):\n";
out += objToString(obj[i], level + 1);
}
else
{
out += i + ": " + obj[i] + "\n";
}
}
return out;
}
console.log(OBJECT|ARRAY|STRING|...);
console.info(OBJECT|ARRAY|STRING|...);
console.debug(OBJECT|ARRAY|STRING|...);
console.warn(OBJECT|ARRAY|STRING|...);
console.assert(Condition, 'Message if false');
গুগল ক্রোম এবং মজিলা ফায়ারফক্সে এগুলি সঠিকভাবে কাজ করা উচিত (আপনি যদি ফায়ারফক্সের পুরানো সংস্করণ নিয়ে চলতে থাকেন, তাই আপনাকে ফায়ারব্যাগ প্লাগইন ইনস্টল করতে হবে)
ইন্টারনেট এক্সপ্লোরার 8 বা ততোধিক সংস্করণে আপনাকে অবশ্যই নিম্নলিখিতটি করতে হবে:
আরও তথ্যের জন্য আপনি এই URL টি দেখতে পারেন: https://developer.chrome.com/devtools/docs/console-api
আপনি কেবল এনপিএম প্যাকেজটি var_dump ব্যবহার করতে পারেন
npm install var_dump --save-dev
ব্যবহার:
const var_dump = require('var_dump')
var variable = {
'data': {
'users': {
'id': 12,
'friends': [{
'id': 1,
'name': 'John Doe'
}]
}
}
}
// print the variable using var_dump
var_dump(variable)
এটি মুদ্রণ করবে:
object(1) {
["data"] => object(1) {
["users"] => object(2) {
["id"] => number(12)
["friends"] => array(1) {
[0] => object(2) {
["id"] => number(1)
["name"] => string(8) "John Doe"
}
}
}
}
}
লিঙ্ক: https://www.npmjs.com/package/@smartankur4u/vardump
পরে আমাকে ধন্যবাদ!
আপনি যদি জেএসে রূপান্তরিত পিএইচপি ফাংশনটির সন্ধান করছেন তবে এই ছোট্ট সাইটটি রয়েছে: http://phpjs.org । সেখানে আপনি বেশিরভাগ পিএইচপি ফাংশনটি নির্ভরযোগ্যভাবে জেএস-এ লিখিত পেতে পারেন। var_dump চেষ্টা করে দেখুন: http://phpjs.org/funitions/var_dump/ (শীর্ষ মন্তব্যটি পরীক্ষা করে দেখুন, এটি "প্রতিধ্বনি" এর উপর নির্ভর করে, যা একই সাইট থেকে ডাউনলোডও করা যেতে পারে)
আমি প্রথম উত্তরটি ব্যবহার করেছি, তবে আমি অনুভব করেছি যে এতে কোনও পুনরাবৃত্তি অনুপস্থিত।
ফলাফলটি ছিল:
function dump(obj) {
var out = '';
for (var i in obj) {
if(typeof obj[i] === 'object'){
dump(obj[i]);
}else{
out += i + ": " + obj[i] + "\n";
}
}
var pre = document.createElement('pre');
pre.innerHTML = out;
document.body.appendChild(pre);
}
এই পোস্টে পাওয়া আগের ফাংশনের ভিত্তিতে। পুনরাবৃত্ত মোড এবং ইন্ডেন্টেশন যুক্ত হয়েছে।
function dump(v, s) {
s = s || 1;
var t = '';
switch (typeof v) {
case "object":
t += "\n";
for (var i in v) {
t += Array(s).join(" ")+i+": ";
t += dump(v[i], s+3);
}
break;
default: //number, string, boolean, null, undefined
t += v+" ("+typeof v+")\n";
break;
}
return t;
}
উদাহরণ
var a = {
b: 1,
c: {
d:1,
e:2,
d:3,
c: {
d:1,
e:2,
d:3
}
}
};
var d = dump(a);
console.log(d);
document.getElementById("#dump").innerHTML = "<pre>" + d + "</pre>";
ফলাফল
b: 1 (number)
c:
d: 3 (number)
e: 2 (number)
c:
d: 3 (number)
e: 2 (number)
নীচে আমার প্রিয় var_dump / মুদ্রণ_আর পিএইচপি যাও জাভাস্ক্রিপ্ট সমতুল্যvar_dump
।
function dump(arr,level) {
var dumped_text = "";
if(!level) level = 0;
//The padding given at the beginning of the line.
var level_padding = "";
for(var j=0;j<level+1;j++) level_padding += " ";
if(typeof(arr) == 'object') { //Array/Hashes/Objects
for(var item in arr) {
var value = arr[item];
if(typeof(value) == 'object') { //If it is an array,
dumped_text += level_padding + "'" + item + "' ...\n";
dumped_text += dump(value,level+1);
} else {
dumped_text += level_padding + "'" + item + "' => \"" + value + "\"\n";
}
}
} else { //Stings/Chars/Numbers etc.
dumped_text = "===>"+arr+"<===("+typeof(arr)+")";
}
return dumped_text;
}
গেমটি দেরীতে না হলেও এখানে ব্যবহার করা অত্যন্ত সহজ একটি কার্যকরী ফাংশন আপনাকে যেকোন প্রকারের পছন্দ অনুযায়ী যতটা আর্গুমেন্ট পাস করতে দেয় এবং ব্রাউজার কনসোল উইন্ডোতে অবজেক্টের বিষয়বস্তু প্রদর্শন করবে যেমন আপনি কনসোলকে ডেকেছিলেন। জাভাস্ক্রিপ্ট থেকে লগ - কিন্তু পিএইচপি থেকে
দ্রষ্টব্য, আপনি 'TAG-YourTag' পাস করে ট্যাগগুলিও ব্যবহার করতে পারেন এবং অন্য ট্যাগটি পড়া না হওয়া পর্যন্ত এটি প্রয়োগ করা হবে, উদাহরণস্বরূপ, 'TAG-YourNextTag'
/*
* Brief: Print to console.log() from PHP
* Description: Print as many strings,arrays, objects, and other data types to console.log from PHP.
* To use, just call consoleLog($data1, $data2, ... $dataN) and each dataI will be sent to console.log - note that
* you can pass as many data as you want an this will still work.
*
* This is very powerful as it shows the entire contents of objects and arrays that can be read inside of the browser console log.
*
* A tag can be set by passing a string that has the prefix TAG- as one of the arguments. Everytime a string with the TAG- prefix is
* detected, the tag is updated. This allows you to pass a tag that is applied to all data until it reaches another tag, which can then
* be applied to all data after it.
*
* Example:
* consoleLog('TAG-FirstTag',$data,$data2,'TAG-SecTag,$data3);
* Result:
* FirstTag '...data...'
* FirstTag '...data2...'
* SecTag '...data3...'
*/
function consoleLog(){
if(func_num_args() == 0){
return;
}
$tag = '';
for ($i = 0; $i < func_num_args(); $i++) {
$arg = func_get_arg($i);
if(!empty($arg)){
if(is_string($arg)&& strtolower(substr($arg,0,4)) === 'tag-'){
$tag = substr($arg,4);
}else{
$arg = json_encode($arg, JSON_HEX_TAG | JSON_HEX_AMP );
echo "<script>console.log('".$tag." ".$arg."');</script>";
}
}
}
}
দ্রষ্টব্য: func_num_args () এবং func_num_args () ডায়নামিক সংখ্যার ইনপুট আরগগুলি পড়ার জন্য পিএইচপি ফাংশন এবং এই ফাংশনটিকে এক ফাংশন কল থেকে অসীম বহু কনসোল.লগ অনুরোধ থাকতে দেয়
debug
): james.padolsey.com