JavaScript之全局变量问题

全局变量问题

1. 需求：

（1）页面控制信息的新增/修改/删除/还原功能

（2）只有一个“保存”按钮，访问后台，保存数据库

2. 代码实现： 

优化前的js 代码:

    //全局变量

    var newInfoList;//全局存储最新的信息：新增/修改

    var restoreInfoList;//全局存储已删除的信息：删除

    var allInfoList;//全局存储所有状态的信息：新增/修改/删除

    var index;//全局记录信息的顺序



    //初始化页面

    function initPage(){

      ...

    }



优化后的js 代码:

    /**

     *全局存储页面所有的信息

     *对每个信息增加状态属性status:true-新增/修改；false-删除

     *对每个信息增加索引（顺序）属性index

     */

    var infoList;



    //初始化页面

    function initPage(){

          ...

          //点击“编辑”按钮

          $(‘#edit-info’).on(‘click’, function(){

                var index = $(this).data(‘index’);

                //通过索引，获得信息

                var entity = infoList[index];

                ...

          });

      ...  

    }

 

    HTML代码

    <!-- 这里以编辑按钮为例 -->

    <a class=”btn-edit” id=”edit-info” data-index=”1”>编辑</a>

应该避免js定义太多全局变量，影响js操作。解决方案：

（1）操作$保存到页面元素上，例如$(this).data(key,value);

（2）优化JS设计

（3）利用方法闭包临时保存(适用于实时变化的变量，如：页面实时显示后台时间)，关于闭包可参考（个人认为最容易理解闭包）http://www.jb51.net/article/24101.htm

最后

以上就是舒服冰棍为你收集整理的JavaScript之全局变量问题的全部内容，希望文章能够帮你解决JavaScript之全局变量问题所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。