这个js是不是有语法错误?循环里面的东西在运行的时候没有执行,求大佬指点。

这个js是不是有语法错误?循环里面的东西在运行的时候没有执行,求大佬指点。

问题描述:

如题, 我想在一个Chart里面画出三个波形图,就将三个波形的数据都放在一个数组myDatasets里面。然后再赋值给Chart,但运行的时候发现整个循环里面所有的东西都没运行,包括

console.log

也没运行,但控制台又没报错,实在一头雾水,是不是我语法哪里有问题?求大佬帮帮忙QAQ

这是我整个函数↓

function drawWaveform(datas){
            console.log("绘制开始。。。");
            var lineChart = $("#waveform");

            console.log(datas);

            var xs=[];
            var allYs=[];
            var myDatasets=[];  
            var ys=[];
            var k=0;

            for(;k<datas.length;k++){
                //【从这里开始就没运行了】
                console.log(k);

                var points=datas[k].points;
                console.log(points);
                for(var i = 0;i<points.length;i++){
                    if(i==0){
                        xs.push(points[i].x);
                    }                       
                    ys.push(points[i].y);
                }
                allYs.push(ys);
                var color="";
                if(datas[k].phrase=="A"){
                    color="#FFD700";//gold(yellow)
                    var curDataset={
                              label: datas[k].phrase,
                              fill: false,
                              lineTension: 0.1,
                              backgroundColor: "#fff",
                              borderColor: color,
                              borderCapStyle: 'butt',
                              borderDash: [],
                              borderDashOffset: 0.0,
                              borderJoinStyle: 'miter',
                              pointBorderColor: "#fff",//white
                              pointBackgroundColor: "#141E41",//black
                              pointBorderWidth: 1,
                              pointHoverRadius: 10,
                              pointHoverBackgroundColor: "#FC2055",//red
                              pointHoverBorderColor: "#fff",
                              pointHoverBorderWidth: 1,
                              pointRadius: 0,
                              pointHitRadius: 10,
                              data: ys,
                              spanGaps: false               

                            };

                    this.myDatasets.push(curDataset);
                }
                if(datas[k].phrase=="B"){
                    color="#047bf8";//blue
                    var curDataset={
                              label: datas[k].phrase,
                              fill: false,
                              lineTension: 0.1,
                              backgroundColor: "#fff",
                              borderColor: color,
                              borderCapStyle: 'butt',
                              borderDash: [],
                              borderDashOffset: 0.0,
                              borderJoinStyle: 'miter',
                              pointBorderColor: "#fff",//white
                              pointBackgroundColor: "#141E41",//black
                              pointBorderWidth: 1,
                              pointHoverRadius: 10,
                              pointHoverBackgroundColor: "#FC2055",//red
                              pointHoverBorderColor: "#fff",
                              pointHoverBorderWidth: 1,
                              pointRadius: 0,
                              pointHitRadius: 10,
                              data: ys,
                              spanGaps: false               

                            };

                    this.myDatasets.push(curDataset);
                }
                if(datas[k].phrase=="C"){
                    color="#FC2055";//red
                    var curDataset={
                              label: datas[k].phrase,
                              fill: false,
                              lineTension: 0.1,
                              backgroundColor: "#fff",
                              borderColor: color,
                              borderCapStyle: 'butt',
                              borderDash: [],
                              borderDashOffset: 0.0,
                              borderJoinStyle: 'miter',
                              pointBorderColor: "#fff",//white
                              pointBackgroundColor: "#141E41",//black
                              pointBorderWidth: 1,
                              pointHoverRadius: 10,
                              pointHoverBackgroundColor: "#FC2055",//red
                              pointHoverBorderColor: "#fff",
                              pointHoverBorderWidth: 1,
                              pointRadius: 0,
                              pointHitRadius: 10,
                              data: ys,
                              spanGaps: false               

                            };

                    this.myDatasets.push(curDataset);

                }
                ys=[];

                //【到这里结束】
            }

            //【这里开始有结果】
            console.log(myDatasets);

              // line chart data
              var lineData = {
                labels: xs,
                datasets: myDatasets
              };

              // line chart init
              var myLineChart = new Chart(lineChart, {
                type: 'line',
                data: lineData,
                options: {
                  legend: {
                    display: false
                  },
                  scales: {
                    xAxes: [{
                      ticks: {
                        fontSize: '11',
                        fontColor: '#969da5'
                      },
                      gridLines: {
                        color: 'rgba(0,0,0,0.05)',
                        zeroLineColor: 'rgba(0,0,0,0.05)'
                      }
                    }],
                    yAxes: [{
                      display: false,
                      ticks: {
                        beginAtZero: true,
                        max: 65
                      }
                    }]
                  }
                }
              });

             console.log("绘制结束");
        }

在这个函数的ajax里面调用的这个函数↓

function show3(id1,id2,id3) {
            console.log("show3");
            var ids=[id1,id2,id3];
            var flag = false;    //标识,表示页面上数据还未处理完成
            var datas=[];
            console.log(ids);

            for(var i=0;i<3;i++){
                //console.log(ids);
                var curid=ids[i];

                $.ajax({
                    type : "get",
                    url : "observe/getImage",
                    data : {
                        ID : curid                  
                    },
                    beforeSend: function () {
                        ShowDiv();
                    },
                    complete: function () {
                        HiddenDiv();
                    },
                    success : function(data) {
                        console.log(data)

                        datas.push(data);                                           
                    }

                });
            }

            console.log(datas);
            //绘制波形图
            //drawWaveform(data.points);

            drawWaveform(datas);//【**在这里调用的**】
            $("#closeDivBtn").html("<input class=\"mr-2 mb-2 btn btn-primary btn-lg\" type=\"button\" value=\"关闭\" onclick=\"CloseDiv('MyDiv','fade')\">");
            AlertDiv('MyDiv','fade');

        }

打印一下datas是不是没有值?

有些括号或者引号没有成对会导致这种情况,通常是多加几个console.log()看是在哪块中断的,把可能有错的代码块剪切出去,逐渐加入,缩小可能有错的范围。