浅谈基础模式,工厂模式,构造函数模式,原型模式,继承模式
作者:互联网
一.基础模式
var web2101=[{
name:'',
age:20,
gender:'men',
tel:xxxx,
address:'',
专业:xxx
},{
name:'',
age:20,
gender:'men',
tel:xxxx,
address:'',
专业:xxx
},{
name:'',
age:20,
gender:'men',
tel:xxxx,
address:'',
专业:xxx
},....];
二.工厂模式
function Student(name,age,gender){
var obj=new Object();
obj.name=name;
obj.age=age;
obj.gender=gender;
obj.say=function(){
alert('学生中的说话属性');
}
return obj;//一定要写return 因为obj是局部变量,在函数外部无法访问
};
var stu1=Student('李明',19,'男');
var stu2=Student('张华',20,'女');
console.log(stu1);
console.log(stu2);
//输出结果:
/*{name: "李明", age: 19, gender: "男", say: ƒ}
{name: "张华", age: 20, gender: "女", say: ƒ}*/
//测试stu1 stu2是否能访问say();
stu1.say();
stu2.say();//测试结果可以
//stu1 和stu2不同的引用地址所以两者不等
工厂模式的优缺点:
优点:简化了基础模式的代码量
缺点:对象不能细分,浪费内存空间(内置函数)
解决方法:将共有函数写在工厂函数外部,在函数内部将指针指向共有函数
例如:
function Student(name,age,gender){
var obj=new Object();
obj.name=name;
obj.age=age;
obj.gender=gender;
/* obj.say=function(){
alert('学生中的说话属性');
}*/ //此函数为内置函数,写在函数内部会浪费空间
return obj;
};
//解决工厂模式浪费内存的方法 将say()方法写到函数外部
function say(){
alert('学生公有属性说话属性');
}
var stu1=Student('李明',19,'男');
var stu2=Student('张华',20,'女');
//测试stu1 stu2是否能访问say();
stu1.say();
stu2.say();//测试结果可以
三.构造函数模式
function Student(name,age,gender){
this.name=name;
this.age=age;
this.gender=gender;
}
var stu1=new Student('李明',19,'男');
var stu2=new Student('张华',20,'女');
console.log(stu1,stu2);
//输出结果:
/*Student {name: "李明", age: 19, gender: "男"} Student {name: "张华", age: 20, gender: "女"}*、
/*stu1 和 stu2依然不等 原因:stu1和stu2都是new出来的,地址依然同*/
优点:
解决对象细分问题
缺点:
公有属性/方法 外置
四.原型模式
将所有的共有属性/方法 放到构造函数的原型函数中,构造函数可以调用,构造对象的原型对象也能调用
function Student(name,age,gender){
this.name=name;
this.gender=gender;
this.age=age;
}
//共有属性/函数 放在了构造函数Student的原型函数中
Student.prototype.say=function(){
alert('学生的公有属性');
}
var stu1= new Student('李明',19,'男');
var stu2= new Student('张华',20,'女');
stu1.say();
stu2.say();
console.log(stu1,stu2);
五.继承
子类的原型指向父类的实例
父类的实例指向子类的构造函数
关系如下图所示
代码实现如下:
function rich(name,age,gender){
this.name=name;
this.age=age;
this.gender=gender;
}
//rich的共有属性money声明在rich的原型对象中
rich.prototype.enjoy=function(){
alert('rich的共有函数享受');
}
rich.prototype.money=['card1','card2','card3'];
//声明poor
function poor(name,age,gender){
this.name=name;
this.age=age;
this.gender=gender;
}
//我们想要p1来继承r1
/*1.将子类的原型对象p1.prototype指向父类的实例new rich()
2.将父类的实例[此时父类的实例对象为p1.prototype]对象指向子类的构造函数p*/
poor.prototype=new rich();
poor.prototype.constructor=poor;
poor.prototype.work=function(){
alert('poor的公有方法-工作');
}
var r1=new rich('张明',20,'男');
var p1=new poor('李芳',19,'女');
console.log(p1.money);
p1.enjoy();
console.log('poor1的构造函数为'+p1.constructor);
标签:stu2,stu1,name,gender,age,模式,Student,构造函数,浅谈 来源: https://blog.csdn.net/weixin_43164078/article/details/114846711