JavaScript巩固与加强三
目录
JavaScript巩固与加强三.................................................................................................... 1
一、面向对象................................................................................................................... 2
1、面向对象发展历程................................................................................................ 2
2、面向对象中的两个概念......................................................................................... 2
3、JavaScript常用系统类........................................................................................... 2
1）String类（字符串类）................................................................................... 2
2）Date类（日期时间类）................................................................................. 2
3）Math（数学类）........................................................................................... 2
二、Javascript中的自定义类............................................................................................. 2
1、Javascript自定义类创建方式................................................................................. 2
2、自定义对象创建流程............................................................................................ 2
3、为什么需要创建对象............................................................................................ 2
4、Javascript中的属性............................................................................................... 2
5、属性可以保存的数据类型..................................................................................... 2
6、在Javascript中，一切都是对象............................................................................ 2
7、面向对象中的三大关键词..................................................................................... 2
8、思考题：.............................................................................................................. 2
三、对象在内存中的存储形式.......................................................................................... 2
1）值类型................................................................................................................. 2
2）引用类型.............................................................................................................. 2
四、Javascript中this指针................................................................................................. 2
1、this指针............................................................................................................... 2
2、深入探讨Javascript中是this指针......................................................................... 2
3、思考题................................................................................................................. 2
4、对象间传值.......................................................................................................... 2
五、属性遍历与删除........................................................................................................ 2
1、使用for…in…遍历自定义对象属性......................................................................... 2
2、使用for…in…结构实现系统对象的遍历.................................................................. 2
3、属性删除操作....................................................................................................... 2
六、成员方法................................................................................................................... 2
七、json对象................................................................................................................... 2
1、什么是json........................................................................................................... 2
2、基本语法.............................................................................................................. 2
3、快速入门.............................................................................................................. 2
4、json对象从“何”而来............................................................................................. 2
5、php与json............................................................................................................ 2
案例：通过php+json完成对历史上的今天api接口调用.............................................. 2
6、为json对象添加成员方法..................................................................................... 2
八、原型链...................................................................................................................... 2
1、什么是原型对象？................................................................................................ 2
2、原型对象作用？................................................................................................... 2
3、如何向原型对象中添加属性或方法....................................................................... 2
4、探讨：原型对象到底从何而来.............................................................................. 2
一、面向对象
1、面向对象发展历程
1）面向机器
2）面向过程（贝尔实验室开发出C语言之后）
function add() {}
function edit() {}
function del() {}
3）面向对象（设计思想）
function 咨询() {}
function 报名() {}
function 缴费(){}
function 分班() {}
oa系统分解（学生、咨询老师、管理员）
class 学生 {
function 咨询() {}
function 报名() {}
}
2、面向对象中的两个概念
类（对某类事务的描述）
对象（由类创建的实体）
3、JavaScript常用系统类
String、Date、Math
1）String类（字符串类）
l length ：字符串长度
l indexOf(string) ：查找某个字符（字符串）在字符串出现的位置
l substr(num1,[num2])：截取字符串
l toLowerCase() ：把字符串转化为小写
l toUpperCase() ：把字符串转化为大写
l replace(str1,str2)：把str1替换为str2
2）Date类（日期时间类）
l getYear() ：返回年份
l getFullYear() ：返回完整年份
l getMonth() ：返回月份（0-11）
l getDate() ：返回当前日期（1-31）
l getDay() ：返回星期几（0-6）
l getHours()：返回小时
l getMinutes()：返回分钟
l getSeconds() ：返回秒数
l getMilliseconds()：返回毫秒数
l getTime()：返回格林时间到当前的时间戳
3）Math（数学类）
l ceil(数值) ：返回大于或等于该数的最小整数
l floor(数值) ：返回小于或等于该数的最大整数
l min(数值1,数值2,…)：返回最小数
l max(数值1,数值2) ：返回最大数
l pow(数值1,数值2) ：返回数值1的数值2次方 2的2次方是4
l random() ：返回0-1之间的随机小数
l round(数值) ：返回四舍五入后整数
l sqrt(数值) ：返回数值的平方根 4的开平方就是2
示例代码：
效果：
二、Javascript中的自定义类
例1：通过Javascript代码定义一个人的信息（姓名、年龄、婚否）
通过以上代码分析可知，三个变量实际上是一个整体，有联系的，但是在代码中我们无法体现出三者的联系。
例2：用面向对象的方式定义一个人的信息
1、Javascript自定义类创建方式
说明：在Javascript是没有类的定义语句，当系统中定义一个函数时，系统在加载后，会认为该函数是同名类下的构造函数（构造器）。
function Person() {}
当系统加载后，系统会认为Person函数是Person类下的构造函数（构造器），我们就可以通过该函数名称创建自定义对象。
var 对象 = new 类名();
class Person() {
public function Person() {
//该函数就是同名类下的构造函数
}
}
基本语法：
function 类名() {}
var 对象 = new 类名();
2、自定义对象创建流程
1）在内存中（堆内存）开辟存储区域
2）执行构造函数
示例代码：
3、为什么需要创建对象
答：为了保存更多的数据。
如何保存数据？答：通过属性保存数据
4、Javascript中的属性
基本语法：
对象.属性 = 属性的值
或
对象[属性] = 属性的值
5、属性可以保存的数据类型
数字 p1.age = 32;
字符串 p1.name = ‘王大锤’;
布尔值 p1.marry = false;
对象
window.document（对象）
6、在Javascript中，一切都是对象
var num = 10; //Number类的实例
var str =‘hello’;//String类的实例
var flag = true; //Bool类的实例
var per = new Person(); //自定义类
问题：在我们的javascript中定义一个函数，怎么能确定它是采用函数调用还是以构造器方式进行使用？
function abc() {}
window.abc();
说明：在Javascript中，一切都是对象，我们定义的函数如果是通过以上方式，其实也是采用面向对象方式进行调用的，因为我们在Javascript中定义的属性或方法都是向window对象中添加属性。
7、面向对象中的三大关键词
constructor：返回原型对象所指向的构造函数
typeof：查看当前对象的数据类型
instanceof：判断当前对象是否属于某个类
调用方式：
alert( p.constructor );
alert( typeof p );
alert( p instanceof person );
示例代码：主要用于判断对象信息，排错处理
8、思考题：
1）思考题：如果创建第二个对象，会拥有name和age属性吗？？？
var p1 = new Person();
p1.name = ‘zhangsan’;
p1.age = 30;
var p2 = new Person();
答：以上代码，运行后，我们发现p2对象并不会拥有p1对象的name和age属性。
原理如下：
三、对象在内存中的存储形式
1）值类型
Number、String、Bool、Undefined、Null
值类型在内存中的存储形式如下：
2）引用类型
Object对象
思考题2：如果创建第二个对象p2，使用p1为p2赋值会怎样？
var p1 = new Person();
p1.name = ‘zhangsan’;
p1.age = 30; var p2 = p1;
答：原理图如下：
思考题3、如果删除了p2对象，是否会影响到p1对象
p2 = null;
答：不会，原理图如下：
四、Javascript中this指针
回顾PHP代码中this指针：指向当前对象
在Javascript中，this指针：
问题：在Javascript中，我们的对象的属性都是动态添加，又没办法直接在创建对象时自动拥有类中的属性或方法？
答：可以，通过this指针
1、this指针
例1：通过this指针让我们的对象拥有类中的属性或方法
效果：
说明：通过以上代码运行可知：
在Javascript中，谁调用了函数，那么函数内部的this指针就指向哪里
例2：改进例1，让我们创建的对象自动拥有自己的属性
2、深入探讨Javascript中是this指针
其实，在Javascript全局变量中，也存在this指针，其指向window全局对象
思考题：
1、尝试理解下面两条语句：
i=10;
alert(this.i);//this指向window对象,this.i == window.i;
2、
function test(){
this.i=100;
}
i=10;
test();
alert(this.i);
示例代码：
运行结果：100
3、思考题
var i=100;
function test(){
i=200;
}
test()
alert(i);
结果：200
4、对象间传值
1）把对象作为函数的参数进行传递
2）把对象作为函数返回值
1）把对象作为函数的参数进行传递
例1：计算机长方形的面积（长*宽）
示例代码：实例化一个Person对象，再将该对象当做display的参数
运行结果：
2）把对象作为返回值返回
例2：计算两个数的四则运算（加减乘除）
运行结果：
