面向对象:不要被这个名字吓到啊,它不是一门技术,只是一种通用思想而已。
名词解释:
- 面向对象:使用对象时,只关注对象提供的功能,不用在意其内部细节。它是一种通用思想一种思路,并非只在编程中使用,任何事情都可以采用。举个例子:我们在使用收音机的时候,只需知道那个钮可以操作什么功能就好,不关心它的工作原理。
- oop:Object Oriented Programming 面向对象的程序设计。
- this:指的是当前的方法属于谁。
面向对象的思维导图:
js中的面向对象:
面相对象(oop)特点:
1 抽象:抓住核心问题,从整体抽出来一个用来构造对象。例如我们在填写用户信息的时候,会写到姓名,性别以及年龄等等,这都是可以用来收集用户信息的。
2.封装:不考虑内部实现,只考虑功能上的使用。
3.继承性:从已有的对象中,继承出新的对象。
对象的组成:
- 方法即函数
- 属性即变量
js中的普通对象与函数对象:
1 | function f1(){}; |
- 总结:在上面的例子中 o1 o2 o3 为普通对象,f1 f2 f3 为函数对象。怎么区分,其实很简单, 凡是通过 new Function() 创建的对象都是函数对象,其他的都是普通对象。 f1,f2,归根结底都是通过 new Function()的方式进行创建的。Function Object 也都是通过 New Function()创建的。
原型对象:
在JavaScript 中,每当定义一个对象(函数)时候,对象中都会包含一些预定义的属性。其中函数对象的一个属性就是原型对象 prototype。注:普通对象没有prototype,但有proto属性。
原型对象其实就是普通对象(Function.prototype除外,它是函数对象,但它很特殊,他没有prototype属性(前面说道函数对象都有prototype属性))。看下面的例子:
1 | function f1(){}; |
原型prototype:
- 原型的应用:可以扩展系统对象,添加一些本部支持的方法和属性。
- 原型的原理:与css中的.class类一样,给一类的元素添加方法和属性。
原型prototype应用:
1 | var arr1=[1,2,3]; |
(分析):
- 这是分别求两个数组相加的和.
- 对于arr1和arr2重复使用的代码,给他们创建了一个函数,并且把他们包起来,哪里需要,哪里就调用。
- 最后如果不使用return,则外面用不到这个对象,即return是返回函数控制结果。
- prototype是给两个相同的数组添加一个方法。
(小结):
- 构造函数时候,首字母要大写;
- 构造函数里:属性(每个对象各不相同),不同的东西就加在这里。
- 原型prototype:方法(所有对象都一样),相同的东西加在这里。
js中的this机制:
- 默认绑定全局变量:
1 | function fn() { |
- 隐式绑定(隐式调用的意思是,函数调用时拥有一个上下文对象,就好像这个函数是属于该对象的一样):
1
2
3
4
5
6
7
8
9
10
11
12function fn() {
console.log( this.a );
}
var obj2 = {
a: 42,
fn: fn
};
var obj1 = {
a: 2,
obj2: obj2
};
obj1.obj2.fn(); // 42 -- this引用的是obj2.
失去隐式绑定的情况下:
1 | function fn() { |
- 显示绑定:(它接受第一个参数即是上下午问对象,并将其赋给this)
1 | function fn() { |
如果传递为null,结果就是绑定默认全局变量。
1 | function fn() { |
- new新对象绑定(如果是构造函数,用new来调用,绑定的将是新创建的对象)
1 | function fn(a) { |