javascript - 如何在javascript中创建嵌套的对象列表

Question

我正在尝试Product在 Javascript 中创建实例，而不是使用[webmethod].

[WebMethod]
public static void SetProduct(Product product)
{    
     // i want a product instance    
}

以下是Product我正在尝试创建的课程：

public class Product
{
    public Type Type { get; set; }
    public Foo Foo { get; set; }
    public List<Bar> Bars { get; set; }
}

public class Type
{
    public string ID { get; set; }
}

public class Foo
{
    public string ID { get; set; }
    public string Color { get; set; }
}

public class Bar
{
    public string Name { get; set; }
}

我可以创建但不能使用 Javascript：（有关更多详细信息，请参阅我在代码中的评论Type）FooList<Bar>

Javascript

function setProduct() {
    var product = {};
    product.Type = {};
    product.Foo = {};

    product.Type.ID = 'typeID';
    product.Foo.ID = 'fooID';
    product.Foo.Color = 'fooColor';

    //here is my question how can create List<Bar> Bars and add it to product item???

    $.ajax({
        type: "POST",
        url: "Default.aspx/SetProduct",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        async: false,
        data: "{product:" + JSON.stringify(product) + "}",
    });
}

Answer 1

JavaScript 不知道 aList<T>是什么。它只知道如何制作数组。因此，您必须构造一个Bars 数组并将其传递到 JSON 中。

幸运的是，这是一个简单的修复：

product.Bars = [
    { Name: "bar 1" },
    { Name: "bar 2" },
    { Name: "bar 3" },
];

---

以上可能就是你所需要的。我很确定 ASP.NET 会足够聪明，可以自动将其转换Bar[]为一个List<Bar>，但以防万一：

public class Product
{
    public Type Type { get; set; }
    public Foo Foo { get; set; }
    public IEnumerable<Bar> Bars { get; set; }
}

然后，如果您仍然需要List<T>功能，只需将数组转换为 WebMethod 中的列表：

[WebMethod]
public static void SetProduct(Product product)
{    
     var list = product.Bars.ToList();
     product.Bars = list;
     return product;
}

现在您仍然可以访问这些不错的List<T>方法：

((List<Bar>)product).Add(new Bar() { Name = "bar 4" });

Answer 2

// create an array
product.Bars = [];

// add an element to the array
product.Bars.push({
    Name: "Foo"
});

或者，您也可以使用元素初始化数组：

// create and initialize array
product.Bars = [{Name:"Foo"}, {Name:"Bar"}];

Answer 3

使用数组，并使用 . 将项目添加到数组中array.push。例如：

product.Bars = [];
product.Bars.push({ Name: "foo" });