个人中心
gpt4 book ai didi

JavaScript 自动加载器 : How To Recover From Errors

转载 作者：行者123 更新时间：2023-11-28 08:44:34 27 4
gpt4 key购买 nike

我有一个适用于 JavaScript 自动加载器的概念验证，但它目前存在一个重大缺陷:它需要重新执行整个代码，而不是简单地从失败的行重试。

这是原型(prototype):

<!doctype html>
<html>
<head>
</head>
<body>
<script type="text/javascript">
var app = function(){
    console.log('Initialize App');
    var test = new Test();
    var foo = new Foo();
    var bar = new Bar();
};

var autoload = function(app){

    var recover = function(error){
        var name = error.message.split(' ')[0];
        console.log('Loading '+name);
        //A file could be synchronously loaded here instead
        this[name] = function(){
            console.log(name+' has been dynamically created');
        };
        load(app);
    };

    var load = function(app){
        try {
            app();
        } catch (error){
            if (error.name == "ReferenceError"){
                console.log(error.message);
                recover(error, app);
            }
        }
    };

    load(app);

};

autoload(app);
</script>
</body>
</html>

它应该如何工作

这个想法是，所有应用程序代码都将在 app 函数中执行。最终，如果我能让它正常工作，您还可以使用 app 函数将依赖关系映射传递给自动加载器，以便在未定义函数时同步加载依赖关系。依赖关系图只是一个将函数名称映射到文件名的对象。

目前的运作方式

如果您不想尝试，上面的代码将向控制台输出以下内容:

Initialize App 
Test is not defined 
Loading Test 
Initialize App 
Test has been dynamically created
Foo is not defined 
Loading Foo 
Initialize App 
Test has been dynamically created
Foo has been dynamically created
Bar is not defined 
Loading Bar 
Initialize App 
Test has been dynamically created
Foo has been dynamically created
Bar has been dynamically created

每次自动加载器捕获错误时，都会重新执行完整的 app 函数。显然，由于多种原因，这并不理想。

从错误中恢复

要进入下一步以完成这项工作，我需要找到一种方法来从错误中恢复，而无需重新执行整个 app 函数。 catch block 中的 error 对象确实提供了发生错误的行号和文件名，但到目前为止，我还没有找到一种方法利用该信息。我能想到的一般方法有以下三种:

  1. 在给定行重新启动脚本执行
  2. 从头开始重新执行脚本，但跳过所有行直到给定行
  3. 将文件作为字符串获取，按行号将其拆分为数组，然后评估剩余的行。

不幸的是，我无法找到有关前两种方法的信息。在这三者中，#1 似乎更理想，但我当然也愿意接受其他创意建议。据我所知，JavaScript 没有提供在任意行号开始执行脚本的方法。 #3可能可以工作，但我不确定它的性能是否会非常好。我能想到的唯一方法是每次都需要一个额外的请求将文件文本加载到字符串中。

问题

这无疑突破了 JavaScript 中依赖项加载方式的界限。我什至不确定这是否可能，因为我不知道 JavaScript 是否允许这种类型的错误恢复。也就是说，我有兴趣进一步探索它，直到我发现它绝对不可能。

为了让这项工作正常进行:

  1. 有没有办法在 JavaScript 的任意行开始执行脚本？
  2. 还有其他可能更有效的方法吗？尽情发挥创意!

退后一步看看更大的图景(假设我可以让它发挥作用):

  1. 人们会想要 JavaScript 自动加载器吗？
  2. 与 AMD 等方法相比，这种自动加载器有哪些优点/缺点？
  3. 这种方法会遇到什么样的性能问题？性能损失是否会太大而不值得？

最佳答案

制作起来有点复杂， throw 和接住也有点昂贵。您可以使用 typeof window["Test"]!=="function" 然后创建它，而不是像这样使用 try catch 。

但是对于一般的恢复和继续方法，以下代码就可以解决问题。

var app = (function(i){
  var objects=new Array(3),
  fnNames=["Test","Foo","Bar"];
  return function(){
    var len=fnNames.length
     ,test,foo,bar;
    //check if closure vars have been reset, if so
    // this has ran successfully once so don't do anything?
    if(objects===false){
      console.log("nothing to do, initialized already");
      return;
    }
    while(i<len){
      try{
        objects[i] = new window[fnNames[i]]();
        i++;
      }catch(e){
        if (e.name == "TypeError"){//different syntax different error
          throw {"fnName":fnNames[i]};
        }
      }
    }
    //store instances in the variables
    test = objects[0];
    foo = objects[1];
    bar = objects[2];
    //reset closure vars assuming you only call app once
    //  when it's successful
    i=null;objects=false;
    console.log("Got all the instances",test,foo,bar);
  };
}(0));

var autoload = function(app){
  var recover = function(name){
    console.log('Loading '+name);
    //A file could be synchronously loaded here instead
    this[name] = function(){
      this.name=name;
      console.log(this.name+' has been dynamically created');
    };
    load(app);
  };

  var load = function(app){
    try {
      app();
    } catch (error){
      //if statement here no longer needed
      // object thrown has fnName (function name)
      recover(error.fnName, app);
    }
  };
  load(app);
};

autoload(app);
autoload(app);

关于JavaScript 自动加载器 : How To Recover From Errors，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20024843/

27 4 0
文章推荐： Javascript 幻灯片到 css
文章推荐： css - 在 xs 屏幕尺寸下发现可折叠的导航菜单链接
文章推荐： javascript - 如何基于对象动态创建和链接到页面？
文章推荐： javascript - 让 jsfiddle 使用 javascript 扩展脚本
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com