如何覆盖javascript类中的var?

时间:2018-02-13 14:12:18

标签: javascript jquery

我学会创建自己的库。这对我来说是新的。我开始使用this library学习,如果你看到,我有类似clear function的库,但我的代码并没有取代var history

初始值:var history = [];

显示():返回[]

添加('asd'):history[0] = 'asd';

显示():返回[asd]

清除:将var历史记录还原为空var history = []

显示():返回[asd]我期望的是[]

这是我的代码:

;(function() {
  'use strict';
  var testLib = function() {
    var index = -1,
      history = [];
    return {
      add: function(data) {
        history[history.length] = data;
      },
      show: function() {
        return history;
      },
      clear: function() {
        var index = -1,
          history = [];
      }
    };
  };

  window.testLib = testLib;
}());

$(function() {
  var mylib = new testLib();
  mylib.add('asdasd');
  console.log(mylib.show());
  mylib.clear();
  console.log(mylib.show()); //expect: [] empty array
});
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>

2 个答案:

答案 0 :(得分:5)

只需删除var方法中的clear

clear: function() {
    index = -1;
    history = [];
}

您正在声明新变量,而不是修改闭包中的变量。在现代ECMAScript中,您可能需要考虑将库创建为&#34;类&#34;:

class History{
    // ...
    clear() {
        this.history = [];
        this.index = -1;
    }
}

答案 1 :(得分:2)

只需将变量设置在适当的范围内;) 在您的示例中,您首先使用关键字clearvar函数中重新定义变量。

然后,根据我的经验,将所有内容设置在同一个对象中并且在对象中没有私有作用域更简单。这样,您就可以以更灵活的方式工作!

所以,不要使用var,在您返回的对象中设置属性,并使用this,它会正常工作!

&#13;
&#13;
(function() {
  'use strict';
  var testLib = function() {
    return {
      index: -1,
      history: [],
      add: function(data) {
        this.history[this.history.length] = data;
      },
      show: function() {
        return this.history;
      },
      clear: function() {
        this.index = -1;
        this.history = [];
      }
    };
  };

  window.testLib = testLib;
}());

$(function() {
  var mylib = testLib();
  mylib.add('asdasd');
  console.log(mylib.show());
  mylib.clear();
  console.log(mylib.show()); //expect: [] empty array
});
&#13;
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
&#13;
&#13;
&#13;