js 使用接口技术解决JS文件冲突

最新推荐文章于 2022-10-02 19:19:40 发布

jazwoo

最新推荐文章于 2022-10-02 19:19:40 发布

阅读量791

点赞数

分类专栏： js/ajax 文章标签： function 测试

js/ajax 专栏收录该内容

94 篇文章 1 订阅

订阅专栏

所谓文件冲突，指在同一个页面中导入多个js外部文件有可能因为存在重名的对象、函数、变量等导致冲突。
例
    average_floor.js内容如下：
        function average(x, y) {
            return Math.floor((x+y)/2);
        }

    average_round.js内容如下：
        function average(a, b) {
            return Math.round((a+b)/2);
        }
    当在同一个页面中同时导入这两个js外部文件时候会出现因为重命名函数导致的冲突问题。
    <html>
   <head>
    <script type="text/javascript">
        alert(111);
    </script>

    <script type="text/javascript" src="average_floor.js"></script>
    <script type="text/javascript" src="average_round.js"></script>

    <script type="text/javascript">
        alert(222);
        alert(average(7.3, 8.6));
        //alert(average_floor.average(7.3, 8.6)); //测试接口时使用
        //alert(average_round.average(7.3, 8.6)); //测试接口时使用
    </script>
   </head>
   <body></body>
    </html>


解决冲突的最好方法是利用接口。
    average_floor.js内容如下：
    (function() {
        average_floor = { //定义接口对象
            average: average
        };
        function average(x, y) {
            return Math.floor((x+y)/2);
        }
    })()

    average_round.js内容如下：
    (function() {
        average_round = { //定义接口对象
            average: average
        };
        function average(a, b) {
            return Math.round((a+b)/2);
        }
    })()
当然，接口名字不能重复，否则一样会出现冲突问题。

jazwoo

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js 使用接口技术解决JS文件冲突

所谓文件冲突，指在同一个页面中导入多个js外部文件有可能因为存在重名的对象、函数、变量等导致冲突。例 average_floor.js内容如下： function average(x, y) { return Math.floor((x+y)/2); } average_round.j
复制链接

扫一扫