建立在抽象的基础上
一、封装:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link href="css/game.css" type="text/css" rel="stylesheet" />
<script language="JavaScript" type="text/javascript">
function Person(name,age1,sal1){
this.name=name;
// 私有
var age=age1;
var salary=sal1;
this.show=function(){
window.alert(age+" "+salary);
}
//私有可以访问属性，但是外部调用不行
function show2(){
window.alert(age+" "+salary);
}
}
var p1=new Person("sp",20,50000);
window.alert(p1.name+" "+p1.age);
p1.show();
</script>
</head>
<body>
</body>
</html>
proptype对所有的方法添加方法，当时不能访问私有对象和方法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link href="css/game.css" type="text/css" rel="stylesheet" />
<script language="JavaScript" type="text/javascript">
function Person(){
this.name="abc";
var age=90;
}
Person.prototype.fun1=function(){
window.alert(this.name);
window.alert(this.age);
}
var p1=new Person();
p1.fun1();
</script>
</head>
<body>
</body>
</html>
二、继承：
代码会出现冗余的问题，
抽象出一个学生类，取出共性
对象冒充，可以实现多重继承的效果
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link href="css/game.css" type="text/css" rel="stylesheet" />
<script language="JavaScript" type="text/javascript">
function Stu(name,age){
this.name=name;
this.age=age;
this.show=function(){
window.alert(this.name+" "+this.age);
}
}
function MidStu(name,age){
this.stu=Stu;
this.stu(name,age);
}
function Pupil(name,age){
this.stu=Stu;
this.stu(name,age);
}
var mid=new MidStu("小往",32);
mid.show();
</script>
</head>
<body>
</body>
</html>
可以重写覆盖，不支持重载（不可以通过参数的个数类型来决定调用）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link href="css/game.css" type="text/css" rel="stylesheet" />
<script language="JavaScript" type="text/javascript">
function Stu(name,age){
this.name=name;
this.age=age;
this.show=function(){
window.alert(this.name+" "+this.age);
}
}
function MidStu(name,age){
this.stu=Stu;
this.stu(name,age);
this.show=function(){
window.alert("hello,sjho2");
}
}
function Pupil(name,age){
this.stu=Stu;
this.stu(name,age);
}
var mid=new MidStu("小往",32);
mid.show();
</script>
</head>
<body>
</body>
</html>
三、多态
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link href="css/game.css" type="text/css" rel="stylesheet" />
<script language="JavaScript" type="text/javascript">
function Master(aniaml, food) {
//给动物喂食物
this.feed = function(animal, food) {
window.alert(animal.constructor);
document.write("Master给" + animal.name + "喂食" + food.name);
}
}
function Food(name) {
this.name = name;
}
function Fish(name) {
this.food = Food;
this.food(name);
}
function Bone(name) {
this.food = Food;
this.food(name);
}
function Animal(name) {
this.name = name;
}
function Cat(name) {
this.animal = Animal;
this.animal(name);
}
function Dog(name) {
this.animal = Animal;
this.animal(name);
}
var cat = new Cat("小猫咪");
var dog = new Dog("小狗");
var fish = new Fish("小鱼");
var bone = new Bone("骨头");
var master = new Master();
master.feed(cat, fish);
</script>
</head>
<body>
</body>
</html>
四、闭包
与垃圾回收是关联的，涉及到一个变量的成员属性什么时候被处理的问题
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link href="css/game.css" type="text/css" rel="stylesheet" />
<script language="JavaScript" type="text/javascript">
// 闭包closure
function A(){
var i=0;
function b(){
window.alert(i++);
}
return b;
}
A();
var c=A();
c();
</script>
</head>
<body>
</body>
</html>