浅谈js中对象的使用

来源：互联网发布：linux项目案例编辑：程序博客网时间：2024/05/22 12:57

简单记录javascript中对象的使用

一、创建对象

?
1
2
3
4
5
6
7
8
9
10
//创建一个空对象
  varo={};
  //创建一个含有两个属性的对象，x、y
  varo2={x:12,y:'12',name:'JS'};
  //此对象中的author属性的值还是一个对象
  varo3={x:12,author:{name:'JS',age:23,address:'china'}};
  //创建一个空对象和{}一样
  varo4=new Object();
  //给对象增加name属性
  o4.name='JS'

上面使用了两种方式创建对象，一种是字面量的方式，另一种是使用new创建对象，new后面的Object叫做构造函数。

二、对象的访问

从上面我们可以看到我们给对向o4增加了一个属性name，使用的是点号的方式，即对象名.属性名，这就是其中的一种访问方式。访问对象中的属性值有两种方式，第一种是使用点号（.），第二种是使用数组的方式（对象名[属性名]）。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
//创建一个空对象
  varo={};
  //创建一个含有两个属性的对象，x、y
  varo2={x:12,y:'12',name:'JS'};
  //此对象中的author属性的值还是一个对象
  varo3={x:12,author:{name:'JS',age:23,address:'china'}};
  //创建一个空对象和{}一样
  varo4=new Object();
  //给对象增加name属性
  o4.name='JS'
  /**访问对象的属性值
  */
  //1、使用点号的方式
  varx=o2.x;//12
  varauthorOfName=o3.author.name;//JS
  varname=o4.name;//JS
   
  //2、使用数组的方式
  varx2=o2['x'];//12
  varauthorOfName2=o3['author']['name'];//JS
  varname2=o4['name'];//JS

使用点号的方式来访问对象中的属性值比较好理解，但是使用数组的方式，不是太好理解，在javascript中，所有的对象都是关联数组，所谓关联数据就是这种方式看起来像是数组的访问方式，只不过这种方式不是使用的索引而是字符串索引，为此叫做关联数组。

上面访问对象属性值都是在知道对象属性名的情况，如果不知道对象的属性值呢？可以使用for/in循环遍历对象中的值，

?
1
2
3
4
5
6
7
8
//创建一个含有两个属性的对象，x、y、name
  varo2={x:12,y:'12',name:'JS'};
  for(pin o2) {
    varproperty=p;
    varvalue=o2[p];
    console.log(property);
    console.log(value);
  }

打印结果为：

?
1
2
3
4
5
6
x
12
y
12
name
JS

可以看出一共有三个属性，且都打印了其值。

假如对象比较复杂可以加入一些判断，判断是否存在一个属性，那么如何判断一个对象是否包含了某个属性呢，由于对象都继承了Object，在Object中有hasOwnProperty()方法，用来判断对象中是否存在一个属性，返回值是布尔类型（boolean），注意此方法只会判断是否存在对象自己的属性，不会判断对象继承的属性。

?
1
2
3
4
//创建一个含有两个属性的对象，x、y、name
  varo2={x:12,y:'12',name:'JS'};
  varb=o2.hasOwnProperty('name')//true
  varb2=o2.hasOwnProperty('age')//false

三、新增、删除属性

在最开始我们给对象o4新增了一个name属性，新增的方式其实和给属性赋值是一样的，还可以使用关联数组的方式给对象增加属性，

?
1
2
3
4
5
6
7
8
9
10
//创建一个含有两个属性的对象，x、y、name
  varo2={x:12,y:'12',name:'JS'};
  //删除name属性
  deleteo2.name;
  varb=o2.hasOwnProperty('name')//false
  //新增name属性
  o2['name']='javascript';
  //由于已经存在了name属性，这里是给name重新赋值
  o2.name='js';
  varb3=o2.hasOwnProperty('name');//true

上面，删除了对象o2的name属性，然后又使用关联数组的方式新增了name属性，接着使用点号的方式给name属性重新赋值。

四、对象和字符串之间的转化

在ECMAScript5中内置了对象和字符串之间的相互转化，现在大多数主流浏览器都支持ECMAScript5，如果不支持可以从网上下载json2.js类库，把此类库引入到文件中便可以使用。

对象和字符串之间的转化叫做对象序列化，即将对象的状态转化为字符串或者将字符串转化为对象，这些转化都使用JSON作为数据交换格式，JSON的全称是JavaScript Object Notation。

把对象转化为字符串使用JSON.stringify()；把字符串转化为对象使用JSON.parse()，

?
1
2
3
4
5
6
7
8
9
10
11
12
//定义一个对象
  varo={name:'JavaScript',age:24};
  //此种方式在转化为对象是报错，必须使用下面的方式
  //var str="{name:'JavaScript',age:24}";
  //正确的定义对象字符串
  varstr='{"name":"JavaScript","age":24}';
  //把对象转化为字符串
  varstr2=JSON.stringify(o);
  console.log('str2:'+str2+',类型：'+(typeofstr2));//str2:{"name":"JavaScript","age":24},类型：string
  //把字符串转化为对象
  varo2=JSON.parse(str);
  console.log('o2:'+o2+',类型：'+(typeofo2));//o2:[object Object],类型：object

上面实现了对象和字符串之间的相互转化。

以上这篇浅谈js中对象的使用就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

阅读全文

0 0