javascript - 为对象的属性“a”赋值时，我希望同一对象的属性“b”发生变化（基于值属性 a）

Question

我希望属性的值在.cName属性更改时自动.c更改。

const NameList = {
    1: 'Once',
    2: 'Twice',
    3: 'Thrice'
}

// my new "class" object
function JimsObject(a, b, c, d) {

    this.a = a;
    this.b = b;
    this.c = c;
    this.d = d;
    this.cName = NameList[c];
    
}



var jimbo = new JimsObject();
jimbo.a = 48;
jimbo.b = "blah";
jimbo.c = 2;


console.log( jimbo.cName );
// Wanting output of 'Twice'

我希望输出/值是Twice

JavaScript 相当新……任何帮助将不胜感激！

Answer 1

您可以为属性定义getter和setter 。c

const NameList = {
  1: 'Once',
  2: 'Twice',
  3: 'Thrice'
}

// my new "class" object
function JimsObject(a, b, c, d) {
  this.a = a;
  this.b = b;
  let cVal = c;
  let that = this;
  Object.defineProperty(this, 'c', {
    get(){
      return cVal;
    },
    set(newVal){
      cVal = newVal;
      that.cName= NameList[cVal];
      return cVal;
    }
  });
  this.d = d;
  this.cName = NameList[c];
}



var jimbo = new JimsObject();
jimbo.a = 48;
jimbo.b = "blah";
jimbo.c = 2;


console.log(jimbo.cName);

您也可以只为该cName属性定义一个 getter。

const NameList = {
  1: 'Once',
  2: 'Twice',
  3: 'Thrice'
}

// my new "class" object
function JimsObject(a, b, c, d) {
  this.a = a;
  this.b = b;
  this.c = c;
  let that = this;
  Object.defineProperty(this, 'cName', {
    get(){
      return NameList[that.c];
    }
  });
  this.d = d;
}



var jimbo = new JimsObject();
jimbo.a = 48;
jimbo.b = "blah";
jimbo.c = 2;


console.log(jimbo.cName);

Answer 2

您在执行时没有给函数任何参数，因此它们都是未定义的，我假设您在类的构造中会遇到一些错误。

您必须在函数参数中传递变量。

var jimbo = new JimsObject(48, "blah", 2);加上d您似乎没有在任何地方使用的第四个参数。

还要考虑给你的变量起更有意义的名字！

进一步，考虑使用数组而不是对象！您必须从 0 及以上开始索引，而不是从 1 及以上开始。

const NameList = [ "Once", "Twice", "Thrice" ];

NameList[0]会回来Once的。

Answer 3

除非您使用代理，否则您无法监听 javascript 对象中的原始值更改，这对初学者来说有点复杂，因此替代方法是在您的类中使用 setter 函数。

你可以这样做：

const NameList = {
    1: 'Once',
    2: 'Twice',
    3: 'Thrice'
    }

// my new "class" object
function JimsObject(a, b, c, d) {

    this.a = a;
    this.b = b;
    this.c = c;
    this.d = d;
    this.cName = NameList[c];
    
}

JimsObject.prototype.setC = function (value) {
   this.c = value;
   this.cName = NameList[value];
}


var jimbo = new JimsObject();
jimbo.a = 48;
jimbo.b = "blah";

jimbo.setC(2);


document.write(jimbo.cName);
// Wanting output of 'Twice'

您还可以Object.defineProperty在更改该属性的值时调用 setter。

const NameList = {
    1: 'Once',
    2: 'Twice',
    3: 'Thrice'
    }

// my new "class" object
function JimsObject(a, b, c, d) {

    this.a = a;
    this.b = b;
    this._c = c;
    this.d = d;
    this.cName = NameList[c];
    
}

Object.defineProperty(JimsObject.prototype, "c", {
  get: function() {
    return this._c;
  },
  set: function(value) {
    this._c = value;
    this.cName = NameList[value];
  }
});


var jimbo = new JimsObject();
jimbo.a = 48;
jimbo.b = "blah";
jimbo.c = 2;


document.write(jimbo.cName);
// Wanting output of 'Twice'

Answer 4

您可以创建一个类 jimObject

const NameList = {
    1: 'Once',
    2: 'Twice',
    3: 'Thrice'
};

class JimObject {
    constructor(a, b, c, NameList){
        this.a = a;
        this.b = b;
        this.c = c;
        this.cName = NameList[c];
    }

    get name(){
        return this.cName
    }
}

let jimbo = new JimObject(48, 'blah', 2, NameList);

console.log(jimbo);
console.log(jimbo.name);