js的异步加载
javascript异步加载的三种方案
1、defer 异步加载，但要等到dom文档全部解析完才会被执行。只有IE能用，也可以将代码写到内部。
2、async 异步加载，加载完就执行，async只能加载外部脚本，不能把js写在script标签里。
（1、 2执行时也不阻塞页面）
3、创建script，插入到DOM中，加载完毕后callback。可以解决不同浏览器的兼容问题。
这样仍然会遇到一个问题，假设我们的test.js里有一个test方法，我们在appendChild之后执行这个test方法，会报错，因为script.src对js文件的预加载可能还没有完成，那么我们怎么处理呢？我们知道，当我们想要给img标签加载图片资源，并在加载完图片资源后进行操作时，会用到onload事件，同样的，script标签加载src资源也可以用同样的方法。（注意，ie不兼容）
ie不兼容此方法，但ie的script标签有个状态码叫readtState，默认为‘loading’，当加载完之后，状态码会变为‘complete’或‘loaded’。并且ie提供了一个onreadystatechange事件来监听状态码的改变。所以我们可以写一个兼容的写法：
当我们写了一个工具库tools.js，想要在页面中引用这个js的部分方法，并且此方法可能只有在特定的情况下才会使用。这时候，如果把此js直接加载到页面中肯定会造成资源的浪费，通过上面的学习，我们可以封装一个方法，令这个js只在我们需要调用它的时候再加载，如果不需要则不加载。
上面这个方法还可以再优化一下：
1）我们的test()可以写成参数传进来，变成动态的
2）如果我的网速足够快，我们的src瞬间就加载完毕，当代码执行到绑定onreadystatechange事件后，由于src的readyState已经改变，就监听不到此事件的发生了（有点吹毛求疵的感觉，基本上不会发生，不过考虑周到总没错哈哈哈）
所以我们可以先绑定监听事件，再来加载src资源
但是这样写，也有一个问题，咱们的test在传参时，实参test是一个变量，而我们的代码里并没有声明这个变量，所以会报错，我们可以再优化一下
我们传一个匿名函数进去，当callback执行时，执行的是此匿名函数，然后匿名函数的函数体里执行的才是test函数。
我们甚至可以更近一步，将tools.js里的方法赋值给对象的属性，我们在学习对象时知道，对象是可以通过[ ‘字符串’ ]方法来调用的，所以我们还可以这么写：
好了，今天的学习就到这里了，希望对大家有所帮助。
文章被以下专栏收录
