Question

我有这门课。

function cnv(){
   this.attribute1;
}

所以，当我这样做时，我需要它：

var c = new cnv();

c.attribute1 = 'rojo';

如果我在我的aatributes中做了一些更改，对于例如aatribute1，这会调用一些方法：

cnv.prototype.method1 = function (){
    ...code
}

所以基本上我需要知道当我在班级中更改某个属性时，此更改可以调用某个函数作为方法，谢谢;）

if -->> c.attribute1 = 'blue'   -->> then(beacuase of change on attr) -->> method1

Answer 1

您可以使用Javascript的observe功能。

按照以下示例代码：

var model = {};
Object.observe(model, function(changes){
    changes.forEach(function(change) {
        console.log(change.type, change.name, change.oldValue);
    });
});

Answer 2

您可以使用Object.defineProperty执行此操作，并为对象创建自定义getter / setter。在下面的示例中，您将看到一个简单的可观察类，它接受您希望观察的属性数组，并在观察到的属性值发生更改时调用已更改的方法。

这里只是作为一个示例类，所以我可以展示它的原理:)随意改变它你喜欢

（ps：我稍微更新了代码，因此它会对按键做出反应，并且您会看到通过的更改;）

function Observable(props) {
  if (!this instanceof Observable) 
    return new Observable(props);
  
  var values = {}, define = function(target, propName, propHolder) {
      Object.defineProperty(target, propName, {
        get: function() {
          return propHolder[propName];
        },
        set: function(value) {
          if (value === propHolder[propName]) {
            return;
          } 
          var oldValue = propHolder[propName];
          propHolder[propName] = value;
          if (target.changed && target.changed.apply) {
            target.changed.apply(target, [propName, oldValue, value]);
          }
        },
        configurable: false
      });
  };
  
  if (props) {
    for (var i = 0, len = props.length; i < len; i++) {
      define(this, props[i], values);
    }
  }
    
  this.changed = function(property, oldValue, newValue) {
    // this changed
    var el = document.getElementById('log');
    if (el) {
      el.innerHTML += '<p><b>' + property + '</b>: Changed from <i>' + oldValue + '</i> to <i>' + newValue + '</i></p>';
    }
    console.log(property + ' changed from ' + oldValue + ' to ' + newValue);
  }
}
  
var model = new Observable(['value']);

window.addEventListener('load', function() {
  // demonstrating the changes
  model.value = 'test';
  model.value = 'sample';
  model.value = '';
});

function update(sourceElement) {
  var att = sourceElement.getAttribute('data-id'),
      mod = sourceElement.getAttribute('data-model');
  
  window[mod][att] = sourceElement.value;
}

<input id="item" type="text" onkeyup="update(this);" onchange="update(this);" data-id="value" data-model="model" />
<div id="log">
</div>

Answer 3

我只使用一个方法将其改变为另一个类，在framerequest动画中，感谢大家btw。

注意：Object.observe在所有navegators中都不起作用：'（.. @Achu

Clases / Methods / Attributes Javascript错误

3 个答案: