js面向对象2

Posted 2020-06-16

1、发展史

　　面向机器

　　面向过程：将程序的执行分解成若干个步骤

　　面向对象：将程序的执行分解成若干个事物

 

2、面向对象两个基本概念

类：代表某类事物，是抽象的

对象：代表某个事物，是具体的

 

3、快速入门

表达一个人的完整信息

 1 <script>
 2     
 3     //面向过程
 4     var name = ‘zhangsan‘;
 5     var age = 30;
 6     var marry = true;
 7     alert(name + age + marry);
 8     
 9     //面向对象
10     function Person{
11     }
12     var p1 = new Person();
13     p1.name = ‘lisi‘;
14     p1.age = 20;
15     p1.marry = true;
16     alert(p1.name + p1.age + p1.marry);
17     
18 </script>

在面向过程的例子中，我们分别使用了三个变量来定义一个人的完整信息，但这三个变量它们之间没有必然的联系，如：我现在找到变量age，虽然可以取到数据，但并不清楚这是“谁”的年龄。

在面向对象的例子中， function Person{}是构造器。我们可以这样理解，每一个定义的function Person{}都是Person类的构造函数。

 

4.JS中常见的系统类

1）String类 字符串类

length ：取得字符串长度                        

indexOf(string) ：取得参数在字符串中出现的位置

substr(num1,[num2]) ：截取字符串

toLowerCase()       ：转换为小写    

toUpperCase() ：转换为大写    

replace(str1,str2) ：字符串替换

2）Date类   日期类

getYear()        ：返回年份(有时会出错，建议用第二种)

getFullYear()  ：返回年份  

getMonth()     ：返回月份 (0---11)    

getDate()       ：返回每月第几天      

getDay()         ：返回星期数 (0-6)

getHours()      ：返回小时数

getMinutes()   ：返回分钟数

getSeconds() ：返回秒数

getMilliseconds() ：返回毫秒数

3）Math类  数学类

ceil(数值)       ：返回大于或等于该数的最小整数(比如说分页 Math.ceil(4.8)=5)

floor(数值)     ：返回小于或等于该数的最大整数

min(数值1,数值2) ：返回最小数

max(数值1,数值2) ：返回最大数

pow(数值1,数值2) ：返回数值1的数值2次方

random()              ：返回随机数  0----------1

round(数值)   ：四舍五入

sqrt(数值)      ：开平方根

Math类下的方法都是静态方法

 

5.自定义类--类的定义

语法：

function 类名(){

}

在js中，没有类的定义语句，只有function，每一个function，我们可以认为它是同名类的构造函数

比如说：

function person(){

} 

它是Person类的构造函数 

这种函数也叫构造器

 

6.自定义类--声明对象

语法： var 对象=new 类名();

关键字new：实例化对象， 开辟相应内存空间

1 function Person(){
2     alert(‘hello‘);
3 }
4 var p1 = new Person();

执行上面这个例子时，我们发现，在实例化时，直接执行了Person构造函数

 

7.自定义类--关于对象属性的使用

语法：

　　对象.属性;

　　对象[‘属性‘];

1 function Person(){
2     alert(‘hello‘);
3 }
4 var p1 = new Person();
5 p1.name=‘zhangsan‘;
6 p1.age=30;
7 alert(p1.name+p1.age);

在js中，对象属性是动态添加的，对象属性可以使用“.”或[‘‘]这两种形式表示出来

对象的属性可以是任何数据类型，如：字符串、数字、对象

 

8.三个关键字

constructor： 返回的是对象的构造器

typeof ：返回数据类型

instanceof ：判断对象是否是某个类的实例

 1 function Person(){
 2     alert(‘hello‘);
 3 }
 4 var p1 = new Person();
 5 p1.name=‘zhangsan‘;
 6 p1.age=30;
 7 alert(p1.name+p1.age);
 8 
 9 //返回p1对象的构造器
10 alert(p1.constructor);
11 //取得p1变量的数据类型
12 alert(typeof p1);
13 //判断p1是不是Person类的一个实例
14 alert(p1 instanceof Person);

 

9.对象在内存中的表现形式

1 //例1
2 function Person(){
3 }
4 var p1 = new Person();
5 p1.name=‘zhangsan‘;
6 p1.age=30;
7 
8 var p2 = new Person();
9 alert(p2.name);

在例1中，创建p1对象时，会为p1开辟相应的堆空间，然后将name和age属性以及值添加到p1所指向的堆空间中，创建p2对象时，也会为p2对象开辟对应的空间，但p2所指向的堆空间是空的，所以P2对象没有name和age属性。

 1 //例2
 2 function Person(){
 3 }
 4 var p1 = new Person();
 5 p1.name = ‘zhangsan‘;
 6 p1.age = 30;
 7 
 8 var p2 = p1;
 9 alert(p2.name);
10 p2.name = ‘lisi‘;
11 alert(p2.name);
12 alert(p1.name);

在例2中，将p1栈中保存的堆的地址赋值给了p2，所以说,p2也指向了p1指向的堆内存的地址。两个对象指向了同一块堆内存，所以改变一个对象的属性，会影响到另一个对象。

 1 //例3
 2 function Person(){
 3 }
 4 var p1 = new Person();
 5 p1.name = ‘zhangsan‘;
 6 p1.age = 30;
 7 
 8 var p2 = p1;
 9 alert(p2.name);
10 p2 = null;
11 alert(p1.name);
12 alert(p2.name);

在例3中，P2=null; 表示释放p2所占的栈空间，但p1的空间仍保留，p1仍然指向相应的堆空间，所以删除p2不会影响到p1对象。