JavaScript Koans项目：深入理解对象可变性-优快云博客

JavaScript Koans项目：深入理解对象可变性

javascript-koans Koans to learn Javascript 项目地址: https://gitcode.com/gh_mirrors/ja/javascript-koans

JavaScript作为一种灵活的动态语言，其对象的可变性(mutability)是一个核心概念。本文将通过JavaScript Koans项目中的AboutMutability测试用例，系统讲解JavaScript中对象属性的可变性特点。

对象属性的可变性基础

在JavaScript中，对象属性默认是可变的(mutable)，这意味着我们可以随时修改它们的值：

it("should expect object properties to be public and mutable", function () {
  var aPerson = {firstname: "John", lastname: "Smith" };
  aPerson.firstname = "Alan";

  expect(aPerson.firstname).toBe("Alan");
});

这个测试展示了最基本的对象属性修改。我们创建了一个包含firstname和lastname属性的对象，然后直接修改了firstname属性的值。这种直接修改在JavaScript中是允许且常见的操作。

构造函数创建的对象属性

当我们使用构造函数创建对象时，其属性同样具有可变性：

it("should understand that constructed properties are public and mutable", function () {
  function Person(firstname, lastname) {
    this.firstname = firstname;
    this.lastname = lastname;
  }
  var aPerson = new Person("John", "Smith");
  aPerson.firstname = "Alan";

  expect(aPerson.firstname).toBe("Alan");
});

这里我们定义了一个Person构造函数，通过new关键字创建实例后，仍然可以自由修改其属性。这说明通过构造函数创建的对象属性默认也是公开且可变的。

原型方法的可变性

JavaScript的原型继承系统中，原型上的方法也是可变的：

it("should expect prototype properties to be public and mutable", function () {
  function Person(firstname, lastname) {
    this.firstname = firstname;
    this.lastname = lastname;
  }
  Person.prototype.getFullName = function() {
    return this.firstname + " " + this.lastname;
  };

  var aPerson = new Person("John", "Smith");
  expect(aPerson.getFullName()).toBe("John Smith");

  aPerson.getFullName = function() {
    return this.lastname + ", " + this.firstname;
  };

  expect(aPerson.getFullName()).toBe("Smith, John");
});

这个测试展示了两个重要概念：

原型方法可以被实例访问
实例可以覆盖(override)原型方法

当我们在实例上定义同名方法时，它会"遮蔽"原型上的方法，但不会修改原型本身。

实现私有变量的模式

虽然JavaScript没有真正的私有属性，但我们可以通过闭包模拟私有变量：

it("should know that variables inside a constructor and constructor args are private", function () {
  function Person(firstname, lastname) {
    var fullName = firstname + " " + lastname;

    this.getFirstName = function() { return firstname; };
    this.getLastName = function() { return lastname; };
    this.getFullName = function() { return fullName; };
  }
  var aPerson = new Person("John", "Smith");

  aPerson.firstname = "Penny";
  aPerson.lastname = "Andrews";
  aPerson.fullName = "Penny Andrews";

  expect(aPerson.getFirstName()).toBe("John");
  expect(aPerson.getLastName()).toBe("Smith");
  expect(aPerson.getFullName()).toBe("John Smith");

  aPerson.getFullName = function() {
    return aPerson.lastname + ", " + aPerson.firstname;
  };

  expect(aPerson.getFullName()).toBe("Andrews, Penny");
});

这里展示了经典的JavaScript私有变量模式：