day02_JavaScript高级.ppt

构造函数和原型,今日复习,用哪个关键字创建类_ 子类如何继承父类关键字_ 调用父类中的构造函数与普通函数关键字是_,JavaScript高级第02天-昨日复习,今日复习,用哪个关键字创建类_class _ 子类如何继承父类关键字_extends_ 调用父类中的构造函数与普通函数关键字是_super_,JavaScript高级第02天-昨日复习,构造函数和原型继承ES5 中的新增方法,使用构造函数创建对象原型的作用访问对象成员的规则es5中新增的方法,要点提示,构造函数和原型导读,掌握程度：了解,1.1 构造函数和原型导读,对象的创建三种方式构造函数创建对象的new 执行做的事情,要点提示,利用构造函数创建对象,掌握程度：应用,1.2 利用构造函数创建对象,创建对象的三种方式:字面量方式new 关键字借用构造函数new执行做的四件事情:在内存中创建一个新的空对象。让 this 指向这个新的对象。执行构造函数里面的代码，给这个新对象添加属性和方法。返回这个新对象（构造函数里面不需要 return）。,1.3 构造函数创建对象总结,课堂问答,知识总结,实例成员和静态成员介绍,要点提示,实例成员和静态成员,掌握程度：了解,1.4 实例成员和静态成员,1、什么是静态成员2、什么是实例成员,1.5 实例成员和静态成员,课堂问答,课堂问答,成员：在构造函数中的属性和方法我们统称为成员实例成员:构造函数内部通过this添加的成员,实例成员只能通过实例化的对象来访问静态成员:在构造函数本身上添加的成员,只能通过构造函数来访问,不能通过由构造函数创建的实例访问,1.6 实例成员和静态成员总结,课堂问答,知识总结,构造函数的弊端构造函数的原型prototype原型和原型的作用,要点提示,构造函数原型对象prototype,掌握程度：应用,1.7 构造函数原型对象prototype,构造函数的弊端：存在浪费内存的问题。原型：每一个构造函数都有一个 prototype 属性，指向另一个对象。这个 prototype 就是一个对象，这个对象的所有属性和方法，都会被构造函数所拥有。原型的作用：资源共享。,1.8 构造函数原型总结,课堂问答,知识总结,练习,请写一个构造函数，在构造函数的原型上添加一个方法，能被构造函数创建的实例共享这个方法。,提示,创建一个构造函数在当前构造函数的prototype上添加一个方法使用该构造函数创建多个实例，来访问添加到原型上的方法,5分钟,1.9 构造函数原型案例,对象的原型_proto_对象的原型_proto_和构造函数原型的prototype的关系,要点提示,对象原型_proto_,掌握程度：应用,2.1 对象原型_proto_,实例对象原型：实例对象有一个属性 _proto_ 指向构造函数的 prototype 原型对象。实例对象原型_proto_和构造函数的prototype是等价的。方法的查找规则：首先先看对象身上是否有方法,如果有就执行这个对象上的方法，如果么没有这个方法,因为有_proto_ 的存在,就去构造函数原型对象prototype身上去查找方法。,2.2 实例对象原型总结,课堂问答,知识总结,要点提示,原型constructor构造函数,掌握程度：理解,2.4 原型constructor构造函数,constructor构造器,实例对象原型（_proto_）和构造函数原型对象（prototype）里面都有一个属性 constructor 属性，constructor 我们称为构造函数，因为它指回构造函数本身。一般情况下，对象的方法都在构造函数的原型对象中设置。如果有多个对象的方法，我们可以给原型对象采取对象形式赋值，但是这样就会覆盖构造函数原型对象原来的内容，这样修改后的原型对象 constructor 就不再指向当前构造函数了。此时，我们可以在修改后的原型对象中，添加一个 constructor 指向原来的构造函数。,2.5 constructor总结,课堂问答,知识总结,构造函数的prototype属性实例对象的_proto_属性构造器constructor,要点提示,构造函数实例和原型对象三角关系,掌握程度：应用,2.6 构造函数实例和原型对象三角关系,prototype:每一个构造函数都有一个prototype属性,指向的是该构造函数的原型对象。_proto_:每一个实例对象都有一个_proto_属性,指向构造函数的原型对象。constructor:实例对象原型_proto_和构造函数prototype原型对象里面都有一个属性 constructor 属性，都指向了构造函数。关系:1.构造函数的prototype属性指向了构造函数原型对象。2.实例对象是由构造函数创建的,实例对象的_proto_属性指向了构造函数的原型对象。3.构造函数的原型对象的constructor属性指向了构造函数,实例对象的原型的constructor属性也指向了构造函数。,2.7 构造函数实例和原型对象关系总结,课堂问答,知识总结,练习,请写一个构造函数，并创建一个实例，查看构造函数的原型对象与实例对象的原型的关系。,提示,构造函数的创建通过new关键字完成实例的创建验证构造函数的prototype和实例对象的_proto_的关系,5分钟,2.8 构造函数实例和原型对象关系案例,_proto_,要点提示,原型链,掌握程度：了解,3.1 原型链,每一个实例对象又有一个_proto_属性，指向的构造函数的原型对象，构造函数的原型对象也是一个对象，也有_proto_属性，这样一层一层往上找就形成了原型链。,3.2 原型链总结,课堂问答,知识总结,对象成员查找规则,要点提示,对象成员查找规则,掌握程度：了解,3.3 对象成员查找规则,当访问一个对象的属性（包括方法）时，首先查找这个对象自身有没有该属性。如果没有就查找它的原型（也就是 _proto_指向的 prototype 原型对象）。如果还没有就查找原型对象的原型（Object的原型对象）。依此类推一直找到 Object 为止（null），按照原型链的方式去查找。,3.4 对象成员查找规则总结,课堂问答,知识总结,构造函数中的this指向原型对象的this指向,要点提示,原型对象this指向,掌握程度：应用,3.5 原型对象this指向,构造函数中的this与原型对象的this指向的是new出来的实例对象,3.6 构造函数与原型对象this指向总结,课堂问答,知识总结,Array.prototype.sum=function(),要点提示,利用原型对象扩展内置对象方法,掌握程度：了解,3.7 利用原型对象扩展内置对象方法,为内置对象数组添加求和的方法，使用Array.prototype.sum=function()添加方法方法内部书写求和的逻辑代码最终将求和结果return,3.8 利用原型对象扩展内置对象方法总结,课堂问答,知识总结,