Question

我想通过按AJAX加载数据来动态创建Google Map。因此，我使用具有GM API相同结构的JSON对象来构建地图，并使用jQuery加载每个AJAX。

像：

"object": {
    "div": "map1",
    "options": {
        "center": {
            "latitude": 38.608202,
            "longitude": 26.373749,
            "noWrap": false
        },
        "mapTypeId": "roadmap",
        "zoom": 7
    }
}

现在最好在JSON中使用原始JavaScript并使用eval函数解析它，如：

"object": {
    "div": "map1",
    "options": {
        "center": new google.maps.LatLng( 38.608202, 26.373749 ),
        "mapTypeId": google.maps.MapTypeId.ROADMAP,
        "zoom": 7
    }
}

使用jQuery的默认JSON解析器，我收到错误。但是，如果我使用eval函数创建自己的转换器，它就可以工作。

jQuery.ajax({
    url: this.url,
    data: this.parameters,
    type: method,
    dataType: 'json',
    converters: {'text json': function( data ){
        eval( 'data = ' + data );
        return data;
    }},
    […]
});

我知道这不是一个正确的JSON格式。但是我会得到一些其他的麻烦，或者是否有任何速度损失导致eval功能？

Answer 1

在JSON中使用原始JavaScript并使用eval解析它现在是个好主意

没有。部分原因是eval应该避免，但更重要的是因为你正在减少关注点的分离。

JSON是数据。数据不是代码。您的代码应使用此数据初始化其状态。这将是一种更好的方法来优化您的数据，以便您的代码可以更灵活地进行初始化。

BTW性能不属于您的问题，所以它不应该是您关注的问题之一。在好之后明显缓慢时，处理优化性能，而不是之前。

怎么样

"object": {
    "div": "map1",
    "options": {
        "center": {
            "gmType": "LatLng",
            "init": [38.608202, 26.373749]
        },
        "mapTypeId": {
            "gmType": "MapTypeId",
            "init": "ROADMAP"
        },
        "zoom": 7
    }
}

和

// function from http://stackoverflow.com/a/3362623/
function construct(Constructor, args) {
    var Temp = function(){}, inst, ret;
    Temp.prototype = Constructor.prototype;
    inst = new Temp;
    ret = Constructor.apply(inst, args);
    return Object(ret) === ret ? ret : inst;
}

function jsonPrepare(jsonObject) {
    if ($.isPlainObject(jsonObject)) {
        $.each(jsonObject, function (key, item) {
            var target = null;
            if (item.hasOwnProperty("gmType")) {
                // initialize the GMaps object at this position
                target = google.maps[item.gmType];
                if ($.isFunction(target)) {
                    // ...either it is a constructor (like LatLng)
                    jsonObject[key] = construct(target, item.init);
                } else if (item.init in target) {
                    // ...or it is a look-up object (like MapTypeId)
                    jsonObject[key] = target[item.init];
                }
            } else {
                // recurse
                jsonPrepare(item);
            }
        });
    } else if ($.isArray(jsonObject)) {
        $.each(jsonObject, function (key, item) {
            // recurse
            jsonPrepare(item);
        });
    }
    return jsonObject;
}

和

jQuery.ajax({
    url: this.url,
    data: this.parameters,
    type: method,
    dataType: 'json'
}).then(jsonPrepare).then(function (data) {
    // your JSON object is now set up
});

这是有效的，因为jsonPrepare就地修改了对象实例。

更重要的是，您现在可以灵活地，声明性地在客户端处理对象创建 - 而无需诉诸混合代码和数据。

我想加载JSON时可以使用原始JavaScript吗？

1 个答案: