1

我有这个工作：

   cars={
        ford:{
            ford_car_one:'Ford Car One',
            ford_car_two:'Ford Car Two'
        },
        toyota:{
            toyota_car_one:'Toyota Car One',
            toyota_car_two:'Toyota Car Two'
        }
    };

    $('#cars_company').on('change', function(){
        $('#cars').html('');
        $.each(cars[$(this).val()], function(k, v){
            $('<option></option>').val(k).text(v)
            .appendTo($('#cars'));
        });
    });

$.each(cars[$.....现在，如果我的 javascript 对象如下所示，我将如何执行代码块：

cars = [
  { name : 'ford', types: { name : 'ford car one', name : 'ford car 2'},
  { name : 'toyota', types: { name : 'toyota car one', name : 'toyota car 2'},
];

两个汽车对象有什么区别？

4

4 回答 4

3

问题 1

两个汽车对象有什么区别？

如果我没记错的话，这两个对象之间的区别在于，第一个对象是一个对象，其中包含其他对象作为属性，而第二个对象（暂时忽略无效语法）是一个包含 2 个元素的数组，每个元素包含 2 个属性.

对象 1

cars={
    ford:{
        ford_car_one:'Ford Car One',
        ford_car_two:'Ford Car Two'
    },
    toyota:{
        toyota_car_one:'Toyota Car One',
        toyota_car_two:'Toyota Car Two'
    }
};

这是一个名为 cars 的对象，它有 2 个属性ford和toyota. 每个属性都是另一个对象，每个对象有 2 个属性。这个对象在 chrome 的控制台输出中看起来像这样：

在此处输入图像描述

对象 2

cars = [
  { name : 'ford', types: { name : 'ford car one', name : 'ford car 2'},
  { name : 'toyota', types: { name : 'toyota car one', name : 'toyota car 2'},
];

这个实例的语法搞砸了，应该是（假设它的当前形式是有意的，但我不推荐它！）

var cars = [
    {
    name: 'ford',
    types: {
        name: 'ford car one',
        name: 'ford car 2'
    }},
    {
    name: 'toyota',
    types: {
        name: 'toyota car one',
        name: 'toyota car 2'
    }}];

在本例cars中是一个包含 2 个元素的数组。每个元素都是具有 和 属性的匿名name对象types。types有 2 个同名的属性，即name，这意味着最后指定name的将覆盖第一个name。导致：

在此处输入图像描述

正如您仅在上面的结果中看到的那样ford car 2，toyota car 2它们保留在内部name属性中。

演示- 显示两个current对象的输出。

问题2

现在，如果我的 javascript 对象看起来像上面的对象 2，我将如何执行 $.each(cars[$..... 代码块。

首先，您必须修复语法错误，然后很可能重新考虑如何填充对象，看到 name 属性会被下一个属性覆盖。

假设您的对象现在有效：

var cars = [
    {
    name: 'ford',
    types: [
        'ford car one',
        'ford car 2'
        ]},
    {
    name: 'toyota',
    types: [
        'toyota car one',
        'toyota car 2'
    ]}];

导致：

在此处输入图像描述

您现在可以执行以下操作：

$(cars).each(function(){
    // only declared for clarity, not needed, using this is fine.
    var car = this;

    $result.append("- " + car.name + "<br />");

    $(this.types).each(function(){
        // only declared for clarity, not needed, using this is fine.
        var type = this;

        $result.append("-- " + type + "<br />");
    });

    $result.append("<br />");
});

演示.each()-使用suggested对象迭代汽车和类型

关于性能的旁注。虽然.each()很好，但您会发现使用嵌套标准for(i=0; i < cars.length; i++)等会执行得更快。但是.each()非常好并且运行速度足够快，差异很小。

于 2012-08-23T21:26:28.977 回答
2

您定义的以下结构无效，

汽车对象（来自您的代码）：

cars={
    ford:{
        ford_car_one:'Ford Car One',
        ford_car_two:'Ford Car Two'
    },
    toyota:{
        toyota_car_one:'Toyota Car One',
        toyota_car_two:'Toyota Car Two'
    }
};

汽车对象：（无效语法）

cars = [
  //                         v--- duplicate keys ---v       missing }--v  
  { name : 'ford', types: { name : 'ford car one', name : 'ford car 2'} ,
  { name : 'toyota', types: { name : 'toyota car one', name : 'toyota car 2'} ,
];

两个汽车对象之间的差异

  1. 第二个结构在语法上是错误的。

    一种。中的重复键types。（键名在类型对象内重复）

    湾。失踪}

  2. 您缺少ford_car_one第二个结构中的信息（来自第一个结构：）ford_car_one:'Ford Car One'此键用作脚本中设置的值。( $('<option></option>').val(k))

如果您打算更改，请尝试以下建议的更简单的结构：

cars = {
  'ford': ['ford car one', 'ford car 2'],
  'toyota': ['toyota car one', 'toyota car 2'],
};

假设上述建议的结构，您需要更改方法如下，

$('#cars_company').on('change', function(){
   $('#cars').html('');
   var selVal = $(this).val();

   $.each(cars[selVal ], function(idx, val){
      $('<option></option>')
        .val(idx) //Change val as you want ex: selVal + '_car_' + idx => ford_car_1
        .text(val)
        .appendTo($('#cars'));
   });
});

对原始脚本的更改...

原始函数中的选项值使用对象中的键（例如：ford_car_one:'Ford Car One'），但您的结构没有信息，因此您需要构建信息。请参阅上面代码中的注释。

.val(idx) //Change val as you want ex: selVal + '_car_' + idx => ford_car_1
于 2012-08-23T21:15:25.817 回答
0 
jQuery.each(cars,function(key,val){
        jQuery.each(val,function(ke2,va2)
           {console.log(va2);
        });
});

这就是如何循环它们都返回。

你的对象没有正确形成它应该像..

var cars = [
    {
        "name": "ford",
        "types": {
            "name": "fordcar2"
        }
    },
    {
        "name": "toyota",
        "types": {
            "name": "toyotacar2"
        }
    }
];

或者

[
        {
            "name": "ford",
            "types": ["fordcar2","fordcar4","fordcar3"]


        },
        {
            "name": "toyota",
            "types": ["fordcar2","fordcar4","fordcar3"]
        }
    ];

我会做这样的事情，这段代码只是一个帮助你的示例，而不是为你做的工作！

于 2012-08-23T21:03:07.730 回答
0

好吧，如果你想用普通的 ole javascript 方式来做，那就是：

对于第一个，

for(var i = 0; i < cars.length(); i++)  //loops through car companies
{
    alert(cars[i] + ":");
    for(var j = 0; i < cars[i].length(); i++)  //loops through models
    {
        alert(cars[i][j]);  //alerts the each *property* of each model, which will be the name of each model
    }
}

第二，你会这样做：

for(var i = 0; i< cars.length(); i++)  //loops through car companies
{
    alert(cars[i].name);
    for(var j = 0; j < cars[i].types.length(); j++)  //loops through car models, but has to use the correct property to do so
    {
        alert(cars[i].types[j]);
    }
}

但请注意，这将是一个非常烦人的警报数量。

于 2012-08-23T21:15:54.980 回答