將JSON字符串/數組解析為JS對象

Question

因此，我已經使用JSON對來自C＃的對象列表進行序列化以發送給JS。 該列表似乎到達了瀏覽器，但我不知道如何正確使用它。 到達的是字符串是有意義的，但實際上似乎是一個數組...我不確定，我不知道如何使用它。

這是我的JS

var data;
function testFunc() {
    d3.select("#stuff").append("h2").text(data[0].source);   
}

當我發送單個對象時，上述JS會正確打印出該值。 這是C＃

protected void btnTest_Click(object sender, EventArgs e)
        {
            string json = JsonConvert.SerializeObject(new testClass(66,77));
            ClientScript.RegisterArrayDeclaration("data", json);
            ScriptManager.RegisterStartupScript(this.Page, Page.GetType(), "id", "testFunc()", true);
        }

當我查看瀏覽器的調試器時，執行上述操作時會在下面看到此行：

var data =  new Array({"target":66,"source":77});

這就是我可以在上面的JS中打印值77的原因

令人討厭的是，我想發送此完全相同的對象的列表。 所以我用下面的C＃

List<TestGraph.Models.testClass> L = new List<TestGraph.Models.testClass>()
private List<testClass> fill()
        {

            for (int i = 0; i < 10; i++)
            {
                L.Add(new testClass(i, i+1));
            }
            return L;
        }
        protected void btnTest_Click(object sender, EventArgs e)
        {
            fill();
            string json = JsonConvert.SerializeObject(L);
            ClientScript.RegisterArrayDeclaration("data", json);
            ScriptManager.RegisterStartupScript(this.Page, Page.GetType(), "id", "testFunc()", true);
        }

當我使用相同的JS時，它不會打印出任何內容，但是列表正進入JS，因為當我查看瀏覽器的調試器時會看到以下內容：

var data =  new Array([{"target":0,"source":1},{"target":1,"source":2},{"target":2,"source":3},{"target":3,"source":4},{"target":4,"source":5},{"target":5,"source":6},{"target":6,"source":7},{"target":7,"source":8},{"target":8,"source":9},{"target":9,"source":10}]);

那么，既然數據列表在瀏覽器中，該如何使用呢？

PS並不是很必要，但是如果有人好奇的話，這里是我的testClass

public class testClass
    {
        public int target { get; set; }
        public int source { get; set; }
        public testClass(int t, int s)
        {
            target = t;
            source = s;
        }
        public testClass()
        {

        }
    }

編輯

對於那些建議我已經嘗試使用JSON.parse（data）

我用這個：

var data;
var data2 = JSON.parse(data);
function testFunc() {
    d3.select("#stuff").append("h2").text(data2[1].source);
}

編輯

因此，當我逐步執行C＃時，代碼行如下：

JsonConvert.SerializeObject(L);

將以下字符串放入json變量：

"[{\"target\":0,\"source\":1},{\"target\":1,\"source\":2},{\"target\":2,\"source\":3},{\"target\":3,\"source\":4},{\"target\":4,\"source\":5},{\"target\":5,\"source\":6},{\"target\":6,\"source\":7},{\"target\":7,\"source\":8},{\"target\":8,\"source\":9},{\"target\":9,\"source\":10}]"

然后理論上我打電話給：

ClientScript.RegisterArrayDeclaration("data", json);

它應該將上面的字符串放入js中的“ data”變量中，但是當我對它進行警告時：

var data;
function testFunc() {
    alert(data);
}

出現的是

[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

我也在C＃中嘗試了另一種方法：

protected void btnTest_Click(object sender, EventArgs e)
        {
            fill();
            string json = JsonConvert.SerializeObject(L);
            Response.Write(string.Concat("<input id='data' type='hidden' value='", json, "' />"));
            ScriptManager.RegisterStartupScript(this.Page, Page.GetType(), "id", "testFunc()", true);
        }

需要對JS進行以下更改

var field = document.getElementById('data');
var data = JSON.parse(field.value);
function testFunc() {
    alert(data);
}

當我嘗試這種新方法時，會得到與以前相同的結果：

[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

然后根據上述方法對字段var進行了第二次測試，得到了

[object HTMLInputElement]

Answer 1

只需使用JSON.parse（）

例如：

    var parsed = JSON.parse('[{"target":0,"source":1},{"target":1,"source":2},{"target":2,"source":3},{"target":3,"source":4},{"target":4,"source":5},{"target":5,"source":6},{"target":6,"source":7},{"target":7,"source":8},{"target":8,"source":9},{"target":9,"source":10}]');
    console.log(parsed[1].target);