• seaJs学习笔记之javascript的依赖问题


    之前分别为大家介绍了有关javascript中的冲突和性能问题,今天为大家介绍一下有关javascript中的依赖问题。我们将继续就之前javascript中性能问题继续介绍。

    先来回顾一下性能问题的解决方法,那就是按需引入js文件。那么这样按需引入会不会存在问题呢?今天我们为大家继续揭晓答案。先看如下页面。


    多文件HTML代码

    <!doctype html>
    <html dir="ltr" lang="zh-CN">
    <head>
    <meta charset="utf-8">
    <title>梦龙小站</title>
    </head>
    <body>
    <script type="text/javascript" src="a.js"></script>
    <script type="text/javascript" src="b.js"></script>
    <script type="text/javascript" src="c.js"></script>
    <script type="text/javascript" src="d.js"></script>
    </body>
    </html>
    

    如上面所示。如果按照上面的方法拆分的话,那么页面中可能会引入很多js文件。如果这四个文件若没有互相依赖的关系的话,这还算勉强过得去。但是如果b.js会依赖a.js的话,那么就会出现依赖的问题。 如果b.js依赖a.js的话,那么b.js只能写在a.js下面,不能写在a.js的上面。如果b.js写在了a.js之上,这顺序就会出现问题了。那么现在还没看到问题,我们现在就举一个具体的问题,来说明一下依赖问题,几个js文件的话就有可能出现问题。

    比如A小伙伴儿写了个js文件叫“b.js”,怎么使用呢,调用一下就可以使用了。然后A小伙伴儿把写好的a.js文件给其他小伙伴儿去用。B小伙伴儿就用了a.js文件。B小伙伴儿把b.js引入页面当中,接下来在页面中调用一下就可以了。看着好像没有什么问题,但是却出问题了。B小伙伴儿就去查找问题,查清楚了。a.js若想简单调用的话,必须依赖b.js才能正常使用。这时候B小伙伴儿问A小伙伴儿是否是缺少js文件,A小伙伴儿突然想起来少了个a.js文件。


    依赖问题HTML代码

    <!doctype html>
    <html dir="ltr" lang="zh-CN">
    <head>
    <meta charset="utf-8">
    <title>梦龙小站</title>
    </head>
    <body>
    <!-- 使用b.js -->
    <script type="text/javascript" src="b.js"></script>
    <script type="text/javascript">
    //进行调用,却发现有问题了
    b();
    </script>
    
    <!-- b.js依赖了a.js,把a.js引入页面中 -->
    <script type="text/javascript" src="a.js"></script>
    <script type="text/javascript" src="b.js"></script>
    <script type="text/javascript">
    //好用了
    meng();
    </script>
    </body>
    </html>
    


    过了一段时间,可能产品发生了变化,新加了一些需求。要把meng函数的效果变得复杂一些,新加了一些功能。需要再依赖c.js才能完成这个效果。这时候,A小伙伴儿还得告诉B小伙伴儿文件还需要再依赖c.js才能正常使用。B小伙伴儿需要再给每一个文件添加c.js。这时候B小伙伴儿已经很不爽了,因为不仅在一个页面调用这些js,而是在很多个页面调用了这个js,需要各个页面手动添加c.js,这样才会保证没有问题。

    这时候,产品又要该需求了。现在不去依赖a.js了,功能上要减少一些。这时候a.js存在页面中,那肯定是很耗资源的。A小伙伴儿又告诉了B小伙伴儿,把a.js从页面中去掉吧,要不然也是多余的。B小伙伴儿又把a.js从页面中去掉了。去掉之后,发现meng函数出问题了。这meng函数不是不依赖a.js了么,怎么去掉又出问题了。结果发现,页面中其他js比如d.js依赖a.js。又不得不把a.js重新添加到页面中。

    其实几个js文件,我们就可以发现,js文件互相依赖,会存在很严重的维护问题。这就是javascript中的依赖问题,导致我们经常的在加班处理这些问题。如果有一个更好的解决方案,来处理javascript中的冲突、性能和依赖问题的话,让更多的时间进行开发工作而不是修改问题。多出来的时间可以干一些有意义的事情。Js模块化就是用来解决javascript中冲突、性能和依赖问题的。

    seaJs学习笔记之javascript的依赖问题就先为大家介绍到这里,有关模块化怎么书写,敬请关注梦龙小站接下来有关seaJs的更新。


  • 相关阅读:
    【洛谷P3804】【模板】后缀自动机 (SAM)
    【洛谷P3321】序列统计
    【洛谷P4929】【模板】舞蹈链(DLX)
    【洛谷P3703】树点涂色
    Kubernets二进制安装(5)之私有仓库harbor搭建
    忘记Mysql的root用户密码处理方法(以mysql 5.5.33为例)
    编译安装MySQL 5.5.33
    Kubernets二进制安装(4)之Docker安装
    Kubernets二进制安装(3)之准备签发证书环境
    Kubernets二进制安装(2)之Bind9安装
  • 原文地址:https://www.cnblogs.com/fuhaots2009/p/3454112.html
Copyright © 2020-2023  润新知