代码之家  ›  专栏  ›  技术社区  ›  Petr Marek

Javascript类封装行为

  •  2
  • Petr Marek  · 技术社区  · 9 年前

    有人能解释一下这个javascript行为吗?我创建2个对象( x , y )然后我打电话 x.m() 修改私有变量 b 在…上 x(x) 。然后我调用两者的打印方法 x(x) y 并且它产生以下输出。如果打印方法不同,则输出不同 p() 定义为 this 属性(1)或作为原型(2)。

    this.p 定义如预期:2个对象有两个私有变量,正在修改 b 上的属性 x(x) 不影响 y b 所有物但与 A.prototype.p 释义 b 属性似乎是两个对象共用的静态变量 x(x) y .

    代码中描述的行为:

    function A() {
      var b = "bbb";
    
      function f() {
        b = "ccc";
      }
    
      // 1)
      this.p = function() {
        console.log(b);
      };
    
      // 2)
      //A.prototype.p = function() {
      //  console.log(b);
      //};
    
      A.prototype.m = function() {
        f();
      };
    }
    
    var x = new A();
    var y = new A();
    
    x.m();
    x.p();
    y.p();
    

    生产:

    // 1)
    bbbb
    ccc
    
    // 2)
    //ccc
    //ccc
    
    1 回复  |  直到 9 年前
        1
  •  0
  •   Dennis    9 年前

    在您的示例中,您覆盖了原型方法 p (以及 m )在的构造函数中 A ,这意味着每次创建实例时,原型方法都会发生变化。的所有实例 A. 然后将使用相同的方法,这是最后创建的实例之一。

    看看这个示例,它应该显示您对代码的预期行为:

    function A() {
      this.b = "bbb";
    }
    
    A.prototype.p = function() {
      console.log(this.b);
    };
    
    A.prototype.m = function() {
      this.b = "ccc";
    };
    
    
    var x = new A(),
      y = new A();
    
    x.m();
    x.p();
    y.p();