夺命雷公狗---javascript NO:25 属性的遍历、删除与成员方法

1、属性的遍历

在实际项目开发中，我们得到一个对象，如果想知道其包含了哪些属性或方法，那么可以使用for…in…循环语句进行遍历输出。

 

示例代码：

 

<!DOCTYPE html>
<html>
<head>
<meta charset=’utf-8′>
<title></title>
</head>
<body>
<script>
//定义一个Persion类
function Person(){}
//创建一个自定义对象
var p1 = new Person();
p1.name = ‘zhangsan';
p1.age = 22;
p1.email = ‘123@163.com';
//遍历p1对象输出其属性
for(var i in p1){
document.write(p1[i]+'<br/>’);
}
</script>
</body>
</html>

 

 

 

2、for…in…其也可以遍历系统对象

示例：

 

 
<!DOCTYPE html>
<html>
<head>
<meta charset=’utf-8′>
<title></title>
</head>
<body>
<script>
for(var i in document){
document.write(i+'<br/>’);
}
</script>
</body>
</html>

 

3、删除自定义属性

 

在我们传递对象的过程中，我们可能并不需要某些自定义属性，那么我们可以通过delete关键词对其删除：

delete 自定义对象.属性;

 

示例代码：

 

<!DOCTYPE html>
<html>
<head>
<meta charset=’utf-8′>
<title></title>
</head>
<body>
<script>
function Person(){}
var p1 = new Person();
p1.name = ‘lisi';
p1.age = 23;
p1.email = ‘123@qq.com';
delete p1.age;
for(var i in p1){
document.write(p1[i]+'<br/>’);
}
</script>
</body>
</html>

 

 

成员方法

成员属性：对象的某个属性（静态的）如name、age、address

成员方法：对象的某个行为（动态的）如speak、run

 

例1：为对象定义成员方法

 

<!DOCTYPE html>
<html>
<head>
<meta charset=’utf-8′>
<title></title>
</head>
<body>
<script>
function Person(){}
var p1 = new Person();
p1.name = ‘lisi';
p1.age = 23;
//定义成员方法
p1.speak = function(){
alert(this.name+’—‘+this.age);
}
p1.speak();  // lisi–23
var p2 = new Person();
p2.name = ‘lisi';
p2.speak = function(){
alert(this.name);
}
p2.speak();
</script>
</body>
</html>

 

 

例2：简化以上代码

 

 
<!DOCTYPE html>
<html>
<head>
<meta charset=’utf-8′>
<title></title>
</head>
<body>
<script>
function say(){
alert(this.name);
}
function Person(){};
var p1 = new Person();
p1.name = ‘lisi';
p1.age = 23;
//定义成员方法
p1.speak = say;
p1.speak();
var p2 = new Person();
p2.name = ‘zhangsan';
p2.age = 25;
p2.speak = say;
p2.speak();
</script>
</body>
</html>

 

 

以上两种方法，都存在不足，我们每次定义属性或方法，都需要重复定义多次：

1）容易写错

2）代码冗余

 

例3：封装以上代码，代码如下

 

<!DOCTYPE html>
<html>
<head>
<meta charset=’utf-8′>
<title></title>
</head>
<body>
<script>
//定义一个类
function Person(name,age){
this.name = name;
this.age = age;
//定义成员方法
this.speak = function(){
alert(this.name+this.age);
}
}
var p1 = new Person(‘zhangsan’,22);
p1.speak();
var p2 = new Person(‘lisi’,25);
p2.speak();
</script>
</body>
</html>

 

posted @ 2015-12-09 10:12  夺命雷公狗  阅读(230)  评论(0)  编辑  收藏  举报