美文网首页
学习JS笔记(第八章-OOP上)

学习JS笔记(第八章-OOP上)

作者: 这很重要吗 | 来源:发表于2017-05-05 17:00 被阅读0次

OOP概念##

OOP特点:抽象、封装、继承、多态

Paste_Image.png

prototype属性与原型##

创建一个函数Foo时,Foo会有一个prototype属性,并默认有两属性:
Foo.prototype.constructorFoo.prototype.__proto__
其中,Foo.prototype.__proto__ 就是Foo.prototype的原型
Foo.prototype.__proto__ 又指向 Objectprototype 属性,即 Object.prototype

Foo.prototype的作用:
当使用 var obj = new Foo() ;生成Foo 的实例obj 时,Foo.prototype 对象属性会当作 obj的原型 obj.__proto__

prototype属性与原型__proto__的关系:
prototype 是构造器(函数对象)上面预置的对象属性,原型 __proto__ 是对象(实例对象)上的原型
对象的原型__proto__指向其构造器的prototype 属性

Paste_Image.png

实现继承的实例##

person直接调用this会指向全局对象window
Student.prototype = Object.create(Person.prototype);
1.创建一个空对象,且空对象的原型指向参数Person.prototype
2.然后把这个创建出来的空对象赋值给Student.prototype。实现对象的原型链继承,而且不影响到原始对象Person.prototype
3.Object.create只传第一个参数时,是创建原型指向参数的空对象。但是其第二个参数是可以设置新对象的属性及权限

Person.call(this,name,age) 的意思就是使用Person对象代替this对象,那么student中不就有Person的所有属性和方法了吗,student对象就能够直接调用Person的方法以及属性了

Paste_Image.png

再谈原型链##

Paste_Image.png

对象原型一般不暴露,但是有两种方式可以访问:在chrome浏览器可以使用obj._proto_来查找obj的原型
在ES5里面可以使用Object.getPrototypeOf(obj)来查找obj的原型

Paste_Image.png

Object.create(null)建立一个空对象把原型链指向null,null没有原型链;

5

es5的bind方法返回的函数没有prototype属性

Paste_Image.png

修改prototype属性产生的影响##

动态修改prototype属性时,会影响已经创建或者新创建的对象实例
修改了整个prototype,赋值为新的对象,则不会影响已经创建的对象实例,但会影响后续新创建的实例

Paste_Image.png

内置构造器的prototype##

假如绝大多数对象上希望有某个属性x;所以设置,Object.property.x=1;
想要不会有边界效应——for in的时候会把这个x遍历出来。
可以通过defineproperty设置相应的属性,enumerable

Paste_Image.png

instanceof##

<value> instanceof <Type>:右边是函数或函数构造器,否则会报错,左边是一般是对象,否则会返回false,判断右边函数或者构造器的prototype属性是否出现在左边的原形链上
可识别所有对象类型,不识别原始类型。
基于原型链。
不同windowiframe之间不能用instanceof来检测类型。

Paste_Image.png

实现继承的方式##

1禁止使用,修改子类时会一并修改父类
2不推荐使用,使用Person的构造器创建会带回Person的参数
3理想的继承方式【ES5之后才支持】,可以用右侧的方法进行兼容。(返回一个空对象,并且原型指向参数)

new F;创建一个对象时,该对象的原型指向构造器的prototype属性

Paste_Image.png

java VS js##

Paste_Image.png

相关文章

网友评论

      本文标题:学习JS笔记(第八章-OOP上)

      本文链接:https://www.haomeiwen.com/subject/ejtstxtx.html