JavaScript变量和传递数据问题 [英] JavaScript Variable and passing data issues

问题描述

我遇到的问题是$ .getJSON代码段工作正常，并生成一个名为'zippy'的变量。我需要在代码中进一步向下访问'series：data'下的'zippy'。

I have an issue in that the $.getJSON segment of code works fine and produces a variable called 'zippy'. I need to access 'zippy' under 'series: data' further down in the code.

我尝试过很多东西，不幸的是我无法使它工作。最简单的方法是在函数（zippy）调用中返回数据$ .getJSON（jsonUrl，函数（zippy）），但我对如何使这些数据可用感到遗憾。

I have tried a number of things unfortunately i can't make it work. The easiest would be way to 'return data' $.getJSON(jsonUrl,function(zippy) out of the funcation(zippy) call but I'm lost as to how to make that data available.

$(function() {
    $(document).ready(function() {
        Highcharts.setOptions({
            global: {
                useUTC: false
            }
        });

        console.log("+++++++++++++++++++++++++++++++++++++");
        var jsonUrl = "http://www.someurl.com/thing.php?callback=?";

        $.getJSON(jsonUrl, function(zippy) {
            for(i = 0; i < zippy.cpmdata.length; i++) {
                console.log("TIMESTAMP: " + zippy.cpmdata[i].timestamp + " AFTER: ");


                zippy.cpmdata[i].timestamp = Date.parse(zippy.cpmdata[i].timestamp).getTime() / 1000;
                //var unixtime  Date.parse(temptime).getTime()/1000

                console.log(" TESST " + zippy.cpmdata[i].timestamp + " \r\n");

            }
        });
        console.log("+++++++++++++++++++++++++++++++++++++");

        var chart;
        chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                type: 'spline',
                marginRight: 10,
                events: {
                    load: function() {

                        // set up the updating of the chart each second
                        var series = this.series[0];
                        setInterval(function() {
                            var x = (new Date()).getTime(), // current time
                                y = Math.random();
                            series.addPoint([x, y], true, true);
                        }, 1000);
                    }
                }
            },
            series: [{
                name: 'Random data',
                data: (function() {
                    // generate an array of random data
                    var data = [],
                        time = (new Date()).getTime(),
                        i;

                    console.log("++NEED ACCESS HERE FOR ZIPPY++");
                    console.log(" =============== \r\n");
                    console.log(" FINAL " + zippy.cpmdata[5].timestamp + " \r\n");
                    return data;
                })()
            }]



        }

推荐答案

你的问题是getJSON是异步的。你的代码中发生了什么：

Your problem is that getJSON is asynchronous. What's happening in your code is this:

1. document.ready被触发


2. 调用getJSON并且注册一个回调function（zippy）
   请注意getJSON立即返回而不执行回调



3. 您尝试使用HighCharts绘制图表

1. document.ready is triggered
2. getJSON is called and registers a callback "function(zippy)" note that getJSON returns immediately without executing the callback

3. You try to draw a chart using HighCharts

......几百毫秒后

... several hundred milliseconds later

浏览器发出JSON请求

The browser makes the JSON request

......几百毫秒之后

... several hundred milliseconds later

JSON请求返回数据并触发
回调到function（zippy）

The JSON request returns with data and triggers the callback to "function(zippy)"

所以你看。问题不是如何函数（zippy）执行，而执行时。因此，您无法执行想要在回调函数之外使用JSON请求的返回值的代码。 （实际上你可以，但我们现在将忽略使用setTimeout或使用同步ajax的轮询）

So you see. The problem is not how "function(zippy)" is executed but when it is executed. As such, you cannot execute code that wants to use the return value of the JSON request outside of the callback function. (Actually you can but we'll ignore polling with setTimeout or using synchronous ajax for now)

解决方案是移动你想在以后运行的所有代码回调函数：

The solution is to move all the code that you want to run later on inside the callback function:

$.getJSON(jsonUrl, function(zippy) {
        for(i = 0; i < zippy.cpmdata.length; i++) {
            console.log("TIMESTAMP: " + zippy.cpmdata[i].timestamp + " AFTER: ");


            zippy.cpmdata[i].timestamp = Date.parse(zippy.cpmdata[i].timestamp).getTime() / 1000;
            //var unixtime  Date.parse(temptime).getTime()/1000

            console.log(" TESST " + zippy.cpmdata[i].timestamp + " \r\n");

        }

        var chart;
        chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'spline',
            marginRight: 10,
            events: {
                load: function() {

                    // set up the updating of the chart each second
                    var series = this.series[0];
                    setInterval(function() {
                        var x = (new Date()).getTime(), // current time
                            y = Math.random();
                        series.addPoint([x, y], true, true);
                    }, 1000);
                }
            }
        },
        series: [{
            name: 'Random data',
            data: (function() {
                // generate an array of random data
                var data = [],
                    time = (new Date()).getTime(),
                    i;

                console.log(" FINAL " + zippy.cpmdata[5].timestamp + " \r\n");
                return data;
            })()
        }]
    });

这篇关于JavaScript变量和传递数据问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！