JS_继承和闭包
2015-01-25 19:43
197 查看
一、原型链进行继承
1.JS的继承主要依靠原型链来实现,使函数的原型指向另一函数的实例,依次来完成继承,其实质就是重写原型对象。
继承后属性和方法的依照原型链进行搜索,1)先在实例中搜索,2)搜索SubType.prototype,3)搜索SuperType.prototype,直到找到该方法或者该属性。
所有函数的默认原型是Object实例。
2.确认原型和实例的关系
instanceof操作符和isPrototypeOf()方法
3.例子:原型的定义与方法的重写,一定要先定义原型,再给原型添加或者重写方法,这与先指定原型再创建对象是一样的道理,否则方法中存在的指向原先原型的指针会失效,导致调用方法失败(undefined)。
二、借用构造函数进行继承
但是调用构造器进行继承面临的问题同样很明显,每个实例中方法都是不同的,方法的复用无从谈起。
三、组合继承:
JS的继承中,一般属性使用构造器进行继承,而方法则通过原型链进行继承。
对于构造亦是同理。
1.JS的继承主要依靠原型链来实现,使函数的原型指向另一函数的实例,依次来完成继承,其实质就是重写原型对象。
继承后属性和方法的依照原型链进行搜索,1)先在实例中搜索,2)搜索SubType.prototype,3)搜索SuperType.prototype,直到找到该方法或者该属性。
所有函数的默认原型是Object实例。
2.确认原型和实例的关系
instanceof操作符和isPrototypeOf()方法
3.例子:原型的定义与方法的重写,一定要先定义原型,再给原型添加或者重写方法,这与先指定原型再创建对象是一样的道理,否则方法中存在的指向原先原型的指针会失效,导致调用方法失败(undefined)。
<script type="text/javascript"> window.onload=function(){ var inputEles=document.getElementsByTagName("input"); inputEles.item(0).onclick=function(){ function SuperType(){ this.property=true; }; SuperType.prototype.getSuperValue=function(){ return this.property; }; function SubType(){ this.subProperty=false; }; //先定义原型,然后往原型中添加方法或者重写父类中的方法 SubType.prototype=new SuperType(); SubType.prototype.getSubValue=function(){ return this.subProperty; }; SubType.prototype.getSuperValue=function(){ return false; }; var sub=new SubType(); alert(sub.getSuperValue()); }; }; </script>4.原型链在继承所面临的问题:如果原型中的某一属性为引用类型,则通过实例对该属性的修改将会影响到所有该类型的实例。
inputEles.item(1).onclick=function(){ function SupType(){ //申明属性 this.colors=["red","green","yellow"]; }; SubType.prototype.getColors=function(){ return this.colors; }; function SubType(){}; //继承 SubType.prototype=new SupType(); var instance1=new SubType(); instance1.colors.push("black");//"red","green","yellow","black" alert(instance1.colors); var instance2=new SubType(); alert(instance2.colors);//"red","green","yellow","black" };原型继承的第二个问题是不能想他所继承的父类中传参,无法自定义的构造其父类。
二、借用构造函数进行继承
<span style="white-space:pre"> </span>inputEles.item(2).onclick=function(){ function SupType(name){ this.name=name; }; function SubType(name,age){ //调用构造器进行继承 SupType.call(this, name); this.age=age; }; var instance1=new SubType("Nicholas",24); alert(instance1.name+","+instance1.age); };
但是调用构造器进行继承面临的问题同样很明显,每个实例中方法都是不同的,方法的复用无从谈起。
三、组合继承:
JS的继承中,一般属性使用构造器进行继承,而方法则通过原型链进行继承。
对于构造亦是同理。
inputEles.item(3).onclick=function(){ function SupType(name){ this.name=name; this.colors=["red","green","yellow"]; }; SupType.prototype.sayName=function(){ alert(this.name); }; //属性的继承 function SubType(name,age){ SupType.call(this, name); this.age=age; }; //方法的继承要采用原型链 //首先重写原型,指明属性采用原型链进行构造 SubType.prototype=new SupType(); SubType.prototype.constructor=SubType; var instance1=new SubType(); var instance2=new SubType(); alert("两个实例对象中的方法是否为同一个方法:"+(instance1.sayName==instance2.sayName));//true instance1.colors.push("black"); alert(instance1.colors);//"red","green","yellow","black" alert(instance2.colors);//"red","green","yellow" };
相关文章推荐
- js中的继承和闭包的学习
- js综合能力提升 闭包 继承等等
- js继承,闭包再探讨!
- js 高级开发:对象属性prototype,自定义命名空间,自定义继承,闭包封装
- JS闭包与继承
- 一切皆对象之两个方法概括js,无函数签名(无多态),原型,闭包,封装,引用类型,继承……
- 最新今日头条面试题目(js闭包、原型、继承、作用域)(2016)
- JS变量提升、匿名函数、原型继承、作用域、闭包机制等。
- js重点浅谈(跨域,作用域和作用域链,闭包,原型和原型链继承)
- 变量对象,作用域链,闭包,匿名函数,this关键字,原型链,构造器,js预编译,对象模型,执行模型,prototype继承
- JS面向对象(3)之Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法
- Js实现类继承和闭包私有成员并调用
- JS继承与闭包及JS实现继承的三种方式
- JS面向对象(3) -- Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法
- js继承与闭包(笔记)
- JS继承和闭包
- JS面向对象(3)之Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法
- JavaScript面向对象(三)——继承与闭包、JS实现继承的三种方式
- JS继承和闭包
- js继承