js 中对象属性特性的描述
2016-02-13 19:36
866 查看
如何自定义属性的特性?
用对象.属性的特性和自定义的属性的特性有什么区别?
它的四大特性 writable enumerable configable 有什么区别?
[b]先预习一个用对象.属性定义 ,属性的四大特性是以什么方式呈现的。[/b]
[b]这时个属性的三大特性默认值都为true。[/b]
[b]代码演示:[/b]
[b] 如何用Object.defineProperty自定义属性的特性[/b]
[b] 语法 :[/b]
Object.defineProperyty(obj,prop,descriptor)
obj: 需要定义的对象
prop:需要定义 或修改的属性名
descriptor:属性定义或修改的属性描述
该方法允许精确添加或修改对象的属性,正常属性添加通过赋值来创建并显示在属性枚举中(for in 循环或Object.keys()方法),这种 方式添加的属性值可能被改变,也可能会被删除。该方法允许改变这些额外细节默认设置。
configureable:当且仅当这个属性描述符值为true时,该属性可能会改变,也可能会被从相应的对象删除。默认为false.
enumerable:true当且仅当该属性出现在相应的对象枚举属性中。默认为false.
value:与属性有关的值。可以是任何有效的javascript值。默认为undefined.
writable:true当且仅当可能用赋值运算符改变与属性相关的值。默认为false.
第一种方式,当不设定三大属性时?
代码演示如下:
[b]第二种方式,当三大属性都为true时,又有什么不同?[/b]
[b]再来深入了解configurable配置项.[/b]
[b]当configurable为flase时 对属性从定义其特性时writable,enumerable的情况如何?[/b]
[b]当configurable为true时 对属性从定义其特性时writable,enumerable的情况如何?[/b]
用对象.属性的特性和自定义的属性的特性有什么区别?
它的四大特性 writable enumerable configable 有什么区别?
[b]先预习一个用对象.属性定义 ,属性的四大特性是以什么方式呈现的。[/b]
[b]这时个属性的三大特性默认值都为true。[/b]
[b]代码演示:[/b]
<script> //用对象.属性定义的属性,它的三大特性都为true function Foo(){} Foo.prototype.age = 22 var obj = new Foo() obj.name = "ziksang" obj.addr = "上海" obj.telephone = 15921848427 console.log(obj.name)//=>ziksang obj.name = "博客园" //修改了name属性的值 console.log(obj.name) //=>博客园 因为此时定义的方式 writable为true,所以可以修改name的属性值 for( var p in obj){ //因为此时定义的方式,enumerable为true, 此时也是可以枚举的, console.log(p) //用for in枚举可以把对象原型上的属性也枚举出来,因为原型上的属性也是用此定义属性,所以他的enumerable也为true } console.log(Object.keys(obj)) //用Object.keys(obj)方式枚举只能枚举对象自有的属性 delete obj.addr //删除对象上addr属性 console.log(obj.addr) //=>undefined 因为用此定义时他的configurable为true,所以是可以删除对象的 Foo.prototype.age = 33 //对于三大特性,我对原型上的属性只做了一个修改的特性,因为原型上定义的方式如果也是对象.属性定义的话,跟对象属性的三大特性一样,在此就不一一举例了 console.log(Foo.prototype.age) //=>33 </script>
[b] 如何用Object.defineProperty自定义属性的特性[/b]
[b] 语法 :[/b]
Object.defineProperyty(obj,prop,descriptor)
obj: 需要定义的对象
prop:需要定义 或修改的属性名
descriptor:属性定义或修改的属性描述
该方法允许精确添加或修改对象的属性,正常属性添加通过赋值来创建并显示在属性枚举中(for in 循环或Object.keys()方法),这种 方式添加的属性值可能被改变,也可能会被删除。该方法允许改变这些额外细节默认设置。
configureable:当且仅当这个属性描述符值为true时,该属性可能会改变,也可能会被从相应的对象删除。默认为false.
enumerable:true当且仅当该属性出现在相应的对象枚举属性中。默认为false.
value:与属性有关的值。可以是任何有效的javascript值。默认为undefined.
writable:true当且仅当可能用赋值运算符改变与属性相关的值。默认为false.
第一种方式,当不设定三大属性时?
代码演示如下:
<script> //如果用自定义Object.defineProperty方式来自定义属性的话,没有设置三大属性为true时,默认为false,看看在默认情况下会如何 function Foo(){} Foo.prototype.age = 22 var obj = new Foo() obj.name = "ziksang" Object.defineProperty(obj,"telephone",{ value:15921848427 //这个语句的意思就是在obj对象上创建了一个telephone属性,设定它的值为15921848427,对它的三大属性没有任何设置,此时三大属性为默认false }) console.log(obj.telephone) //因为上面自定义时赋值为15921848427,所以获取值为159.... obj.telephone = 110 //此处我修改其属性值 console.log(obj.telephone) //结果输出结果还是159....因为writable是默认值false,所以是不可修改的 for(var p in obj){ //此处输出结果为 name,age 因为用for in枚举的是对象自身属性和原型上的属性,为什么没有telephone呢?因为此时obj对象上属性的特性enumerable也是默认false console.log(p) } console.log(Object.keys(obj)) //此处输出结果为name,因为用object.keys枚举的是对象自身的属性 delete obj.telephone; //删除telephone属性 console.log(obj.telephone) //因为自定义的属性特性默认值为false 所以是不可以删除的 //对象上的原型也可以用此方法定义属性 Object.defineProperty(Foo.prototype,"addr",{ value:"上海" //对象原型上自定义一个属性addr 三大特性都为默认值 }) console.log(obj.addr); //=>上海 for( var k in obj){ //=>name,age 因为上面addr的enumerable默认值是false,所以也是不可以枚举的 console.log(k) } delete Foo.prototype.addr //=删除对象原型属性 console.log(obj.addr) //=>上海 因为对象原型上属性特性configurable默认为false,所以是不可删除的 </script>
[b]第二种方式,当三大属性都为true时,又有什么不同?[/b]
<script> //如果用自定义Object.defineProperty方式来自定义属性的话,设置三大属性为true时,看看以下情况又会如何 function Foo(){} Foo.prototype.age = 22 var obj = new Foo() obj.name = "ziksang" Object.defineProperty(obj,"telephone",{ value:15921848427, writable:true, enumerable:true, configurable:true//这个语句的意思就是在obj对象上创建了一个telephone属性,设定它的值为15921848427,对它的三大属性都设为true }) console.log(obj.telephone) //因为上面自定义时赋值为15921848427,所以获取值为159.... obj.telephone = 110 //此处我修改其属性值 console.log(obj.telephone) //结果输出结果还是110 因为writable是为true ,所以是可修改的 for(var p in obj){ //此处输出结果为 name,telephone,age 因为用for in枚举的是对象自身属性和原型上的属性,为什么没有telephone呢?因为此时obj对象上属性的特性enumerable也是默认false console.log(p) } console.log(Object.keys(obj)) //此处输出结果为name,telephone因为用object.keys枚举的是对象自身的属性 delete obj.telephone; //删除telephone属性 console.log(obj.telephone) //因为自定义的属性特configurable为false 所以是可以删除的 //对象上的原型也可以用此方法定义属性 Object.defineProperty(Foo.prototype,"addr",{ value:"上海", writable:true, enumerable:true, configurable:true//对象原型上自定义一个属性addr 三大特性都为true }) console.log(obj.addr); //=>上海 Foo.prototype.addr = "北京" console.log(obj.addr)//因为writable设为true,所以可以修改原型的属性,所以输出是北京 for( var k in obj){ //=>name,age,addr 因为上面addr的enumerable为true,所以也是可以枚举的 console.log(k) } delete Foo.prototype.addr //=删除对象原型属性 console.log(obj.addr) //=>undefined 因为对象原型上属性特性configurable为true,所以是可删除的 </script>
[b]再来深入了解configurable配置项.[/b]
[b]当configurable为flase时 对属性从定义其特性时writable,enumerable的情况如何?[/b]
<script> //如果用自定义Object.defineProperty方式来自定义属性的话,设置三大属性为true时,看看以下情况又会如何 function Foo(){} Foo.prototype.age = 22 var obj = new Foo() obj.name = "ziksang" Object.defineProperty(obj,"telephone",{ value:15921848427, writable:false,//如果把三大特性都设为false enumerable:false, configurable:false }) Object.defineProperty(obj,"telephone",{ writable:true, //再把writable 和enumerable再重新定义 enumerable:true }) //结果以下都报错,返回空数组,原因是configurable是一个配置项,当配置项为false时,其它两个特性则不能被重新定义 for(var p in obj){ console.log(p) } console.log(Object.keys(obj)) obj.name = "博客园" console.log(obj.name) </script>
[b]当configurable为true时 对属性从定义其特性时writable,enumerable的情况如何?[/b]
<script> //如果用自定义Object.defineProperty方式来自定义属性的话,设置三大属性为true时,看看以下情况又会如何 function Foo(){} Foo.prototype.age = 22 var obj = new Foo() obj.name = "ziksang" Object.defineProperty(obj,"telephone",{ value:15921848427, writable:false,//如果把configurable设为true,其它设为false时 enumerable:false, configurable:true }) Object.defineProperty(obj,"telephone",{ writable:true, //再把writable 和enumerable再重新定义 enumerable:true }) //以下都会返回结果,因可配置的特性configurable设为true,所以其它两个物性都可以从新定义为true for(var p in obj){ //=>name,age ,telephone console.log(p) } console.log(Object.keys(obj)) //=>name,telephone obj.name = "博客园" console.log(obj.name) //=>博客园 </script>
相关文章推荐
- JSON说明
- JavaScript中关联原型链属性特性
- JavaScript 笔记 5 - 条件语句
- JavaScript操作class和style样式代码详解
- JavaScript 笔记 4 - 运算符
- javascript基础:等号比较
- json-handle:json可视化工具
- Javascript中this关键字详解
- Javascript闭包——懂不懂由你,反正我是懂了
- js 中对象属性的特性
- JavaScript与正则表达式
- html转pdf,jsf实现下载功能
- jsp页面更改编码为utf-8
- JAVASCRIPT中的作用域和原型链,应该算是难点了,要好好多学学,练练
- javascript 编码规范 样例
- JavaScript公共函数
- jsp和servlet关于cookie无法保存与读取(删除)的问题
- 项目技术总结一之JSONP实现跨域调度
- javascript看视频笔记
- js替换指定字符串