2021.5.18 JS高级第一天

最新推荐文章于 2024-03-24 02:40:13 发布

景抓马

最新推荐文章于 2024-03-24 02:40:13 发布

阅读量168

点赞数

分类专栏： JS高级

原文链接：https://blog.csdn.net/W859265708/article/details/82763285

版权

JS高级专栏收录该内容

3 篇文章 0 订阅

订阅专栏

1.什么是对象

1.对象是单个事物的抽象

一本书、一辆汽车、一个人都可以是对象，一个数据库、一张网页、一个与远程服务器的连接也可以是对象。当实物被抽象成对象，实物之间的关系就变成了对象之间的关系，从而就可以模拟现实情况，针对对象进行编程。

2.对象是一个容器，封装了属性（property）和方法（method）

属性是对象的状态，方法是对象的行为（完成某种任务）。比如，我们可以把动物抽象为animal对象，使用“属性”记录具体是那一种动物，使用“方法”表示动物的某种行为（奔跑、捕猎、休息等等）。在实际开发中，对象是一个抽象的概念，可以将其简单理解为：数据集或功能集.
提示：每个对象都是基于一个引用类型创建的，这些类型可以是系统内置的原生类型，也可以是开发人员自定义的类型。
Everything is object （万物皆对象）

2.什么是面向对象

面向对象不是新的东西，它只是过程式代码的一种高度封装，目的在于提高代码的开发效率和可维护性。
面向对象编程 —— Object Oriented Programming，简称 OOP ，是一种编程开发思想。它将真实世界各种复杂的关系，抽象为一个个对象，然后由对象之间的分工与合作，完成对真实世界的模拟。
在面向对象程序开发思想中，每一个对象都是功能中心，具有明确分工，可以完成接受信息、处理数据、发出信息等任务。
因此，面向对象编程具有灵活、代码可复用、高度模块化等特点，容易维护和开发，比起由一系列函数或指令组成的传统的过程式编程（procedural programming），更适合多人合作的大型软件项目。

3.面向对象与面向过程

面向过程：
面向过程就是亲力亲为，事无巨细，面面俱到，步步紧跟，有条不紊
面向对象就是找一个对象，指挥得结果
面向对象将执行者转变成指挥者
面向对象不是面向过程的替代，而是面向过程的封装

4.面向过程的体现

在 JavaScript 中，所有数据类型都可以视为对象，当然也可以自定义对象。

定义的对象数据类型就是面向对象中的类（ Class ）的概念。
我们以一个例子来说明面向过程和面向对象在程序流程上的不同之处。

5.面向对象的基本体现 (一)

如果采用面向对象的程序设计思想，我们首选思考的不是程序的执行流程，而是 Student这种数据类型应该被视为一个对象，这个对象拥有 name和 score这两个属性（Property）。
如果要打印一个学生的成绩，首先必须创建出这个学生对应的对象，然后，给调用 printScore，将成绩打印。
抽象数据行为模板（Class）

抽象数据行为模板（Class）：
function Student(name,score){
this.name=name;
this.score=score;
this.printScore=function(){
alert(‘姓名:’+this.name+’ '+‘成绩:’+this.score);
};

6.面向对象的基本体现(二)

面向对象的设计思想是从自然界中来的，因为在自然界中，类（Class）和实例（Instance）的概念是很自然的。
Class 是一种抽象概念，比如我们定义的 Class——Student ，是指学生这个概念,而实例（Instance）则是一个个具体的 Student ，比如， Michael 和 Bob 是两个具体的 Student 。

所以，面向对象的设计思想是：
1.创建描述事物的类【面向对象的封装】
2.根据类创建出具体的对象
3.调用自己的属性和方法
面向对象的抽象程度又比函数要高，因为一个 Class 既包含数据，又包含操作数据的方法。

创建对象

简单方式–通过 new Object() 创建

解析构造函数代码的执行

Person()函数取代了createPerson()`函数，但是实现效果是一样的。

Person()中的代码与 createPerson()有以下几点不同之处：
1.没有显示的创建对象
2.直接将属性和方法赋给了 this对象
3.没有 return语句
4.函数名使用的是大写的 Person

而要创建 Person实例，则必须使用 new操作符。以这种方式调用构造函数会经历以下 4 个步骤：

创建一个新对象
将构造函数的作用域赋给新对象（因此 this 就指向了这个新对象）
执行构造函数中的代码
返回新对象

构造函数和实例对象的关系

使用构造函数的好处不仅仅在于代码的简洁性，更重要的是我们可以识别对象的具体类型了。在每一个实例对象中的__proto__中同时有一个 constructor属性，该属性指向创建该实例的构造函数

总结：
1.构造函数是根据具体的事物抽象出来的抽象模板
2.实例对象是根据构造函数new出来的
3.每一个实例对象都具有一个 constructor 属性，指向创建该实例的构造函数

原型

prototype .
Javascript 规定，每一个构造函数都有一个 prototype 属性，指向另一个对象。这个对象的所有属性和方法，都会被构造函数的实例继承。
这也就意味着，我们可以把所有对象实例需要共享的属性和方法直接定义在 prototype 对象上。

构造函数、实例、原型三者之间的关系

在这里插入图片描述

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script>
			window.onload = function() {
				/*
				var num1=100;
				var obj1={
					name:"peiqi",
					getname:function(){
						return this.name
					}
				}
			}
			var std1={name:'zhangsan',score:80};
			var std1={name:'lisi',score:90};
			function printScore(student){
				alert(student.name);
			   //抽象数据行为模板（Class）： 
				function student(name,score){
					this.name=name;
					this.score=score;
					this.printScore=function(){
						alert('姓名'+this.name+'成绩'+this.score);
					};
				}	
					//根据模板创建具体实例对象
					var std1=new student('peiqi',90);
					var std2=new student('li',80);
					//Student对象具有自己的具体行为
					std1.printScore();
				//简单方式--通过 `new Object()` 创建
				var person=new Object()
					person.name="zhangsan";
					person.age=22;
					person.getInfo=function(){
						alert('姓名'+person.name+'年龄'+person.age);
					};
				person.getInfo();
				
				//每次创建通过 `new Object()`比较麻烦
				var person={
					name:"lisi",
					age:24,
					getInfo:function(){
						alert('姓名'+person.name+'年龄'+person.age);
					}	
				};
				person.	getInfo();
			   //简单方式的改进：工厂函数
			   function crentePerson(name,age){
				   return{
					   name:name,
					   age:age,
					   getInfo:function(){
						   alert('姓名'+this.name+'年龄'+this.age);
					   }
				   };
			   }
			   var lisiobj=crentePerson("lisi",24);
			    lisiobj. getInfo();
			   var wuobj=crentePerson("wangwu",25);
			 //一种更优雅的工厂函数就是下面这样，构造函数：
			 function Person(name,age){
				 this.name=name;
				 this.age=age;
				 this.getIngo=function(){
					 alert('姓名'+this.name+'年龄'+this.age);
				 }
			 };
			 //创建对象
			 var lisiobj=new Person("lisi",24);
				lisiobj.getIngo();	
			//构造函数和实例对象的关系
			function getIngo(){
				alert('姓名'+this.name+'年龄'+this.age);
			}
			//true
			function Person(name,age){
				this.name=name;
				this.age=age;
				this.getIngo=getIngo;
			};
			//创建对象
			var lisiobj1=new Person("lisi",24);
			var lisiobj2=new Person("lisi",24);
			alert(lisiobj1.getIngo===lisiobj2.getIngo);//false
			*/
				function Person(name, age) {
					this.name = name;
					this.age = age;
				};
				Person.prototype.getInfo = function() {
					alert('姓名' + this.name + '年龄' + this.age);
				}
				Person.prototype.address = "长安";
				var lisiobj1 = new Person("lisi", 24);
				lisiobj1.__proto__.address = "西安";
				alert(lisiobj1.address);
			}
		</script>
	</head>
	<body>
	</body>
</html>

景抓马

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2021.5.18 JS高级第一天

1.什么是对象1.对象是单个事物的抽象一本书、一辆汽车、一个人都可以是对象，一个数据库、一张网页、一个与远程服务器的连接也可以是对象。当实物被抽象成对象，实物之间的关系就变成了对象之间的关系，从而就可以模拟现实情况，针对对象进行编程。2.对象是一个容器，封装了属性（property）和方法（method）属性是对象的状态，方法是对象的行为（完成某种任务）。比如，我们可以把动物抽象为animal对象，使用“属性”记录具体是那一种动物，使用“方法”表示动物的某种行为（奔跑、捕猎、休息等等）。在实际开发中
复制链接

扫一扫

专栏目录