javascript - 在火狐中运行一段JS,正常运行时报错,单步调试的时候却不报错?
天蓬老师
天蓬老师 2017-04-11 12:39:49
[JavaScript讨论组]

调试一段JS代码运行时报TypeError: s is undefined 错误,浏览器为火狐,为了寻找错误点,进行断点调试,使用FireBug进行调试,进行断点调试却不报错,十分不解!

    var province, city, district;
        $.getJSON('province.json',function (data) {
            alert(data);
            province = data;
        });
        $.getJSON('city.json',function (data) {
            city = data;
        });
        $.getJSON('district.json',function (data) {
            district = data;
        })
        var Game = function (province,city,district) {
            //组件数据获取
            this.A = province;
            this.B = city;
            this.C = district;
            console.table(this.A);
            console.table(this.B);
            console.table(this.C);
            //获取显示组件
            this.a = $('#a');
            this.b = $('#b');
            this.c = $('#c');
            this.start();
        }
        Game.prototype = {
            start:function(){
                //组件初始化
                this.class_A();
                this.monitor();
            },
            class_A:function(){
                //初始化顶层选择框
                var content = '';
                var s = this.A;
                for (var i =0; i < s.length; i++) {
                        content += "";
                    }
                this.a.html(content);
            },
            class_B:function(x){
                var content = '';
                var s = this.B[x];
                for (var i = 0; i < s.length; i++) {
                    content += "";
                }
                this.b.html(content);
            },
            class_C:function(x,y){
                var content = '';
                var s = this.C[x][y];
                for (var i = 0; i < s.length; i++) {
                    content += "";
                }
                this.c.html(content);
            },
            monitor:function(){
                //事件监听
                var self = this;
                this.a.change(function(){
                    var x = self.a.val();
                    self.class_B(x);
                    self.class_C(x,0);
                });
                this.b.change(function(){
                    var x = self.a.val();
                    var y = self.b.val();
                    self.class_C(x,y);
                });
            }
        };
        var game = new Game(province,city,district);

运行错误

调试截图

天蓬老师
天蓬老师

欢迎选择我的课程,让我们一起见证您的进步~~

全部回复(3)
伊谢尔伦
因为你这些数据都是异步获取的,这么说吧,假设这段代码执行需要1ms,而$.getJSON返回结果要2ms,所以正常执行的话会获取不到值,而设置断点会相当于等到$.getJSON获取到值再执行。
阿神

JS是异步语言, 不会等待$.getJSON获取到值后才执行下面的代码, 解决方法是利用回调或者ES6的yield语法

阿神

通常我碰到这种情况会先从异步同步这个方向分析,显然你的就是这个问题

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号