1.继承 侧重于从父级继承到的属性和方法。
/*
面向对象的特点
封装 继承 多态
封装构造函数 混合法
*/
function Person(name,sex){
this.user = name;
this.gender = sex;
}
//通过原型添加函数都可以使用
Person.prototype.showName = function(){
alert(`我的名字是:${this.user}`);
}
Person.prototype.showSex = function(){
alert(`性别:${this.gender}`);
}
var p1 = new Person("red","女");
p1.showName();
p1.showSex();
/*
继承与Person生成一个Worker
1、继承属性
构造函数的伪装 改变this指向(call apply bind)
2、继承方法
<1>原型链
<2>调用构造函数
<3>Object.create
*/
function Worker(name,sex,job){
** //继承父级的属性
//call
Person.call(this,name,sex);
//apply
Person.apply(this,[name,sex]);
//bind 预设this指向
Person.bind(this)(name,sex);**
//相当于添加了this.user = name;this.gender = sex;
//添加自己的属性
this.worker = job;
}
**//继承父级的方法
//使用原型链继承
for(var funcName in Person.prototype){
Worker.prototype[funcName] = Person.prototype[funcName];
}
//直接调用父级的构造函数
Worker.prototype = new Person;
//Object.create方法
Worker.prototype = Object.create(Person.prototype);**
//添加自己的方法
Worker.prototype.showJob = function(){
alert(`我是干${this.worker}的`);
}
var w1 = new Worker("小明", "男", "程序员");
w1.showName();
w1.showSex();
w1.showJob();
2.封装
工厂模型:
1、原料
2、加工
3、出厂
【注】符合上述三个条件的函数叫做工厂函数
【重点】如果我们使用new运算符去调用函数。系统会自动完成1原料、3出厂操作。当前函数的this指向当前新创建的对象。这个新创建的对象就是函数的主人。
【注】如果这个函数用new去调用,这个函数就叫做构造方法/构造函数。构造函数在js没有类的期间,充当类的存在
【注】为了区分构造函数和普通函数,构造函数首字母大写
function Preson(name,sex){
// var obj = new Object();
//添加属性
this.name = name;
this.sex = sex;
//添加方法
this.showName = function(){
alert("我的名字叫" + this.name);
alert(this)//object
}
this.showSex = function(){
alert("我是" + this.sex + "的");
}
// return obj;
}
var p1 = new Preson("bule","男");
p1.showName();
p1.showSex();
var p2 = new Preson("red","女");
p2.showName();
p2.showSex();
3.多态
侧重于重写或者拓展子一级的属性和方法。
重写从父一级继承的函数,那么在子一级上,重写的函数会覆盖继承的函数,不会影响父一级的函数。这叫做多态。
function Person(name,sex){
this.user = name;
this.gender = sex;
}
//通过原型添加函数都可以使用
Person.prototype.showName = function(){
alert(`我的名字是:${this.user}`);
}
Person.prototype.showSex = function(){
alert(`性别:${this.gender}`);
}
var p1 = new Person("red","女");
p1.showName();
p1.showSex();
/*
继承与Person生成一个Worker
*/
function Worker(name,sex,job){
//继承父级的属性
Person.call(this,name,sex);
//相当于添加了this.user = name;this.gender = sex;
//添加自己的属性
this.worker = job;
}
//继承父级的方法
Worker.prototype = Object.create(Person.prototype);
**//重写从父一级继承的函数,那么在子一级上,重写的函数会覆盖继承的函数,不会影响父一级的函数。这叫做多态。
Worker.prototype.showName = function(){
alert("大家好,Worker的介绍自己的名字是" + this.user);
}**
//添加自己的方法
Worker.prototype.showJob = function(){
alert(`我是干${this.worker}的`);
}
var w1 = new Worker("小明", "男", "程序员");
w1.showName();
w1.showSex();
w1.showJob();