總結javascript繼承的兩種方式的N中寫法

最近翻看博客園,總結了一下javascript的繼承方式:prototype和copy繼承方式。javascript

1、prototype方式

當一個函數被建立時,Function構造函數產生的函數會隱式的被賦予一個prototype屬性,prototype包含一個constructor對象java

而constructor即是該新函數對象(constructor意義不大,可是能夠幫咱們找到繼承關係)jquery

每一個函數都會有一個prototype屬性,該屬性指向另外一對象,這個對象包含能夠由特定類型的全部實例共享的屬性和方法函數

每次實例化後,實例內部都會包含一個[[prototype]](__proto__)的內部屬性,這個屬性指向prototypeprototype

(以上圖片取自葉小釵博客)對象

2、copy方式

function extend(child,parent)//經過臨時構造器繼承
{
    var f=function(){};
    f.prototype=parent.prototype;
    child.prototype=new f();
    child.prototype.constructor=child;
    child.uber=parent.prototype;//uber 相似其餘語言裏的SuperClass
}


function extend2(child,parent)//傳遞superclass
{
    var c=child.prototype;
    var p=parent.prototype;
    for(var v in p)
    {
        c[v]=p[v];
    }
    child.uber=parent.prototype;
}

function extendcopy(parent)
{
    var temp={};
    for(var t in parent)
    {
        temp[t]=parent[temp];
    }
    temp.uber=parent;
    return temp;
}

function deepcopy(child,parent)
{
    var c=child||{};
    for(var t in parent)
    {
        if(typeof parent[t]==="object")
        {
            c[t]=(parent[t].constructor==="Array")?[]:{};
            deepcopy(c[t],parent[t]);
        }
        else
        {
            c[t]=parent[t];
        }
    }
    return c;
}

function objectextend(o)
{
    function f(){};
    f.prototype=o;
    return new f();
}
function objectextend2(o)
{
    function f(){};
    f.prototype=o;
    var n=new f();
    n.uber=o;
    return n;
}


function extendcopyplus(o,stuff)
{
    function f(){};
    f.prototype=o;
    var n=new f();
    n.uber=o;
    for(var t in stuff)
    {
        n[t]=stuff[t];
    }
    return n;
}

至於哪一種方式更好,徹底取決於本身的意願。blog

jquery使用的就是深拷貝~繼承

相關文章
相關標籤/搜索