객체를 문자열로 변환

JavaScript 객체를 문자열로 어떻게 변환 할 수 있습니까?

예:

var o = {a:1, b:2}
console.log(o)
console.log('Item: ' + o)

산출:

Object {a = 1, b = 2} // 매우 읽기 쉬운 출력 :)
항목 : [object Object] // 안에 무엇이 있는지 모릅니다 :(

JSON.stringify객체의 변수 집합을 JSON 문자열로 변환하는을 사용 하는 것이 좋습니다 . 대부분의 최신 브라우저는 기본적으로이 방법을 지원하지만 지원하지 않는 브라우저의 경우 JS 버전을 포함 할 수 있습니다 .

var obj = {
  name: 'myObj'
};

JSON.stringify(obj);

자바 스크립트 문자열 () 함수 사용

 String(yourobject); //returns [object Object]

또는 stringify ()

JSON.stringify(yourobject)

물론 객체를 문자열로 변환하려면 다음과 같은 고유 한 방법을 사용해야합니다.

function objToString (obj) {
    var str = '';
    for (var p in obj) {
        if (obj.hasOwnProperty(p)) {
            str += p + '::' + obj[p] + '\n';
        }
    }
    return str;
}

실제로, 위는 일반적인 접근 방식을 보여줍니다. http://phpjs.org/functions/var_export:578 또는 http://phpjs.org/functions/var_dump:604 와 같은 것을 사용하고 싶을 수도 있습니다 .

또는 메서드 (객체의 속성으로 함수)를 사용하지 않는 경우 새로운 표준을 사용할 수 있습니다 (그러나 이전 브라우저에서는 구현할 수는 없지만 지원하는 유틸리티도 찾을 수 있음), JSON .stringify (). 그러나 객체가 JSON으로 직렬화 할 수없는 함수 또는 다른 속성을 사용하는 경우 다시 작동하지 않습니다.

로 간단하게 유지 console하려면 대신 쉼표를 사용할 수 있습니다 +. 는 +쉼표 콘솔에 별도로 표시하는 반면, 문자열로 개체를 변환하려고합니다.

예:

var o = {a:1, b:2};
console.log(o);
console.log('Item: ' + o);
console.log('Item: ', o);   // :)

산출:

Object { a=1, b=2}           // useful
Item: [object Object]        // not useful
Item:  Object {a: 1, b: 2}   // Best of both worlds! :)

참조 : https://developer.mozilla.org/en-US/docs/Web/API/Console.log

편집 이 답변은 Internet Explorer에서 작동하지 않으므로 사용하지 마십시오. 게리 챔버 솔루션을 사용하십시오 .

toSource () 는 JSON으로 작성할 함수입니다.

var object = {};
object.first = "test";
object.second = "test2";
alert(object.toSource());

하나의 옵션 :

console.log('Item: ' + JSON.stringify(o));

또 다른 옵션 (같은 soktinpk은 콘솔이 IMO 디버깅을 위해 더 나은 의견에서 지적), 및 :

console.log('Item: ', o);

여기에있는 해결책 중 어느 것도 나를 위해 일하지 않았습니다. JSON.stringify는 많은 사람들이 말하는 것처럼 보이지만 함수를 잘라 내고 테스트 할 때 시도한 일부 객체 및 배열에서는 꽤 깨진 것처럼 보입니다.

적어도 Chrome에서 작동하는 자체 솔루션을 만들었습니다. Google에서 찾아 보는 사람이 찾을 수 있도록 여기에 게시하십시오.

//Make an object a string that evaluates to an equivalent object
//  Note that eval() seems tricky and sometimes you have to do
//  something like eval("a = " + yourString), then use the value
//  of a.
//
//  Also this leaves extra commas after everything, but JavaScript
//  ignores them.
function convertToText(obj) {
    //create an array that will later be joined into a string.
    var string = [];

    //is object
    //    Both arrays and objects seem to return "object"
    //    when typeof(obj) is applied to them. So instead
    //    I am checking to see if they have the property
    //    join, which normal objects don't have but
    //    arrays do.
    if (typeof(obj) == "object" && (obj.join == undefined)) {
        string.push("{");
        for (prop in obj) {
            string.push(prop, ": ", convertToText(obj[prop]), ",");
        };
        string.push("}");

    //is array
    } else if (typeof(obj) == "object" && !(obj.join == undefined)) {
        string.push("[")
        for(prop in obj) {
            string.push(convertToText(obj[prop]), ",");
        }
        string.push("]")

    //is function
    } else if (typeof(obj) == "function") {
        string.push(obj.toString())

    //all other values can be done with JSON.stringify
    } else {
        string.push(JSON.stringify(obj))
    }

    return string.join("")
}

편집 :이 코드를 개선 할 수는 있지만 결코 그렇게하지는 못했습니다. 사용자 andrey는 다음 과 같은 의견으로 개선을 제안했습니다 .

여기에 'null'과 'undefined'를 처리 할 수 ​​있고 약간의 쉼표를 추가하지 않는 약간 변경된 코드가 있습니다.

전혀 확인하지 않았으므로 위험을 감수하십시오. 의견으로 추가 개선 사항을 제안하십시오.

콘솔로 출력하는 경우을 사용할 수 있습니다 console.log('string:', obj). 쉼표를 주목하십시오 .

객체가 부울, 날짜, 문자열, 숫자 등이라는 것을 알고있는 경우 javascript String () 함수는 정상적으로 작동합니다. 최근에 jquery의 $ .each 함수에서 오는 값을 처리하는 데 유용한 것으로 나타났습니다.

예를 들어 다음은 "value"의 모든 항목을 문자열로 변환합니다.

$.each(this, function (name, value) {
  alert(String(value));
});

자세한 내용은 여기 :

http://www.w3schools.com/jsref/jsref_string.asp

var obj={
name:'xyz',
Address:'123, Somestreet'
 }
var convertedString=JSON.stringify(obj) 
 console.log("literal object is",obj ,typeof obj);
 console.log("converted string :",convertedString);
 console.log(" convertedString type:",typeof convertedString);

나는 이것을 찾고 있었고 들여 쓰기로 깊은 재귀 적 인 것을 썼다.

function objToString(obj, ndeep) {
  if(obj == null){ return String(obj); }
  switch(typeof obj){
    case "string": return '"'+obj+'"';
    case "function": return obj.name || obj.toString();
    case "object":
      var indent = Array(ndeep||1).join('\t'), isArray = Array.isArray(obj);
      return '{['[+isArray] + Object.keys(obj).map(function(key){
           return '\n\t' + indent + key + ': ' + objToString(obj[key], (ndeep||1)+1);
         }).join(',') + '\n' + indent + '}]'[+isArray];
    default: return obj.toString();
  }
}

사용법 : objToString({ a: 1, b: { c: "test" } })

디버깅을 위해 객체를보고 싶다면

var o = {a:1, b:2} 
console.dir(o)

1.

JSON.stringify(o);

항목 : { "a": "1", "b": "2"}

2.

var o = {a:1, b:2};
var b=[]; Object.keys(o).forEach(function(k){b.push(k+":"+o[k]);});
b="{"+b.join(', ')+"}";
console.log('Item: ' + b);

항목 : {a : 1, b : 2}

JSON 메소드는 Gecko 엔진 .toSource () 프리미티브보다 열등합니다.

비교 테스트 는 SO 기사 응답 을 참조하십시오 .

또한 위 의 답변 은 http://forums.devshed.com/javascript-development-115/tosource-with-arrays-in-ie-386109.html JSON과 같이 (다른 기사 http : // www.davidpirek.com/blog/object-to-string-how-to-deserialize-json "ExtJs JSON 인코딩 소스 코드" 를 통해 사용 )는 순환 참조를 처리 할 수없고 불완전합니다. 아래 코드는 (스푸핑) 제한 (콘텐츠가없는 배열 및 객체를 처리하도록 수정)을 보여줍니다.

( //forums.devshed.com/ ... / tosource-with-arrays-in-ie-386109의 코드에 직접 링크 )

javascript:
Object.prototype.spoof=function(){
    if (this instanceof String){
      return '(new String("'+this.replace(/"/g, '\\"')+'"))';
    }
    var str=(this instanceof Array)
        ? '['
        : (this instanceof Object)
            ? '{'
            : '(';
    for (var i in this){
      if (this[i] != Object.prototype.spoof) {
        if (this instanceof Array == false) {
          str+=(i.match(/\W/))
              ? '"'+i.replace('"', '\\"')+'":'
              : i+':';
        }
        if (typeof this[i] == 'string'){
          str+='"'+this[i].replace('"', '\\"');
        }
        else if (this[i] instanceof Date){
          str+='new Date("'+this[i].toGMTString()+'")';
        }
        else if (this[i] instanceof Array || this[i] instanceof Object){
          str+=this[i].spoof();
        }
        else {
          str+=this[i];
        }
        str+=', ';
      }
    };
    str=/* fix */(str.length>2?str.substring(0, str.length-2):str)/* -ed */+(
        (this instanceof Array)
        ? ']'
        : (this instanceof Object)
            ? '}'
            : ')'
    );
    return str;
  };
for(i in objRA=[
    [   'Simple Raw Object source code:',
        '[new Array, new Object, new Boolean, new Number, ' +
            'new String, new RegExp, new Function, new Date]'   ] ,

    [   'Literal Instances source code:',
        '[ [], {}, true, 1, "", /./, function(){}, new Date() ]'    ] ,

    [   'some predefined entities:',
        '[JSON, Math, null, Infinity, NaN, ' +
            'void(0), Function, Array, Object, undefined]'      ]
    ])
alert([
    '\n\n\ntesting:',objRA[i][0],objRA[i][1],
    '\n.toSource()',(obj=eval(objRA[i][1])).toSource(),
    '\ntoSource() spoof:',obj.spoof()
].join('\n'));

표시되는 내용 :

testing:
Simple Raw Object source code:
[new Array, new Object, new Boolean, new Number, new String,
          new RegExp, new Function, new Date]

.toSource()
[[], {}, (new Boolean(false)), (new Number(0)), (new String("")),
          /(?:)/, (function anonymous() {}), (new Date(1303248037722))]

toSource() spoof:
[[], {}, {}, {}, (new String("")),
          {}, {}, new Date("Tue, 19 Apr 2011 21:20:37 GMT")]

과

testing:
Literal Instances source code:
[ [], {}, true, 1, "", /./, function(){}, new Date() ]

.toSource()
[[], {}, true, 1, "", /./, (function () {}), (new Date(1303248055778))]

toSource() spoof:
[[], {}, true, 1, ", {}, {}, new Date("Tue, 19 Apr 2011 21:20:55 GMT")]

과

testing:
some predefined entities:
[JSON, Math, null, Infinity, NaN, void(0), Function, Array, Object, undefined]

.toSource()
[JSON, Math, null, Infinity, NaN, (void 0),
       function Function() {[native code]}, function Array() {[native code]},
              function Object() {[native code]}, (void 0)]

toSource() spoof:
[{}, {}, null, Infinity, NaN, undefined, {}, {}, {}, undefined]

기존 답변에 실제로 하나의 쉬운 옵션 (최근 브라우저 및 Node.js)이 누락되었습니다.

console.log('Item: %o', o);

JSON.stringify()특정 제한 사항 (예 : 원형 구조) 이 있으므로 이것을 선호합니다 .

JSON은 functions- replacer에 도움이되는 두 번째 매개 변수를 허용하는 것으로 보이며 가장 우아한 방식으로 변환하는 문제를 해결합니다.

JSON.stringify(object, (key, val) => {
    if (typeof val === 'function') {
      return String(val);
    }
    return val;
  });

문자열, 객체 및 배열 만 신경 쓰는 경우 :

function objectToString (obj) {
        var str = '';
        var i=0;
        for (var key in obj) {
            if (obj.hasOwnProperty(key)) {
                if(typeof obj[key] == 'object')
                {
                    if(obj[key] instanceof Array)
                    {
                        str+= key + ' : [ ';
                        for(var j=0;j<obj[key].length;j++)
                        {
                            if(typeof obj[key][j]=='object') {
                                str += '{' + objectToString(obj[key][j]) + (j > 0 ? ',' : '') + '}';
                            }
                            else
                            {
                                str += '\'' + obj[key][j] + '\'' + (j > 0 ? ',' : ''); //non objects would be represented as strings
                            }
                        }
                        str+= ']' + (i > 0 ? ',' : '')
                    }
                    else
                    {
                        str += key + ' : { ' + objectToString(obj[key]) + '} ' + (i > 0 ? ',' : '');
                    }
                }
                else {
                    str +=key + ':\'' + obj[key] + '\'' + (i > 0 ? ',' : '');
                }
                i++;
            }
        }
        return str;
    }

stringify-objectyeoman 팀이 만든 좋은 npm 라이브러리입니다 : https://www.npmjs.com/package/stringify-object

npm install stringify-object

그때:

const stringifyObject = require('stringify-object');
stringifyObject(myCircularObject);

분명히 실패 할 원형 물체가있는 경우에만 흥미 롭습니다. JSON.stringify();

jQuery-JSON 플러그인 살펴보기

기본적으로 JSON.stringify를 사용하지만 브라우저가 구현하지 않으면 자체 파서로 넘어갑니다.

파이어 폭스는 일부 객체를 화면 객체로 문자열 화하지 않습니다. :와 같은 결과를 원한다면 : JSON.stringify(obj):

function objToString (obj) {
    var tabjson=[];
    for (var p in obj) {
        if (obj.hasOwnProperty(p)) {
            tabjson.push('"'+p +'"'+ ':' + obj[p]);
        }
    }  tabjson.push()
    return '{'+tabjson.join(',')+'}';
}

중첩되지 않은 객체의 경우 :

Object.entries(o).map(x=>x.join(":")).join("\r\n")

var o = {a:1, b:2};

o.toString=function(){
  return 'a='+this.a+', b='+this.b;
};

console.log(o);
console.log('Item: ' + o);

Javascript v1.0은 모든 곳에서 (IE까지도) 작동하므로 기본 접근 방식이며 디버깅 및 프로덕션 환경에서 객체를 매우 비용 효율적으로 볼 수 있습니다 https://developer.mozilla.org/en/docs/Web/JavaScript/Reference / Global_Objects / Object / toString

유용한 예

var Ship=function(n,x,y){
  this.name = n;
  this.x = x;
  this.y = y;
};
Ship.prototype.toString=function(){
  return '"'+this.name+'" located at: x:'+this.x+' y:'+this.y;
};

alert([new Ship('Star Destroyer', 50.001, 53.201),
new Ship('Millennium Falcon', 123.987, 287.543),
new Ship('TIE fighter', 83.060, 102.523)].join('\n'));//now they can battle!
//"Star Destroyer" located at: x:50.001 y:53.201
//"Millennium Falcon" located at: x:123.987 y:287.543
//"TIE fighter" located at: x:83.06 y:102.523

또한 보너스로

function ISO8601Date(){
  return this.getFullYear()+'-'+(this.getMonth()+1)+'-'+this.getDate();
}
var d=new Date();
d.toString=ISO8601Date;//demonstrates altering native object behaviour
alert(d);
//IE6   Fri Jul 29 04:21:26 UTC+1200 2016
//FF&GC Fri Jul 29 2016 04:21:26 GMT+1200 (New Zealand Standard Time)
//d.toString=ISO8601Date; 2016-7-29

lodash를 사용할 수 있다면 다음과 같이 할 수 있습니다.

> var o = {a:1, b:2};
> '{' + _.map(o, (value, key) => key + ':' + value).join(', ') + '}'
'{a:1, b:2}'

lodash map()를 사용하면 객체를 반복 할 수도 있습니다. 모든 키 / 값 항목을 문자열 표현에 매핑합니다.

> _.map(o, (value, key) => key + ':' + value)
[ 'a:1', 'b:2' ]

그리고 join()배열 항목을 함께 넣으십시오.

ES6 템플릿 문자열을 사용할 수 있으면 다음과 같이 작동합니다.

> `{${_.map(o, (value, key) => `${key}:${value}`).join(', ')}}`
'{a:1, b:2}'

이것은 Object를 통해 재귀되지 않습니다.

> var o = {a:1, b:{c:2}}
> _.map(o, (value, key) => `${key}:${value}`)
[ 'a:1', 'b:[object Object]' ]

노드util.inspect() 처럼 :

> util.inspect(o)
'{ a: 1, b: { c: 2 } }'

Dojo Javascript 프레임 워크를 사용중인 경우이를 수행하는 함수가 이미 있습니다. dojo.toJson () 그렇게 사용됩니다.

var obj = {
  name: 'myObj'
};
dojo.toJson(obj);

문자열을 반환합니다. 객체를 json 데이터로 변환하려면 true의 두 번째 매개 변수를 추가하십시오.

dojo.toJson(obj, true);

http://dojotoolkit.org/reference-guide/dojo/toJson.html#dojo-tojson

/*
    This function is as JSON.Stringify (but if you has not in your js-engine you can use this)
    Params:
        obj - your object
        inc_ident - can be " " or "\t".
        show_types - show types of object or not
        ident - need for recoursion but you can not set this parameter.
*/
function getAsText(obj, inc_ident, show_types, ident) {
    var res = "";
    if (!ident)
        ident = "";
    if (typeof(obj) == "string") {
        res += "\"" + obj + "\" ";
        res += (show_types == true) ? "/* typeobj: " + typeof(obj) + "*/" : "";
    } else if (typeof(obj) == "number" || typeof(obj) == "boolean") {
        res += obj;
        res += (show_types == true) ? "/* typeobj: " + typeof(obj) + "*/" : "";
    } else if (obj instanceof Array) {
        res += "[ ";
        res += show_types ? "/* typeobj: " + typeof(obj) + "*/" : "";
        res += "\r\n";
        var new_ident = ident + inc_ident;
        var arr = [];
        for(var key in obj) {
            arr.push(new_ident + getAsText(obj[key], inc_ident, show_types, new_ident));
        } 
        res += arr.join(",\r\n") + "\r\n";
        res += ident + "]";
    } else {
        var new_ident = ident + inc_ident;      
        res += "{ ";
        res += (show_types == true) ? "/* typeobj: " + typeof(obj) + "*/" : "";
        res += "\r\n";
        var arr = [];
        for(var key in obj) {
            arr.push(new_ident + '"' + key + "\" : " + getAsText(obj[key], inc_ident, show_types, new_ident));
        }
        res += arr.join(",\r\n") + "\r\n";
        res += ident + "}\r\n";
    } 
    return res;
};

사용 예 :

var obj = {
    str : "hello",
    arr : ["1", "2", "3", 4],
b : true,
    vobj : {
        str : "hello2"
    }
}

var ForReading = 1, ForWriting = 2;
var fso = new ActiveXObject("Scripting.FileSystemObject")
f1 = fso.OpenTextFile("your_object1.txt", ForWriting, true)
f1.Write(getAsText(obj, "\t"));
f1.Close();

f2 = fso.OpenTextFile("your_object2.txt", ForWriting, true)
f2.Write(getAsText(obj, "\t", true));
f2.Close();

your_object1.txt :

{ 
    "str" : "hello" ,
    "arr" : [ 
        "1" ,
        "2" ,
        "3" ,
        4
    ],
    "b" : true,
    "vobj" : { 
        "str" : "hello2" 
    }

}

your_object2.txt :

{ /* typeobj: object*/
    "str" : "hello" /* typeobj: string*/,
    "arr" : [ /* typeobj: object*/
        "1" /* typeobj: string*/,
        "2" /* typeobj: string*/,
        "3" /* typeobj: string*/,
        4/* typeobj: number*/
    ],
    "b" : true/* typeobj: boolean*/,
    "vobj" : { /* typeobj: object*/
        "str" : "hello2" /* typeobj: string*/
    }

}

귀하의 예를 들어, console.log("Item:",o) 가장 쉬운 것 같아요 . 그러나 console.log("Item:" + o.toString) 작동합니다.

첫 번째 방법을 사용하면 콘솔에서 멋진 드롭 다운을 사용하므로 긴 객체가 잘 작동합니다.

function objToString (obj) {
    var str = '{';
    if(typeof obj=='object')
      {

        for (var p in obj) {
          if (obj.hasOwnProperty(p)) {
              str += p + ':' + objToString (obj[p]) + ',';
          }
      }
    }
      else
      {
         if(typeof obj=='string')
          {
            return '"'+obj+'"';
          }
          else
          {
            return obj+'';
          }
      }



    return str.substring(0,str.length-1)+"}";
}

이 예제가 모두 객체 배열을 작업하는 모든 사람들에게 도움이되기를 바랍니다.

var data_array = [{
                    "id": "0",
                    "store": "ABC"
                },{
                    "id":"1",
                    "store":"XYZ"
                }];
console.log(String(data_array[1]["id"]+data_array[1]["store"]));

join ()을 Object로 재생하지 않으면.

const obj = {one:1, two:2, three:3};
let arr = [];
for(let p in obj)
    arr.push(obj[p]);
const str = arr.join(',');

인라인 표현식 유형 상황에서 변수를 문자열로 변환하는 미니멀리스트 방법을 원한다면 ''+variablename골프를 타는 것이 가장 좋습니다.

'variablename'이 객체이고 빈 문자열 연결 작업을 사용 [object Object]하는 경우 성가신 을 제기 할 수 있습니다.이 경우 JSON.stringify게시 된 질문에 대해 Gary C.의 엄청나게 반향 된 답변을 원할 수 있습니다.이 정보는 Mozilla의 개발자 네트워크에서 읽을 수 있습니다 상단의 해당 답변 링크에서 .