alert ()를 사용하여 JavaScript에서 배열 구조를 어떻게 볼 수 있습니까?


108

JavaScript에서 배열의 구조를 보려면 어떻게 alert()해야합니까?


14
이것은 귀하의 질문에 대한 답변은 아니지만 FireBug를 설치하고 사용해야 console.log합니다. JavaScript 객체를 검사하는 데 적합합니다.
— Deniz Dogan

배열 구조 란 무엇을 의미합니까? 배열을 반복하고 각 값을 경고 할 수 있습니다.
— Tim Schmelter

@ Deniz Dogan by console.log 당신은 shift + R 및 옵션 "console"을 의미합니까?
— pppttt 2010 년

1
@Deniz- console.debug실제로 더 잘 작동합니다.
— Matt Ball

@Tim 구조로 내가 의미하는 인덱스와 값, PHP printf와 같은 배열의 "원시"보기
— pppttt

답변:


122

매우 기본적인 접근 방식은 alert(arrayObj.join('\n'))각 배열 요소를 한 행에 표시하는입니다.


5
이것은 훌륭하게 작동합니다. "arrayObj"를 배열 이름으로 바꿉니다. 따라서 배열 이름이 myArray 인 경우 다음 코드 줄이됩니다.alert(myArray.join('\n'));
— Tony Brasunas 2014 년

54

편집 : Firefox 및 Google Chrome에는 이제 기본 제공 JSON개체가 있으므로 alert(JSON.stringify(myArray))jQuery 플러그인을 사용하지 않고도 말할 수 있습니다 . 이것은 자바 스크립트 언어 사양의 일부 JSON가 아니므로 모든 브라우저 에있는 객체에 의존해서는 안되지만 디버깅 목적으로는 매우 유용합니다.

다음과 같이 jQuery-json 플러그인 을 사용하는 경향이 있습니다 .

alert( $.toJSON(myArray) );

다음과 같은 형식으로 배열을 인쇄합니다.

[5, 6, 7, 11]

그러나 Javascript 코드를 디버깅하려면 Firebug를 적극 권장합니다. 실제로 Javascript 콘솔이 함께 제공되므로 모든 페이지에 대한 Javascript 코드를 입력하고 결과를 볼 수 있습니다. 배열과 같은 것은 이미 위에서 사용 된 사람이 읽을 수있는 형식으로 인쇄되어 있습니다.

Firebug에는 또한 디버거와 HTML 및 CSS를보고 디버그하는 데 도움이되는 화면이 있습니다.


32

아래 함수에 js 배열을 전달하면 php print_r () 함수와 동일하게 수행됩니다.

 alert(print_r(your array));  //call it like this

function print_r(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 += print_r(value,level+1);
        } else {
            dumped_text += level_padding + "'" + item + "' => \"" + value + "\"\n";
        }
    }
} else { //Stings/Chars/Numbers etc.
    dumped_text = "===>"+arr+"<===("+typeof(arr)+")";
}
return dumped_text;
}

이 함수는 UI 정렬 가능한 배열을 구문 분석하여 firefox를 충돌시킵니다.
— Shahrokhian 2013 년


8

toString ()을 사용하는 것이 좋습니다.

전의. alert(array.toString()), 또는console.log(array.toString())


3

이것이 디버깅 목적이라면 Firebug 와 같은 JavaScript 디버거를 사용하는 것이 좋습니다 . 배열 항목 수정 및 코드 단계별 실행을 포함하여 배열의 전체 내용을 볼 수 있습니다.


2

원하는 것이 객체 배열의 내용을 alert ()로 표시하는 것이라면 간단한 alert (MyArray); 어레이의 전체 내용이 경고에 표시됩니다.

다음은 예입니다.

//-------------------------------------------------------------------
// Defininf the Point object
function Point(CoordenadaX, CoordenadaY) {
    // Sets the point coordinates depending on the parameters defined
    switch (arguments.length) {
        case 0:
            this.x = null;
            this.y = null;
            break;
        case 1:
            this.x = CoordenadaX;
            this.y = null;
            break;
        case 2:
            this.x = CoordenadaX;
            this.y = CoordenadaY;
            break;
    }
    // This adds the toString Method to the point object so the 
    // point can be printed using alert();
    this.toString = function() {
        return " (" + this.x + "," + this.y + ") ";
    };
 }

그런 다음 점 배열이있는 경우 :

var MyArray = [];
MyArray.push ( new Point(5,6) );
MyArray.push ( new Point(7,9) );

다음과 같이 간단히 인쇄 할 수 있습니다.

alert(MyArray);

도움이 되었기를 바랍니다!


1

이 배열을 문자열로 변환하고 형식을 지정하는 함수를 작성할 수 있습니다. 더 좋은 점 은 경고 대신 디버깅에 FireBug 를 사용 하는 것입니다.


1

Firebug (크롬 콘솔 등)를 더 잘 사용하고 console.dir ()을 사용하십시오.


1

가독성을 위해 다음을 사용할 수 있습니다.

alert(JSON.stringify(someArrayOrObj, '', 2));

JSON.stringify () 에 대한 추가 정보 .

예:

let user = {
  name: "John",
  age: 30,
  roles: {
    isAdmin: false,
    isEditor: true
  }
};

alert(JSON.stringify(user, "", 2));
/* Result:
{
  "name": "John",
  "age": 30,
  "roles": {
    "isAdmin": false,
    "isEditor": true
  }
} 
*/

-5
alert($("#form_id").serialize());

3
질문에는 javascript"프레임 워크 / 라이브러리에 대한 태그도 포함되지 않는 한 순수한 JavaScript 답변이 필요합니다"라는 태그가 지정됩니다. 그것이 사실이 아니더라도… 질문은 HTML 양식이 아니라 배열에 대해 묻는 것입니다.
— Quentin
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.