js中Object.defineProperty()方法的不详解(2)

var user ={ name:"狂奔的蜗牛", age:25 } ; //定义一个性别 可以被删除和重新定义特性 Object.defineProperty(user,"gender",{ value:"男", enumerable:true, configurable:true }) //删除前 console.log(user); // {name: "狂奔的蜗牛", age: 25, gender: "男"} //删除一下 delete user.gender; console.log(user); // {name: "狂奔的蜗牛", age: 25} //重新定义特性 Object.defineProperty(user,"gender",{ value:"男", enumerable:true, configurable:false }) //删除前 console.log(user); // {name: "狂奔的蜗牛", age: 25, gender: "男"} //删除一下 删除失败 delete user.gender; console.log(user); // {name: "狂奔的蜗牛", age: 25, gender: "男"}

总结 configurable设置为 true 则该属性可以被删除和重新定义特性;反之属性是不可以被删除和重新定义特性的,默认值为false(Ps.除了可以给新定义的属性设置特性,也可以给已有的属性设置特性哈)

最后我们来说说,最重要的两个属性 set和get(即存取器描述:定义属性如何被存取),这两个属性是做什么用的呢?我们通过代码来看看

var user ={ name:"狂奔的蜗牛" } ; var count = 12; //定义一个age 获取值时返回定义好的变量count Object.defineProperty(user,"age",{ get:function(){ return count; } }) console.log(user.age);//12 //如果我每次获取的时候返回count+1呢 var user ={ name:"狂奔的蜗牛" } ; var count = 12; //定义一个age 获取值时返回定义好的变量count Object.defineProperty(user,"age",{ get:function(){ return count+1; } }) console.log(user.age);//13

接下来我不用解释了吧,你想在获取该属性的时候对值做什么随你咯~

来来来,我们看看 set,不多说上代码

var user ={ name:"狂奔的蜗牛" } ; var count = 12; //定义一个age 获取值时返回定义好的变量count Object.defineProperty(user,"age",{ get:function(){ return count; }, set:function(newVal){ count=newVal; } }) console.log(user.age);//12 user.age=145; console.log(user.age);//145 console.log(count);//145 //等等,如果我想设置的时候是 自动加1呢?我设置145 实际上设置是146 var user ={ name:"狂奔的蜗牛" } ; var count = 12; //定义一个age 获取值时返回定义好的变量count Object.defineProperty(user,"age",{ get:function(){ return count; }, set:function(newVal){ count=newVal+1; } }) console.log(user.age);//12 user.age=145; console.log(user.age);//146 console.log(count);//146

说明 注意:当使用了getter或setter方法,不允许使用writable和value这两个属性(如果使用,会直接报错滴)

get 是获取值的时候的方法,类型为 function ,获取值的时候会被调用,不设置时为 undefined

set 是设置值的时候的方法,类型为 function ,设置值的时候会被调用,undefined

get或set不是必须成对出现,任写其一就可以

var user ={ name:"狂奔的蜗牛" } ; var count = 12; //定义一个age 获取值时返回定义好的变量count Object.defineProperty(user,"age",{ get:function(){ console.log("这个人来获取值了!!"); return count; }, set:function(newVal){ console.log("这个人来设置值了!!"); count=newVal+1; } }) console.log(user.age);//12 user.age=145; console.log(user.age);//146

js中Object.defineProperty()方法的不详解


【完结】

Object.defineProperty方法直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象

value: 设置属性的值

writable: 值是否可以重写。true | false

enumerable: 目标属性是否可以被枚举。true | false

configurable: 目标属性是否可以被删除或是否可以再次修改特性 true | false

set: 目标属性设置值的方法

get:目标属性获取值的方法

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/e20e014292a386bad49480ca58657c65.html