Question

我正在创建一个对象（dataObj），在$ getJSON中返回其中的几个项目：

var cities = ['london', 'paris', 'munich', 'geneva', 'prague', 'vienna', 'barcelona', 'istanbul'],
    totalCities = cities.length,
    i = 0,
    $container = $('#cities'),
    htmlFragment,
    data,
    obj,
    dataObj = {
        cities:[]
    };

function appendData() {

    var city = cities[i],
        locationQuery = escape("select item from weather.forecast where woeid in (select woeid from geo.places where text='" + city + "') and u='c'"),
        locationUrl = "https://query.yahooapis.com/v1/public/yql?q=" + locationQuery + "&format=json&callback=?";

    if ( i === cities.length ) { return };

    $.getJSON( locationUrl, function( data ) {
        var condition = data.query.results.channel[0].item.condition.text,
            temperature = data.query.results.channel[0].item.condition.temp;

        obj = {
            city: city,
            condition: condition,
            temperature: temperature
        };

            dataObj.cities.push(obj);

        // $container.append(html);

        appendData();

    });

    i = i + 1;
}

appendData();

var source   = $("#some-template").html();
var template = Handlebars.compile(source);

var dataObjExample = { cities: [
        {city: "london", condition: "Cloudy", temperature: "8" },
        {city: "paris", condition: "sunny", temperature: "5" },
        {city: "munich", condition: "Rainy", temperature: "3" }
    ]};

console.log(dataObj);
console.log('dataObj:' + dataObj.cities.length);

console.log(dataObjExample);
console.log('dataObjExample:' + dataObjExample.cities.length);

$("#content-placeholder").html(template( dataObj ));

当我在console.log上时，dataObj.cities看起来很好，并且有很多项目，但是长度是0，我确信这是我的问题的根源。我一直在摆弄并寻找解决方案的时间，但没有用。任何想法聪明的人？

更新

道歉，昨晚在我神志不清的状态下，我打算写一下：dataObj.cities。

我已经为JS添加了2个console.logs。一个是真实数据，并将dataObj.cities.length的长度显示为0.另一个是手动创建对象并将dataObjExample.cities.length正确显示为3。

请在此网址查看控制台：https://dl.dropboxusercontent.com/u/36374911/weather%20app/index.html

提前致谢！

Answer 1

像“dataObj”这样的普通对象没有.length属性（除非你制作/维护一个）。这是一个数组的东西，它只适用于数字索引属性。

现在，dataObj.cities.length将为您提供该数组的长度。

Answer 2

'appendData'函数是一个递归函数，它与for循环的工作方式不同。

当我=== cities.length调用另一个函数时，它将访问你已完成的数组。

$（document）.ready（function（）{

var cities = ['london', 'paris', 'munich', 'geneva', 'prague', 'vienna', 'barcelona', 'istanbul'],
    totalCities = cities.length,
    i = 0,
    $container = $('#cities'),
    htmlFragment,
    data,
    obj,
    dataObj = {
        cities:[]
    };

function appendData() {

    var city = cities[i],
        locationQuery = escape("select item from weather.forecast where woeid in (select woeid from geo.places where text='" + city + "') and u='c'"),
        locationUrl = "https://query.yahooapis.com/v1/public/yql?q=" + locationQuery + "&format=json&callback=?";

    if ( i === cities.length ) { 
        buildTemplate();
        return;
    };

    $.getJSON( locationUrl, function( data ) {
        var condition = data.query.results.channel[0].item.condition.text,
            temperature = data.query.results.channel[0].item.condition.temp;

        obj = {
            city: city,
            condition: condition,
            temperature: temperature
        };

        dataObj.cities.push(obj);

        appendData();
    });

    i = i + 1;
}

function buildTemplate() {
    var source   = $("#some-template").html();
    var template = Handlebars.compile(source);

    var dataObjExample = { cities: [
            {city: "london", condition: "Cloudy", temperature: "8" },
            {city: "paris", condition: "sunny", temperature: "5" },
            {city: "munich", condition: "Rainy", temperature: "3" }
        ]};

    console.log(dataObj);
    console.log('dataObj:' + dataObj.cities.length);

    console.log(dataObjExample);
    console.log('dataObjExample:' + dataObjExample.cities.length);

    $("#content-placeholder").html(template( dataObj ));
}

appendData();

}）;

Answer 3

您必须定位城市并查询其长度：

dataObj.cities.length

另请注意，Object原型没有像Array原型那样的动态length属性。

对象长度为0，但其中有几个项目

3 个答案: