mootools_使用MooTools的自定義Getter和Setter

mootools

Working with Dojo all day and scoping out MooTools at night gives me a unique perspective; I get to constantly evaluate the two frameworks and mentally move functionalities from framework to framework. One small but handy feature within the Dojo Toolkit's Dijit UI Framework is its set/get system. Dijit allows developers to add custom methods tied into simple

get

and

set

methods to allow manipulation properties into and on the way out of a class. I took a few moments to implement this system in MooTools.

全天與Dojo一起工作，晚上與MooTools合作，這給了我獨特的見解。 我不斷地評估這兩個架構，并在功能上從一個架構移到另一個架構。 Dojo Toolkit的Dijit UI架構中的一個小巧但友善的功能是它的設定/擷取系統。 Dijit允許開發人員添加與簡單的

get

和

set

方法綁定的自定義方法，以允許操縱屬性進入和退出類。 我花了一些時間在MooTools中實作此系統。

The idea is that a Class instance has properties:

這個想法是Class執行個體具有屬性：

var MyClass = new Class({
	value: 10/*, more... */
});
           

Instead of simply setting and getting object properties directly, sometimes they need to be treated before coming in or going out. For setting, it can be a sort of internal formatting or validation. For getting, it's mostly formatting. The method formats are

_get[SomeAttrName]Attr

and

_set[SomeAttrName]Attr

. With that in mind, it's time to create the mixin class.

除了直接設定和擷取對象屬性外，有時還需要在進入或退出之前對它們進行處理。 對于設定，它可以是一種内部格式或驗證。 為了獲得，它主要是格式化。 方法格式為

_get[SomeAttrName]Attr

和

_set[SomeAttrName]Attr

。 考慮到這一點，是時候建立mixin類了。

MooToolsJavaScript GetSet (JavaScript GetSet for MooTools)

This new functionality will be independently coded as a class meant as a

Class

mixin using the Implements property:

可以使用Implements屬性将該新功能獨立編碼為一個類，表示為

Class

mixin：

(function() {
	
	// Turns "thisPropertyName" into "ThisPropertyName"
	function getFunctionName(key, getSet) {
		return "_" + getSet + key.charAt(0).toUpperCase() + key.slice(1) + "Attr";
	}
	
	// Implement the getter / setter
	this.GetSet = new Class({
		// A custom getter that looks for _get
		get: function(key) {
			var fn = this[getFunctionName(key, "get")];
			return (fn && fn.call(this, key)) || this[key];
		},
		set: function(key, value) {
			var fn = this[getFunctionName(key, "set")];
			if(fn) {
				fn.call(this, value);
			}
			else {
				this[key] = value;
			}
			// Returning "this" to allow chaining
			return this;
		}
	});
	
})();
           

The GetSet will feature two method, get and set, and will check for the presence of custom

set

and

get

methods; if so, those methods are called, and if not, the property is simply set or returned. Now let's look at a sample usage:

GetSet将具有兩種方法，即get和set，并将檢查是否存在自定義

set

和

get

方法。 如果是這樣，則将調用這些方法，否則，将僅設定或傳回該屬性。 現在讓我們看一個示例用法：

// Create a test class
var TestClass = new Class({
	// Implement the new class
	Implements: [GetSet],
	// The custom getter
	_getValueAttr: function() {
		return this.value / 10;
	},
	// The custom setter
	_setValueAttr: function(value) {
		this.value = value * 10;
	}
});

// Create a test class instance
var inst = new TestClass({
	value: 8
});

/*
	inst.set("value", 20);  // inst.value = 200
	inst.get("value");  // inst.value = 20
*/
           

In this case, we've set custom get and set methods which will handle the class' value property. On the way in, the value is multiple by 10 and then set on the object. On the way out, the value is divided by 10. Of course, not the most realistic of scenarios, but this example provides a very simple illustration of how these methods can be used.

在這種情況下，我們設定了自定義的get和set方法，這些方法将處理類的value屬性。 進來時，該值是10的倍數，然後在對象上設定。 在輸出時，該值除以10。當然，這不是最實際的方案，但是此示例提供了有關如何使用這些方法的非常簡單的說明。

So what would be a more realistic scenario? As I said above, custom setters can be very useful as an internal validator. Both the getters and setters are valuable, however, because they also provide a way to "spy" on object properties and have multiple reactions to their changes.

那麼，哪種情況更現實呢？ 如上所述，自定義設定器作為内部驗證器非常有用。 但是，擷取器和設定器都很有價值，因為它們還提供了一種“監視”對象屬性的方式，并且對其更改有多種React。

翻譯自: https://davidwalsh.name/get-set

mootools