javascript屬性之get/set
阿新 • • 發佈:2017-06-24
pro {} fig writable java color get方法 return size
var o = {
get x(){
return 7;
},
set x(val){
console.info("不能設置x的值");
}
}
o.x //7 讀取x值的時候,會使用get方法
o.x = 9 //不能設置x的值 賦值x時,會使用set方法
get/set與原型鏈
//不包含get/set的原型
function p(){}
p.prototype.z = 9;
var p1 = new p();
p1.z //9 //對象上沒有屬性,將在原型鏈上查找
p1.z = 10; //原型上不包含get/set方法時,向原型上的同名屬性賦值,會在對象上添加此屬性
p1.z //10 //對象上能夠找到屬性,將不會在原型鏈上查找
//原型上包含get/set方法
function person(){} Object.defineProperty(person.prototype,‘z‘,{get:function(){return 1}}); var p = new person(); p.z //1 p.z = 89; p.z //still 1 原型鏈上get/set方法,操作此屬性的時候,會向上查找原型鏈。 所以p.z仍舊是1
//那個問題來了,在原型鏈上有get/set方法的時候,怎麽實現在對象上添加此屬性呢?
function foo(){}
Object.defineProperty(foo.prototype,‘z‘,{get:function(){return 1}})
var f = new foo();
f.z //1
f.z = 2;
f.z //still 1
Object.defineProperty(f,‘z‘,{value:100,configurable:true,writable:true});
f.hasOwnProperty(‘z‘) //true
f.z //100
f.z = 90;
f.z //90
delete f.z //true
f.hasOwnProperty(‘z‘) // false
f.z //1 回到原型鏈查找
javascript屬性之get/set