web-dev-qa-db-ja.com

javascriptで文字列をオブジェクトの配列に変換する最良の方法は？

以下の文字列をjavascriptの配列に変換したいです。

{a:12, b:c, foo:bar}

この文字列をオブジェクトの配列に変換するにはどうすればよいですか？クールなアイデアはありますか？

javascriptjqueryarraysliteralsstring-literals
28
Zeck

これを行う最善の方法は、 ダグラス・クロックフォード （JavaScriptの最大の達人の1人） 提案ここで は JSONネイティブパーサー を使用しています。これはeval（）よりも高速であるだけでなく、より安全に。

ネイティブJSONパーサーは、以下ですでに利用可能です。

  • Firefox 3.5以降
  • IE 8+
  • Opera 10.5+
  • Safari Safari 4.0.3+
  • Chrome（どのバージョンかわからない）

そして、Crockfordは json2.js と呼ばれるjavascriptで安全なフォールバックを行いました。これはeval（）アプローチの適応であり、いくつかのセキュリティビットが追加され、ネイティブJSONパーサーAPIを使用します。そのファイルをインクルードし、その最初の行を削除し、ネイティブJSONパーサーを使用する必要があります。それが存在しない場合、json2が作業を行います。

以下に例を示します。

_var myJSONString = '{ "a": 1, "b": 2 }',
    myObject = JSON.parse(myJSONString);
_

解析されると、属性aおよびbを持つオブジェクトが得られます。ご存知のように、オブジェクトをハッシュテーブルまたは 結合として扱うことができますJavaScriptのarray であるため、次のような値にアクセスできます。

_myObject['a'];
_

連想配列ではなく単純な配列だけが必要な場合は、次のようなことができます。

_var myArray = [];
for(var i in myObject) {
    myArray.Push(myObject[i]);
}
_

最後に、プレーンなJavaScriptでは必要ありませんが、 JSON spec ではメンバーのキーを二重引用符で囲む必要があります。したがって、naviteパーサーはそれなしでは機能しません。もし私があなたなら私はそれを追加しますが、それが不可能な場合はvar myObject = eval( "(" + myString + ")" );アプローチを使用してください。

78
alcuadrado

文字列はmalformedJSONであるため、JSONパーサーはそれを適切に解析できず、eval（）でさえエラーをスローします。また、配列ではなく、HashMapまたは単なるオブジェクトリテラル（不正な形式）です。オブジェクトリテラルに数値と文字列値のみが含まれ、子オブジェクト/配列は含まれない場合は、次のコードを使用できます。

function malformedJSON2Array (tar) {
    var arr = [];
    tar = tar.replace(/^\{|\}$/g,'').split(',');
    for(var i=0,cur,pair;cur=tar[i];i++){
        arr[i] = {};
        pair = cur.split(':');
        arr[i][pair[0]] = /^\d*$/.test(pair[1]) ? +pair[1] : pair[1];
    }
    return arr;
}

malformedJSON2Array("{a:12, b:c, foo:bar}");
// result -> [{a:12},{b:'c'},{foo:'bar'}]

このコードは、文字列をオブジェクトの配列（複数）に変換します。

ただし、実際には配列ではなくHashMap（連想配列）が必要な場合は、次のコードを使用します。

function malformedJSON2Object(tar) {
    var obj = {};
    tar = tar.replace(/^\{|\}$/g,'').split(',');
    for(var i=0,cur,pair;cur=tar[i];i++){
        pair = cur.split(':');
        obj[pair[0]] = /^\d*$/.test(pair[1]) ? +pair[1] : pair[1];
    }
    return obj;
}

malformedJSON2Object("{a:12, b:c, foo:bar}");
// result -> {a:12,b:'c',foo:'bar'}

オブジェクトと配列のネストを開始すると、上記のコードはさらに複雑になります。基本的に、不正なJSONをサポートするには、 JSON.js および JSON2.js を書き換える必要があります。

また、次のオプションも検討してください。これは依然として悪いことですが、JSONをHTMLタグの属性内に固定するよりもわずかに優れています。

<div id="DATA001">bla</div>
<!-- namespacing your data is even better! -->
<script>var DATA001 = {a:12,b:"c",foo:"bar"};</script>

HTMLタグの属性内に引用符を入れており、引用符をエスケープしたくないため、文字列内の引用符を省略していると仮定しています。

9
BGerrissen

最も簡単ですが、安全でない方法は次のとおりです。

eval('(' + myJSONtext + ')')

しかし、これはあらゆるJavaScriptコードを解釈するため、セキュリティホールがあります。これを防ぐには、jsonパーサーを使用します。フレームワーク（jquery、mootoolsなど）を使用している場合は、フレームワーク固有の呼び出しがあります。それらのほとんどは、 http://www.json.org/js.html で入手可能なDouglas Crawfordのパーサーに基づいています。

7
Rob

「for in」を使用できます

var myObject = {a:'12', b:'c', foo:'bar'};
var myArray = [];

for(key in myObject) {
    var value = myObject[key];
    myArray[key] = value;
}

myArray['a']; // returns 12

注：myObjectには1レベルのキーと値のペアしかないことを考慮してください。

2
Topera

JQueryを使用している場合、 $。parseJSON（） 関数があります。文字列の形式が正しくない場合は例外をスローし、「何も渡さない場合は、空の文字列、null、または未定義の場合、 'null'がparseJSONから返されます。ブラウザはJSON.parse、jQueryのネイティブ実装を提供しますそれを使用して文字列を解析します」

1
jamiebarrow

JSON.parseがトリックを行います。解析したら、それらを配列にプッシュできます。

var object = JSON.parse(param);
var array = [];
for(var i in object) {
   array.Push(object[i]);
}
0
Sarathi S