js基础十八-- Json、异步加载、时间线

一、JSON

json是一种传输数据的格式(以对象为样板,本质上就是对象,但用途有区别,对象就是本地用的,json是用来传输的)

JSON.stringify();    // json => string   通过这个方法,可以将json格式的数据转换成字符串格式。【传给后端使用】
JSON.parse();        // string => json   通过这个方法,可以将字符串格式的数据转换成json(对象)格式。【传给前端使用】

二、异步加载

js加载的缺点:

1、加载工具方法没必要阻塞文档,过多js加载会影响页面效率,一旦网速不好,那么整个网站将等待js加载,而不进行后续渲染等工作。

2、有些工具需要按需加载,用到在加载,不用不加载。

js异步加载的3种方案

// 1、defer异步加载
//   defer异步加载,但要等到dom文档全部解析完才会被执行。只有IE能用,也可以将代码写到内部。加载时不会阻塞文档解析
// 2、async异步加载
//   加载完就执行,async只能加载外部脚本,不能把js写在script标签里。加载时也不阻塞文档解析。
// 3、创建script,插入到DOM中,加载完毕后callBack 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <!-- 加上defer或者async属性后,该js变成异步加载的方式进行加载,不会阻塞文档继续解析 -->
        <!-- <script src="js/Tools.js" type="text/javascript" charset="utf-8" defer ></script> -->
        <!-- <script src="js/Tools.js" type="text/javascript" charset="utf-8" async ></script> -->
    </head>
    <body>
        <script type="text/javascript">
            var script = document.createElement("script");
            script.type = "text/javascript";
            script.src = "js/Tools.js";        // 执行到这一步,会异步下载脚本,不会执行

            document.head.appendChild(script); // 当追加到DOM中才开始执行(解析脚本)
        </script>
    </body>
</html>

 

js基础十八-- Json、异步加载、时间线

上一篇:「Linux」- 安装 Node.js 环境 @20210512


下一篇:Newtonsoft.Json的使用整理