关于面向对象的编程

news/2024/10/4 15:33:22

一、面向对象是什么
面向对象是软件开发的方法,是一种对现实世界理解和抽象的方法,是计算机编程技术发展到一定阶段后的产物,是一种高级的编程思想。
二、面向对象的编程思想
面向过程:只关心数学逻辑。
面向对象:直接将生活逻辑映射到程序里。
三、面向对象的概念
实现面向对象,必须要通过两个语法才能实现。
类:具有同一类特征的事物的抽象概念。
对象:具体某一实例,唯一的具体个体。
【注】:类在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,来自约德尔人

http://www.niftyadmin.cn/n/2502361.html

相关文章

转一篇 搞笑的

http://www.cnblogs.com/huobazi/articles/2690.aspx转载于:https://www.cnblogs.com/huobazi/archive/2004/03/10/2676.html

SQL Server 中截取日期的日期部分与时间部分

SQL Server 中截取日期的日期部分与时间部分 CONVERT ( data_type [ ( length ) ] , expression [ , style ] )SQL Server 中截取日期的日期部分&#xff1a; select convert(varchar(10),getdate(),120)SQL Server 中截取日期的时间部分&#xff1a; select convert(varchar(8…

考察数据结构——第二部分:队列、堆栈和哈希表[译]

相关文档 考察数据结构——第一部分:数据结构简介 考察数据结构——第三部分&#xff1a;二叉树和BSTs 原文链接&#xff1a;Part 2: The Queue, Stack, and Hashtable 本文是"考察数据结构"系列文章的第二部分&#xff0c;考察了三种研究得最多的数据结构&#xff…

AJAX的封装和提交方式

一、什么是AJAX ajax是一种技术&#xff0c;是用来进行前后端交互的技术。他可以异步的运输数据。可以节省异步的操作、时间、提高用户的体验、减少数据请求、传输数据请求。 异步&#xff1a;非堵塞&#xff0c;前面一个程序是否执行完毕&#xff0c;不影响后面的程序的执行。…

(转)谈谈我对技术发展的一点感悟

转自&#xff1a;小洋&#xff08;燕洋天&#xff09;点击查看原文 随着自己不断的在技术这条路上走着&#xff0c;感悟和体会也是越来越多&#xff01;和大家分享上几点。 1. 懂得越多&#xff0c;发现自己懂得越少 现在回想以前&#xff0c;发现以前的自己确实有点“轻狂…

程序员必知单词、语句、英文缩写汇总

程序员必知单词、语句、英文缩写汇总 综述&#xff1a;便于类&#xff0c;函数命名&#xff0c;工作文档阅读而做的单词积累 一.逻辑编码部分 application 应用程式 应用、应用程序 application framework 应用程式框架、应用框架 应用程序框架 architecture 架构、系统架构 体…

View Resolver

2019独角兽企业重金招聘Python工程师标准>>> View Resolver DispatcherServlet 会根据传回的 ModelAndView 实例来解析 View 名称&#xff0c;并处理用以呈现于画面 的资料 Model 物件。View 名称的解析是委托给实作 org.springframework.web.servlet.ViewResolver…

手机端轮播图,点击图片显示预览大图

页面上方显示图片&#xff0c;可以滑动&#xff0c;点击图片&#xff0c;弹出一个遮罩层&#xff0c;将完整的图片显示出来。 一、 引入的样式文件 <link rel"stylesheet" href"weixin/css/weui.min.css" /><link rel"stylesheet" href…