javascript - JavaScript を使用して解析する

Question

以下の文字列を django テンプレートに送信しています。

<script>
var data = '[{"a": 0}, {"b": 1}]'
</script>

1. ["a", "b"]javascriptを使用してキーを取得するにはどうすればよいですか
2. また、特定のキーの値を取得するには JavaScript 関数が必要です。

Answer 1

JSONとして解析するだけです：

var obj = JSON.parse(data);
obj[0].a // access to a
obj[1].b // access to b

Answer 2

python オブジェクトを、javascript が理解できる形式、つまりjsonに変換する必要があります。これを行うにsimplejsonは、ビューで次を使用します。

from django.utils import simplejson
from django.shortcuts import render

def some_view(request):
    ...
    python_data = [
        { 'a' : 'foo', 'b' : 'bar' },
        ...
    ]
    json_data = simplejson.dumps(python_data)
    render(request, "some_template.html", { 'data' : json_data })

そしてあなたのテンプレートで：

<script>
var data = {{ data|safe }}
</script>

(Simplejson は、通常の python オブジェクトを変換するのに適しています。ただし、QuerySet を変換する場合は、Django のシリアライザーを使用する必要があります)

Answer 3

JSONを返さないのはなぜですか？

from django.utils import simplejson

def function(request):
    if not request.is_ajax():
        raise Http404
    data = list(
        dict(
            a=0,
            b=1
        )
    )
    return HttpResponse(simplejson.dumps(data), mimetype='application/json')

JavaScript (この例では jquery を使用)

function getData(){
    $.ajax({
        type: "GET",
        url: "/your/url/to/function/",
        success: function(data){
            return data;
        }
    });
}
var data = getData();

Answer 4

1. javascriptを使用して["a"、"b"]としてキーを取得するにはどうすればよいですか

   var arrMain = [{"a": 2}, {"b": 3}],
       arrKey = []; 
   
   for (key in arrMain) { 
       if (arrMain.hasOwnProperty(key)) {
           arrKey.push(Object.keys(arrMain[key])[0]); 
       }
   } 
   
   console.log(JSON.stringify(arrKey)​); // returns ["a","b"]
   

2. また、特定のキーの値を取得するには JavaScript 関数が必要です。

   function returnValueByKey(arrMain, arrKey, lookupKey) {
       for (key in arrKey) {
           if (arrKey.hasOwnProperty(key) && arrKey[key] === lookupKey) {
              return arrMain[key][arrKey[key]]; 
           }
       }
   }
   
   console.log(returnValueByKey(arrMain, arrKey, 'a')); // returns 2