学习目标
文章目录
一、复习
1、JavaScript是什么?
- 是一门脚本语言 · 是一门弱类型语言
- 是一门解释性语言 · 是一门基于对象的语言
- 是一们动态类型语言
2、JavaScript简称:JS
JavaScript的组成
组成部分 | 说明 |
---|---|
ECMAScript | 基础的语法 |
DOM(Document Object Modle) | 文档对象模型 |
BOM(Browser Object Modle) | 浏览器对象模型 |
3、动态网页
1、页面是由html+css+Js
2、向服务器发出请求,服务那边没有页面,是动态的生成,返回给客户端
4、Js最初的目的:解决用户和服务器之间的交互问题
现在: js做特效、游戏、客户端、服务端
5、JS中保留的关键字
JS保留的关键字:int··· 先保留以后可能会用到
6、JS中数据类型
JavaScript 有 5 种简单数据类型:
Undefined、Null、Boolean、Number、String
和 1 种复杂数据类型Object
7、类型检测
typeof
instanceof
Object.prototype.toString.call()
二、面向对象介绍
1、一个具体的看得见摸得着的称作为对象
2、对象是一个容器,封装了属性(property)和方法(method)
3、ECMAScript-262 把对象定义为:无序属性的集合,其属性可以包含基本值、对象或者函数。
面向对象的特性:
- 封装性
- 继承性
- [多态性]
三、面向过程和面向对象区别
面向过程:所有的事情都是亲力亲为,注重的是过程
面向对象:提出需求,找对象,对象解决,注重的是结果
js不是一门面向对象的语言,是基于面向对象的语言,js来模拟面向对象
面向对象的特征:封装、继承、多态(抽象性)
封装:就是包装,把一些重用的内容进行包装,在需要的时候,直接使用 把一个值,存在一个变量中,把一些重用的代码放在函数中,好多相同功能的函数放在一个对象中,把好多功能的对象,放在一个文件中,把一些相同的内容放在一个对象中
继承:类与类之间的关系,js中没有类的概念,js中有构造函数的概念,是可以有继承的,是基于原型
多态:同一个行为,针对不同的对象,产生不同的效果
四、创建对象的三种方式
第一种:字面量创建
var per1 = {}
第二种:调用系统的构造函数
var per2 =new Object();
第三种:自定义构造函数
function Person () {}
var per3 = new Person();
五、this做了几件事
1、开辟空间存储对象
2、把this设置为当前的对象
3、设置属性和方法值
4、返回这个对象
五、显示对象结构
console.dir()
六、构造函数和实例对象的关系
- 总结
- 实例对象和构造函数之间的关系:
- 1、实例对象是通过构造函数来创建的–创建的过程叫做实例化
- 2、如何通过判断判断对象是不是这个数据类型
- 1、通过构造器的方式 实力对象.构造器==构造器名字
- 2、对象 instanceof 构造器函数名字
- 尽可能的使用第二种方式来识别
七、构造函数带来的问题
通过自定义构造函数、来创建对象,对象调用的方法不是同一个方法,
它是自己开辟了一块空间指向了自己那块空间的的方法
由于每一个对象开辟了自己的空间指向了自己的方法,占用系统内存
解决办法:通过原型来解决----->数据共享,节省内存空间,作用之一
八、原型添加方法
- 通过原型添加方法,解决数据共享,节省内存空间
- 语法:
构造函数名字.prototype.方法名/属性 = fn () {};
什么是原型?
实例对象中有__proto__这个属性,叫原型,也是一个对象,这个属性是给浏览器使用,不是标准的属性——>__proto__——>可以叫做原型对象
构造函数中有prototype这个属性,叫原型,也是一个对象,这个属性是给程序员使用,是标准的属性——>prototype——>可以叫原型对象
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-E9SqPwG7-1574084136094)(C:\Users\吴建明\Desktop\SharedScreenshot.jpg)]
原型的补充:
- 原型——> __proto__ 或者是prototype,都是原型对象
- 原型的作用之一:共享数据,节省内存空间
九、构造函数和实例对象和原型对象之间的关系
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-cE4HXw9K-1574084136095)(C:\Users\吴建明\Desktop\构造函数和实例对象和原型对象之间的关系.jpg)]
补充自己理解的:
- constructor指向引用的构造函数
- 由于__proto__不是标准的属性:可以省略
- __proto__ 指向的是实例对象中的构造函数的prototype原型对象
十、总结三者之间的关系(构造函数,实例对象,原型对象)
- 构造函数可以实例化对象
- 构造函数中有一个属性叫prototype,是构造函数的原型对象
- 构造函数的原型( prototype )中有一个constructor构造器,这个构造器指向的就是自己所在的原型对象所在的构造函数
- 实例对象的原型对象( __proto__)指向的是该构造函数的原型对象
- 构造函数的原型对象( prototype )中的方法是可以被实例对象直接访问的
十一、什么样子的数据需要写在原型中?
- 需要共享的数据可以写在原型中
- 原型的作用之一:资源共享
- 属性需要共享,方法也需要共享
- 不需要共享的数据写在构造函数中,需要共享的数据写在原型中
十二、简单原型语法
- 构造函数名.prototype = { }
- 注意事项:需要手动修改构造器的指向
十三、原型中的方法,是可以互相访问的
- 原型对象中的方法,可以相互调用的
十四、实例对象使用的属性和方法层层搜索
- 如果实例方法没有,去创建实力对象的构造函数的原型对象中去找
- 实例对象使用的属性或者方法,先从实例中查找,找到了则直接使用,找不到则,去实例对象的 __proto__ 指向的原型对象 prototype 中去找,找到了则使用,找不到报错
十五、为内置对象添加方法
为Array内置对象的原型对象添加方法
Array.prototype.mySort= function (){ for(var i = 0;i < this.length-1; i++){ for(var j = 0;j < this.length-1-i;j++){ if(this[j] > this[j+1]){ var temp = this[j]; this[j] = this[j+1] this[j+1] = temp; } } } }
十六、把局部变量变成全局变量
- 如何把局部变量变成全局变量?
- 使用自调用函数把局部变量给window就可以了