JavaScript에서 객체 배열을 인쇄하는 방법은 무엇입니까?

JavaScript에서 객체 배열을 인쇄하는 방법은 무엇입니까?

---

JavaScript에서 개체 배열을 만들었습니다. print_rPHP의 기능 과 유사하게 브라우저 창에서 개체 배열을 인쇄하려면 어떻게 해야합니까?

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"
        }];

---

간단히 stringify개체를 선택하고 선택한 요소의 innerHTML 에 할당하면됩니다 .

yourContainer.innerHTML = JSON.stringify(lineChartData);

더 예쁜 것을 원한다면

yourContainer.innerHTML = JSON.stringify(lineChartData, null, 4);

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"
        }];

document.getElementById("whereToPrint").innerHTML = JSON.stringify(lineChartData, null, 4);

<pre id="whereToPrint"></pre>

그러나 디버깅을 위해이 작업을 수행 하는 경우 .NET Framework 와 함께 콘솔 을 사용하는 것이 좋습니다 console.log(lineChartData).

---

Chrome을 사용하는 경우 다음을 사용할 수도 있습니다.

console.log( yourArray );

---

확인 해봤 었니

console.table(yourArray);

자세한 정보 : https://developer.mozilla.org/en-US/docs/Web/API/Console/table

---

php.js 라이브러리 print_r에는 JavaScript에 대한 멋진 구현이 있습니다.

또한 echo코드 에 지원을 추가해야 합니다.

데모 : http://jsbin.com/esexiw/1

---

객체 또는 배열의 내용을 경고하는 간단한 기능.
배열, 문자열 또는 내용을 경고하는 객체를 사용하여이 함수를 호출합니다.

함수

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);

---

document.getElementById('container').innerHTML = lineChartData[array_index]

---

아래 기능을 사용하여 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;

};

예:

console.log( make_printable_object( some_object ) );

또는 다음을 대체 할 수 있습니다.

st_return = st_return+st_returnPrime+"\n";

와

st_return = st_return+st_returnPrime+"<br/>";

html 페이지로 인쇄합니다.

---

다음 구문을 사용하면 개체가 콘솔에 완전히 표시됩니다.

console.log('object evt: %O', object);

나는 크롬 브라우저를 사용하는데 이것이 다른 브라우저에 적응할 수 있는지 모른다.

---

음 .. 이런걸 쓰면 안되요?

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>

결과:

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

---

내 사용자 지정 함수를 사용하여 콘솔에서 배열을 인쇄합니다.

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;  
    }
}

사용법 : print (array);
또는 print (array, 50); // 인쇄 전용 50 값

---

하위 요소에 대해 확실하지 않지만 모든 브라우저가 지금이를 지원해야합니다.

for (val of lineChartData) {
  document.write(val);
}

This might give you some ideas For-each over an array in JavaScript?

참고URL : https://stackoverflow.com/questions/14895287/how-to-print-object-array-in-javascript