一、面向对象是什么
面向对象是软件开发的方法,是一种对现实世界理解和抽象的方法,是计算机编程技术发展到一定阶段后的产物,是一种高级的编程思想。
二、面向对象的编程思想
面向过程:只关心数学逻辑。
面向对象:直接将生活逻辑映射到程序里。
三、面向对象的概念
实现面向对象,必须要通过两个语法才能实现。
类:具有同一类特征的事物的抽象概念。
对象:具体某一实例,唯一的具体个体。
【注】:类在JS中是没有这个概念的。
ECMA6中类的语法又加进来了。
四、面向对象的封装
原始代码
var person = new Object();
person.name = "小明";
person.sex = "男";
person.showName = function(){
alert(this.name);
}
person.showSex = function(){
alert(this.sex);
}
person.showName();
person.showSex();
var person2 = new Object();
person2.name = "小花";
person2.sex = "女";
person2.showName = function(){
alert(this.name);
}
person2.showSex = function(){
alert(this.sex);
}
person2.showName();
person2.showSex();
进一步进行封装
/*
在JS中,我们把可以创建对象的函数,叫做【工厂函数/方法】
1、原料
2、加工
3、出厂
*/
function createPerson(name, sex){
//1、原料
var person = new Object();
//2、加工
person.name = name;
person.sex = sex;
person.showName = function(){
alert(this.name);
}
person.showSex = function(){
alert(this.sex);
}
//3、出厂
return person;
}
/*
【注】我们在这里似乎封装了一个可以创建人的函数。
我们封装一个可以创建人对象的函数。
*/
var p1 = createPerson("小明", '男');
p1.showName();
p1.showSex();
var p2 = createPerson("小花", '女');
p2.showName();
p2.showSex();
alert(p1.showName == p2.showName); //fasle
/*
1、跟系统创建对象的函数相比,没有new
2、每一个对象,自己拥有一套函数。浪费资源。
*/
面向对象的完整封装
/*
如果在调用函数的时候,前面加了一个new,那么系统会干这么两件事
1、自动完成<1>原料操作 <3>出厂操作
2、通过new调用的函数中的this,指向新创建出来的对象。
【注】这种用new来调用的函数,叫做构造函数,一般情况下构造函数,他的首字母大写。
*/
function Person(name, sex){
//1、原料
// var person = new Object();
// this = new Object()
//2、加工
this.name = name;
this.sex = sex;
this.showName = function(){
alert(this.name);
}
this.showSex = function(){
alert(this.sex);
}
//3、出厂
// return person;
//return this
}
/*
【注】我们在这里似乎封装了一个可以创建人的函数。
我们封装一个可以创建人对象的函数。
*/
var p1 = new Person("小明", '男');
p1.showName();
p1.showSex();
var p2 = new Person("小花", '女');
p2.showName();
p2.showSex();
alert(p1.showName == p2.showName); //fasle
完整的构造函数
构造函数可以替代类的存在,可以创建对象。
/*
【注】创建英雄。
封装一个可以构造英雄对象的,构造函数。
*/
function Person(name, sex){
this.name = name;
this.sex = sex;
}
//构造函数所有的方法,都要通过【原型】添加
Person.prototype.showName = function(){
alert(this.name);
}
Person.prototype.showSex = function(){
alert(this.sex);
}
function Hero(name,sex,zhongzu,HP,MP){
this.name = name;
this.sex = sex;
this.HP = HP;
this.MP = MP;
this.zhongzu = zhongzu;
}
Hero.prototype.showHero = function(){
alert(`我叫${this.name},是${this.sex}性,血量${this.HP}, 蓝条${this.MP},来自${this.zhongzu}`);
}
var num1 = new Hero("兰博", "男", "约德尔人", 500, 500);
num1.showHero(); //我叫兰博,是男性,血量500, 蓝条500,来自约德尔人