1. 程式人生 > >javascript屬性之get/set

javascript屬性之get/set

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