js是一个很*的语言,没有强类型的语言的那种限制,实现一个功能往往有很多做法。继承就是其中的一个,在js中继承大概可以分为四大类,上面一篇文章也提及过一些,下面开始详细说说js的继承。
1、原型继承---最简单,最常用的
function funcA(){ this.show=function(){ console.log("hello"); } } function funcB(){ } funcB.prototype=new funcA(); var b=new funcB(); b.show();
这里是运用原型链的特性实现,缺点也是很明显,如果继承的层次比较多的话,修改顶层的原型的方法,会对下面所有的对象产生影响。
2、原型冒充:
function funcA(age){ this.name="xiaoxiao"; this.age=age; this.show=function(){ console.log(this.name+this.age) } } function funcB(){ this.parent=funcA; this.parent(40); delete this.parent; } var b=new funcB(); b.show();
这个继承的方法很好理解,只不过把funcA中的代码都拿到funcB中执行一下,其实可以解释成:
function funcA(age){ this.name="xiaoxiao"; this.age=age; this.show=function(){ console.log(this.name+this.age) } } function funcB(){ // this.parent=funcA; // this.parent(40); // delete this.parent; //其实上面的过程只不是是把funcA搬过来 this.name="xiaoxiao"; this.age=age; this.show=function(){ console.log(this.name+this.age) } } var b=new funcB(); b.show();
明白了吗?
3、call和apply
这个在上面一篇文章到也提到了,也详细说明了原因,相信如果认真把原型的理解了这个就so easy.
下面不多说了,看看代码:
function funcA() { this.show = function(str) { console.log(str); } } function funcB() { this.read = function() {} } var a = new funcA(); var b = new funcB(); funcA.call(b);//use call a.show("a"); b.show("b");
call和apply效果是一样的,不过是传参方式上不一样,但是推荐用call,因为apply的效率会低很多,至于为什么,后面会说到。
4、复制继承
function funcA(){ this.name="hello"; this.show=function(){ console.log(this.name); } } function funcB(){ this.extend=function(o){ for(var p in o){ this[p]=o[p]; } } } var a=new funcA(); var b=new funcB(); b.extend(a); b.show();
这个类似于jquery的extend的方法,原理是把a中的属性遍历到b中。
好了,以上是今天的内容,比较简单,只要善于总结,这些相信在你的学习中会有帮助。下次写上下文中的this.
写于 2015.11.16