面向对象

来源：互联网发布：百度互联网数据研发部编辑：程序博客网时间：2024/05/29 11:13

<!DOCTYPE html>

<html>

<head>

<metacharset="UTF-8">

</head>

<body>

</body>

<scripttype="text/javascript">

/* * 创建对象 */

//方法一

var cat=new Object();

cat.name="小花猫";

cat.age=2;

cat.say=function(){ alert(this.name+"\n"+this.age+"岁"); }

cat.say();

//方法二

var cat={

"name":"小花猫", "age":2, "say":function(){ alert(this.name+"\n"+this.age+"岁"); }

}

cat.say();

//方法三

function creatObj(name,age){

var p=new Object(); p.name=name; p.age=age; p.say=function(){ alert(this.name+this.age+"岁"); }

return p;

}

var cat=creatObj("小花猫","2"); cat.say();

//方法四

function Cat(name,age){

this.name=name; this.age=age; this.say=function(){ alert(this.name+this.age+"岁"); }

}

var cat=new Cat("小花猫",2);

cat.say();

/* * 原型 */

function Cat(){};

Cat.prototype.name="小花猫";

Cat.prototype.age=2;

Cat.prototype.eat=function(){ alert(this.name+this.age+"岁\n"+"喜欢吃鱼"); }

var cat=new Cat(); cat.eat();

var cat1=new Cat(); cat1.name="小白猫"; cat1.age=1; cat1.eat();

原型内存模型图，如下图所示：

/* *原型重写 */

function Cat(){};

//报错

Cat.prototype.eat=function(){ alert(this.name+this.age+"岁\n"+"喜欢吃鱼"); }

Cat.prototype={ "name":"小花猫", "age":2 }

var cat=new Cat(); cat.eat();

//正确

Cat.prototype={ "name":"小花猫", "age":2 }

Cat.prototype.eat=function(){ alert(this.name+this.age+"岁\n"+"喜欢吃鱼"); }

var cat=new Cat(); cat.eat();

/* *封装 */

function Cat(name,age,friends){ this.name=name; this.age=age; this.friends=friends; }

Cat.prototype={

"constructor":Cat, "say":function(){ alert(this.name+"\n"+this.age+"岁\n朋友："+this.friends); }

}

var cat=new Cat("小花猫",2,['小狗','小兔','小熊']);

cat.friends.push("小鸡"); cat.say();

var cat1=new Cat("小白猫",1,['小狗','小兔']);

cat1.friends.push("小鸭"); cat1.say();

/* *继承 */

function Parent(){ this.pv="父级"; }

function Child(){ this.cv="子级"; }

Child.prototype=new Parent();

var son=new Child();

alert(son.pv);

</script>

</html>

0 0