脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-JavaScript对象和属性分析，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

小宝典致力于为广大程序猿（媛）提供高品质的代码服务，请大家多多光顾小站，小宝典在此谢过。

JavaScript对象和属性分析，面向对象(Object-Oriented，OO)的语言有一个标志，那就是它们都有类的概念，而通过类可以创建任意多个具有相同属性和方法的对象。ECMA-262把对象定义为：“无序属性的集合，其属性可以包含基本值、对象或者函数。”严格来讲，这就相当于说对象是一组没有特定顺序的值，对象的每个属性或方法都有一个名字，而每个名字都映射到一个值。

一、理解对象

创建自定义对象的最简单方式就是创建一个object的实例，然后再为它添加属性和方法，如下所示：

[javascript]view plaincopy

VARPErson=newObject();

person.name='myName';

person.age=18;

person.getName=function(){

returnthis.name;

}

早期的JavaScript开发人员经常使用这个模式创建新对象，几年后，对象字面量成为创建这种对象的首选模式。(比较清楚的查找对象包含的属性及方法)

[javascript]view plaincopy

varperson={

name:'Myname',

age:18,

getName:function(){

returnthis.name;

}

}[javascript]view plaincopy

varobj=Object.create({x:1});

obj.x//1

typeofobj.toString//"function"

obj.hasOwnProperty('x');//false

varobj=Object.create(null);

obj.toString//undefined[javascript]view plaincopy

varperson={age:28,tITle:'fe'};

deleteperson.age;//true

deleteperson['title'];//true

person.age;//undefined

deleteperson.age;//true

deleteObject.PRototype;//false,

vardescriptor=Object.getOwnPropertyDescriptor(Object,'prototype');

descriptor.configurable;//false

//删除全局变量

varglobalVal=1;

deleteglobalVal;//false

//删除局部变量

(function(){

varlocalVal=1;

returndeletelocalVal;

}());//false

//删除函数声明

functionfd(){}

deletefd;//false

(function(){

functionfd(){};

returndeletefd;

}());//false

//删除隐式全局变量

ohNo=1;

window.ohNo;//1

deleteohNo;//true 对象标签和对象序列化：[javascript]view plaincopy

vartoString=Object.prototype.toString;

functiongetType(o){returntoString.call(o).slice(8,-1);};

toString.call(null);//"[objectNull]"

getType(null);//"Null"

getType(undefined);//"Undefined"

getType(1);//"Number"

getType(newNumber(1));//"Number"

typeofnewNumber(1);//"object"

getType(true);//"Boolean"

getType(newBoolean(true));//"Boolean" (2)、extensible标签 [javascript]view plaincopy

varobj={x:1,y:2};

Object.isExtensible(obj);//true

Object.preventextensions(obj);

Object.isExtensible(obj);//false

obj.z=1;

obj.z;//undefined,addnewpropertyfailed

Object.getOwnPropertyDescriptor(obj,'x');

//Object{value:1,writable:true,enumerable:true,configurable:true}

Object.seal(obj);

Object.getOwnPropertyDescriptor(obj,'x');

//Object{value:1,writable:true,enumerable:true,configurable:false}

Object.isSealed(obj);//true

Object.freeze(obj);

Object.getOwnPropertyDescriptor(obj,'x');

//Object{value:1,writable:false,enumerable:true,configurable:false}

Object.isFrozen(obj);//true

//[caution]notaffectsprototypechain!!! (3)、序列化 [javascript]view plaincopy

varobj={x:1,y:true,z:[1,2,3],nullVal:null};

JSON.stringify(obj);//"{"x":1,"y":true,"z":[1,2,3],"nullVal":null}"

obj={val:undefined,a:NaN,b:Infinity,c:newDate()};

JSON.stringify(obj);//"{"a":null,"b":null,"c":"2015-01-20T14:15:43.910Z"}"

obj=JSON.parse('{"x":1}');

obj.x;//1 (4)、自定义序列化 [javascript]view plaincopy

varobj={

x:1,

y:2,

o:{

o1:1,

o2:2,

toJSON:function(){

returnthis.o1+this.o2;

}

}

};

JSON.stringify(obj);//"{"x":1,"y":2,"o":3}"

二、属性类型

ECMA-262第5版定义只有内部采用的特性(attribute)时，描述了属性(property)的各种特征。ECMA-262定义这些特性是为了实现JavaScript引擎用的，因此JavaScript中不能直接访问它们。为了表示特性是内部值，该规范把它们放在了两对儿方括号中，例如[[Enumerable]].

ECMAScript中有两种属性：数据属性和访问器属性

1、数据属性：

数据属性指包含一个数据值的位置，可在该位置读取或写入值，该属性有4个供述其行为的特性：

[[configurable]]:表示能否使用delete操作符删除从而重新定义，或能否修改为访问器属性。默认为true;

[[Enumberable]]:表示是否可通过for-in循环返回属性。默认true;

[[Writable]]:表示是否可修改属性的值。默认true;

[[Value]]:包含该属性的数据值。读取/写入都是该值。默认为undefined;如上面实例对象person中定义了name属性，其值为’My name’,对该值的修改都反正在这个位置。

要修改对象属性的默认特征(默认都为true)，可调用Object.defineProperty()方法，它接收三个参数：属性所在对象、属性名和一个描述符对象(必须是：configurable、enumberable、writable和value，可设置一个或多个值)。可以修改对应的特性值。例如：浏览器支持：IE9+、Firefox 4+、Chrome、Safari5+)

[javascript]view plaincopy

varperson={};

Object.defineProperty(person,'name',{

configurable:false,

writable:false,

value:'Jack'

});

alert(person.name);//Jack

deleteperson.name;

person.name='lily';

alert(person.name);//Jack

可以看出，delete及重置person.name的值都没有生效，这就是因为调用defineProperty函数修改了对象属性的特征;值得注意的是一旦将configurable设置为false，则无法再使用defineProperty将其修改为true(执行会报错：can't redefine non-configurable property);在调用Object.defineProperty()方法时，如果不指定，configurable、enumberable和writable特性默认值都是false。

2、访问器属性：

它主要包括一对getter和setter函数，在读取访问器属性时，会调用getter返回有效值;写入访问器属性时，调用setter，写入新值;该属性有以下4个特征：

[[Configurable]]:是否可通过delete操作符删除重新定义属性;

[[Numberable]]:是否可通过for-in循环查找该属性;

[[Get]]:读取属性时调用，默认：undefined;

[[Set]]:写入属性时调用，默认：undefined;

访问器属性不能直接定义，必须使用defineProperty()来定义，如下：

[javascript]view plaincopy

varperson={

_age:18

};

Object.defineProperty(person,'isAdult',{

get:function(){

if(this._age>=18){

returntrue;

}else{

returnfalse;

}

}

});

alert(person.isAdult?'成年':'未成年');//成年[javascript]view plaincopy

Object.defineProperties(person,{

title:{value:'fe',enumerable:true},

corp:{value:'BABA',enumerable:true},

salary:{value:50000,enumerable:true,writable:true},

luck:{

get:function(){

returnMath.random()>0.5?'good':'bad';

}

},

promote:{

set:function(level){

this.salary*=1+level*0.1;

}

}

});

Object.getOwnPropertyDescriptor(person,'salary');

//Object{value:50000,writable:true,enumerable:true,configurable:false}

Object.getOwnPropertyDescriptor(person,'corp');

//Object{value:"BABA",writable:false,enumerable:true,configurable:false}

person.salary;//50000

person.promote=2;

使用Object.getOwnPropertyDescriptor()方法可以取得给定属性的特性，这个方法接收两个参数：属性所在的对象和要读取其描述的属性名称。返回值是一个对象，如果是访问器属性，这个对象的属性有configurable,enumberable，

属性getter/setter方法实例：

[javascript]view plaincopy

varman={

name:'Bosn',

weibo:'@Bosn',

getage(){

returnnewDate().getFullYear()-1988;

},

setage(val){

console.LOG('Agecan/'tbesetto'+val);

}

}

console.log(man.age);//27

man.age=100;//Agecan'tbesetto100

console.log(man.age);//still27

[javascript]view plaincopy

varman={

weibo:'@Bosn',

$age:null,

getage(){

if(this.$age==undefined){

returnnewDate().getFullYear()-1988;

}else{

returnthis.$age;

}

},

setage(val){

val=+val;

if(!isNaN(val)&&val>0&amp;&val<150){

this.$age=+val;

}else{

thrownewError('Incorrectval='+val);

}

}

}

console.log(man.age);//27

man.age=100;

console.log(man.age);//100;

man.age='abc';//error:Incorrectval=NaN

[javascript]view plaincopy

functionfoo(){}

Object.defineProperty(foo.prototype,'z',{

get:function(){

return1;

}

});

varobj=newfoo();

obj.z;//1

obj.z=10;

obj.z;//still1

Object.defineProperty(obj,'z',{

value:100,configurable:true

}

);

obj.z;//100;

deleteobj.z;

obj.z;//backto1

varo={};

Object.defineProperty(o,'x',{value:1});//writable=false,configurable=false

varobj=Object.create(o);

obj.x;//1

obj.x=200;

obj.x;//still1,can'tchangeit

Object.defineProperty(obj,'x',{writable:true,configurable:true,value:100});

obj.x;//100

obj.x=500;

obj.x;//500[javascript]view plaincopy

vardescriptor=Object.getOwnPropertyDescriptor(person,'_age');

alert(descriptor.value);//19

alert(descriptor.configurable);//false

alert(typeofdescriptor.get);//undefined

觉得可用，就经常来吧！ 脚本宝典 欢迎评论哦！ js脚本，巧夺天工，精雕玉琢。小宝典献丑了！

脚本宝典总结

以上是脚本宝典为你收集整理的javascript代码实例教程-JavaScript对象和属性分析全部内容，希望文章能够帮你解决javascript代码实例教程-JavaScript对象和属性分析所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。