I have created an object array in JavaScript. How can I print the object array in the browser window, similar to print_r
function in PHP?
我已经用JavaScript创建了一个对象数组。如何在浏览器窗口中打印对象数组,类似于PHP中的print_r函数?
var lineChartData = [{
date: new Date(2009, 10, 2),
value: 5
}, {
date: new Date(2009, 10, 25),
value: 30
}, {
date: new Date(2009, 10, 26),
value: 72,
customBullet: "images/redstar.png"
}];
10 个解决方案
#1
92
Simply use
简单地使用
yourContainer.innerHTML = JSON.stringify(lineChartData);
If you want something prettier, do
如果你想要更漂亮的,那就去做
yourContainer.innerHTML = JSON.stringify(lineChartData, null, 4);
示范
But if you just do this in order to debug, then you'd better use the console with console.log(lineChartData)
.
但是如果您只是为了调试而这样做,那么您最好使用控制台with console.log(lineChartData)。
#2
10
If you are using Chrome, you could also use
如果你用的是Chrome,你也可以用
console.log( yourArray );
#3
8
Did you check
你是否检查
console.table(yourArray);
More infos here: https://developer.mozilla.org/en-US/docs/Web/API/Console/table
更多信息:https://developer.mozilla.org/en-US/docs/Web/API/Console/table
#4
6
There is a wonderful print_r
implementation for JavaScript in php.js library.
php中有一个很棒的JavaScript print_r实现。js库。
Note, you should also add echo
support in the code.
注意,您还应该在代码中添加echo支持。
DEMO: http://jsbin.com/esexiw/1
演示:http://jsbin.com/esexiw/1
#5
3
Simple function to alert contents of an object or an array .
Call this function with an array or string or an object it alerts the contents.
一个简单的函数,用来提醒对象或数组的内容。用一个数组或字符串或一个对象来调用这个函数,它会通知内容。
Function
函数
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);
}
}
Usage
使用
var data = [1, 2, 3, 4];
print_r(data);
#6
1
document.getElementById('container').innerHTML = lineChartData[array_index]
#7
0
I use the below function to display a readout in firefox console log:
我使用下面的函数在firefox控制台日志中显示一个读数:
//// make printable string for console readout, recursively
var make_printable_object = function(ar_use)
{
//// internal arguments
var in_tab = arguments[1];
var st_return = arguments[2];
//// default vales when applicable
if (!in_tab) in_tab = 0;
if (!st_return) st_return = "";
//// add depth
var st_tab = "";
for (var i=0; i < in_tab; i++) st_tab = st_tab+"-~-~-";
//// traverse given depth and build string
for (var key in ar_use)
{
//// gather return type
var st_returnType = typeof ar_use[key];
//// get current depth display
var st_returnPrime = st_tab+ "["+key+"] ->"+ar_use[key]+"< is {"+st_returnType+"}";
//// remove linefeeds to avoid printout confusion
st_returnPrime = st_returnPrime.replace(/(\r\n|\n|\r)/gm,"");
//// add line feed
st_return = st_return+st_returnPrime+"\n";
//// stop at a depth of 15
if (in_tab>15) return st_return;
//// if current value is an object call this function
if ( (typeof ar_use[key] == "object") & (ar_use[key] != "null") & (ar_use[key] != null) ) st_return = make_printable_object(ar_use[key], in_tab+1, st_return);
}
//// return complete output
return st_return;
};
Example:
例子:
console.log( make_printable_object( some_object ) );
Alternatively, you can just replace:
或者,你可以替换:
st_return = st_return+st_returnPrime+"\n";
with
与
st_return = st_return+st_returnPrime+"<br/>";
to print out in a html page.
在html页面中打印。
#8
0
You can just use the following syntax and the object will be fully shown in the console:
您可以仅使用以下语法,并且该对象将在控制台中充分显示:
console.log('object evt: %O', object);
I use Chrome browser don't know if this is adaptable for other browsers.
我使用Chrome浏览器不知道这是否适用于其他浏览器。
#9
0
Emm... Why not to use something like this?
嗯…为什么不用这样的东西呢?
function displayArrayObjects(arrayObjects) {
var len = arrayObjects.length, text = "";
for (var i = 0; i < len; i++) {
var myObject = arrayObjects[i];
for (var x in myObject) {
text += ( x + ": " + myObject[x] + " ");
}
text += "<br/>";
}
document.getElementById("message").innerHTML = text;
}
var lineChartData = [{
date: new Date(2009, 10, 2),
value: 5
}, {
date: new Date(2009, 10, 25),
value: 30
}, {
date: new Date(2009, 10, 26),
value: 72,
customBullet: "images/redstar.png"
}];
displayArrayObjects(lineChartData);
<h4 id="message"></h4>
result:
结果:
date: Mon Nov 02 2009 00:00:00 GMT+0200 (FLE Standard Time) value: 5
date: Wed Nov 25 2009 00:00:00 GMT+0200 (FLE Standard Time) value: 30
date: Thu Nov 26 2009 00:00:00 GMT+0200 (FLE Standard Time) value: 72 customBullet: images/redstar.png
jsfiddle
#10
0
i use my custom function to print array in console
我使用我的自定义函数在控制台打印数组
this.print = function (data,bpoint=0) {
var c = 0;
for(var k=0; k<data.length; k++){
c++;
console.log(c+' '+data[k]);
if(k!=0 && bpoint === k)break;
}
}
usage : print(array);
or print(array,50); // 50 value to print only
用法:打印(数组);或打印(数组、50);// 50值仅供打印
#1
92
Simply use
简单地使用
yourContainer.innerHTML = JSON.stringify(lineChartData);
If you want something prettier, do
如果你想要更漂亮的,那就去做
yourContainer.innerHTML = JSON.stringify(lineChartData, null, 4);
示范
But if you just do this in order to debug, then you'd better use the console with console.log(lineChartData)
.
但是如果您只是为了调试而这样做,那么您最好使用控制台with console.log(lineChartData)。
#2
10
If you are using Chrome, you could also use
如果你用的是Chrome,你也可以用
console.log( yourArray );
#3
8
Did you check
你是否检查
console.table(yourArray);
More infos here: https://developer.mozilla.org/en-US/docs/Web/API/Console/table
更多信息:https://developer.mozilla.org/en-US/docs/Web/API/Console/table
#4
6
There is a wonderful print_r
implementation for JavaScript in php.js library.
php中有一个很棒的JavaScript print_r实现。js库。
Note, you should also add echo
support in the code.
注意,您还应该在代码中添加echo支持。
DEMO: http://jsbin.com/esexiw/1
演示:http://jsbin.com/esexiw/1
#5
3
Simple function to alert contents of an object or an array .
Call this function with an array or string or an object it alerts the contents.
一个简单的函数,用来提醒对象或数组的内容。用一个数组或字符串或一个对象来调用这个函数,它会通知内容。
Function
函数
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);
}
}
Usage
使用
var data = [1, 2, 3, 4];
print_r(data);
#6
1
document.getElementById('container').innerHTML = lineChartData[array_index]
#7
0
I use the below function to display a readout in firefox console log:
我使用下面的函数在firefox控制台日志中显示一个读数:
//// make printable string for console readout, recursively
var make_printable_object = function(ar_use)
{
//// internal arguments
var in_tab = arguments[1];
var st_return = arguments[2];
//// default vales when applicable
if (!in_tab) in_tab = 0;
if (!st_return) st_return = "";
//// add depth
var st_tab = "";
for (var i=0; i < in_tab; i++) st_tab = st_tab+"-~-~-";
//// traverse given depth and build string
for (var key in ar_use)
{
//// gather return type
var st_returnType = typeof ar_use[key];
//// get current depth display
var st_returnPrime = st_tab+ "["+key+"] ->"+ar_use[key]+"< is {"+st_returnType+"}";
//// remove linefeeds to avoid printout confusion
st_returnPrime = st_returnPrime.replace(/(\r\n|\n|\r)/gm,"");
//// add line feed
st_return = st_return+st_returnPrime+"\n";
//// stop at a depth of 15
if (in_tab>15) return st_return;
//// if current value is an object call this function
if ( (typeof ar_use[key] == "object") & (ar_use[key] != "null") & (ar_use[key] != null) ) st_return = make_printable_object(ar_use[key], in_tab+1, st_return);
}
//// return complete output
return st_return;
};
Example:
例子:
console.log( make_printable_object( some_object ) );
Alternatively, you can just replace:
或者,你可以替换:
st_return = st_return+st_returnPrime+"\n";
with
与
st_return = st_return+st_returnPrime+"<br/>";
to print out in a html page.
在html页面中打印。
#8
0
You can just use the following syntax and the object will be fully shown in the console:
您可以仅使用以下语法,并且该对象将在控制台中充分显示:
console.log('object evt: %O', object);
I use Chrome browser don't know if this is adaptable for other browsers.
我使用Chrome浏览器不知道这是否适用于其他浏览器。
#9
0
Emm... Why not to use something like this?
嗯…为什么不用这样的东西呢?
function displayArrayObjects(arrayObjects) {
var len = arrayObjects.length, text = "";
for (var i = 0; i < len; i++) {
var myObject = arrayObjects[i];
for (var x in myObject) {
text += ( x + ": " + myObject[x] + " ");
}
text += "<br/>";
}
document.getElementById("message").innerHTML = text;
}
var lineChartData = [{
date: new Date(2009, 10, 2),
value: 5
}, {
date: new Date(2009, 10, 25),
value: 30
}, {
date: new Date(2009, 10, 26),
value: 72,
customBullet: "images/redstar.png"
}];
displayArrayObjects(lineChartData);
<h4 id="message"></h4>
result:
结果:
date: Mon Nov 02 2009 00:00:00 GMT+0200 (FLE Standard Time) value: 5
date: Wed Nov 25 2009 00:00:00 GMT+0200 (FLE Standard Time) value: 30
date: Thu Nov 26 2009 00:00:00 GMT+0200 (FLE Standard Time) value: 72 customBullet: images/redstar.png
jsfiddle
#10
0
i use my custom function to print array in console
我使用我的自定义函数在控制台打印数组
this.print = function (data,bpoint=0) {
var c = 0;
for(var k=0; k<data.length; k++){
c++;
console.log(c+' '+data[k]);
if(k!=0 && bpoint === k)break;
}
}
usage : print(array);
or print(array,50); // 50 value to print only
用法:打印(数组);或打印(数组、50);// 50值仅供打印