JavaScript访问器(Getter和Setter),ECMAScript 5(2009)介绍了Getter和Setters。 Getters和setter允许您定义对象访问器(Computed Properties)。
JavaScript Getter(get关键字)
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>js</title>
<body>
<h2>JavaScript Getters和Setters</h2>
<p> Getters和setter允许您通过方法获取和设置属性。</p>
<p>此示例使用lang属性获取语言属性的值。</p>
<p id="demo"></p>
<script>
// 新建一个对象。
var person = {
firstName: "John",
lastName : "Doe",
language : "en",
get lang() {
return this.language;
}
};
// 使用getter显示来自对象的数据:
document.getElementById("demo").innerHTML = person.lang;
</script>
</body>
</html>
JavaScript Setter (set关键字)
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>JavaScript Getters和Setters</title>
<body>
<h2> JavaScript Getters和Setters </h2>
<p> Getters和setter允许您通过方法获取和设置属性。</p>
<p>此示例使用lang属性设置语言属性的值。</p>
<p id="demo"></p>
<script>
// Create an object:
var person = {
firstName: "John",
lastName : "Doe",
language : "NO",
set lang(value) {
this.language = value;
}
};
// Set a property using set:
person.lang = "en";
// Display data from the object:
document.getElementById("demo").innerHTML = person.language;
</script>
</body>
</html>
为什么使用Getter和Setter?
它提供了更简单的语法
它允许属性和方法的语法相同
它可以确保更好的数据质量
在幕后做事情很有用
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>js</title>
<body>
<h2> JavaScript Getters和Setters </h2>
<p>完美的创建反对象:</p>
<p id="demo"></p>
<script>
var obj = {
counter : 0,
get reset() {
this.counter = 0;
},
get increment() {
this.counter++;
},
get decrement() {
this.counter--;
},
set add(value) {
this.counter += value;
},
set subtract(value) {
this.counter -= value;
}
};
// Play with the counter:
obj.reset;
obj.add = 5;
obj.subtract = 1;
obj.increment;
obj.decrement;
// Display the counter:
document.getElementById("demo").innerHTML = obj.counter;
</script>
</body>
</html>
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。