javascript物件導向繼承方式分享

來源:互聯網
上載者:User

1、javascript的大段文字區塊聲明

 1 $(document).ready(
 2       function ()
 3       {
 4           var str = '\
 5           helo me fdsaf fdsaf\
 6           me\
 7           \
 8           test\
 9           ';
10           alert(str);
11       }
12     );
13 

 

這個和@大大柳樹 曾經遇到過該問題。

2、Douglas Crockford實現的一個巧妙地類模式的繼承。加了些注釋方便理解。

理解這段函數需要的基礎知識

(1)、Function.prototype增加一個公有方法。所有由類的擴充的函數都可以使用它。它有一個名稱和一個函數,並把它們增加到了函數的prototype上。

(2)、if,while 這些需要判斷函數的語句,數字0作為條件轉換為false,>0轉換為true。

 

實現繼承函數

//輔助方法
Function.prototype.method = function (name, func) {
    this.prototype[name] = func;
    return this;
};
//比較複雜的函數= =
//可以實現快捷的繼承。也可以讓選擇性的調用父物件的函數。
Function.method('inherits', function (parent) {
    var d = {};
    this.prototype = new parent();
    var p = this.prototype;
    //一個特權方法可以調用父類的方法。
    this.method('uber', function uber(name) {
        //判斷該方法是否存在
        if (!(name in d))
        {
            d[name] = 0;
        }
        var f, r, t = d[name], v = parent.prototype;
        //是否執行過
        if (t)
        {
            //如果有執行過
            while (t)
            {
                v = v.constructor.prototype;
                t -= 1;
            }
            f = v[name];
        }
        //首次執行
        else
        {
            f = p[name];
            //如果指向當前原型的方法,調用父物件的方法
            if (f == this[name])
            {
                f = v[name];
            }
        }
        //巧妙而噁心的呼叫堆疊記錄
        d[name] += 1;        //這個函數也很巧妙,arguments不是一個真正的數組,所以必須再一次使用apply來調用數組的slice的方法。        r = f.apply(this, Array.prototype.slice.apply(arguments, [1]));
        alert(d[name]);
        return r;
    });
    return this;
});
//只繼承父類特定函數的輔助函數
Function.method('swiss', function (parent) {
    for (var i = 1; i < arguments.length; i += 1)
    {
        var name = arguments;
        this.prototype[name] = parent.prototype[name];
    }
    return this;
}

 

 

 

 

調用代碼

function User() {
    this.name = "user";
}
User.method("sayYouName", function () { alert("from:" + this.name); });
function Man() {
    this.name = "man";
}
Man.inherits(User);
Man.method("sayYouName",
function () {
    this.uber("sayYouName");
    alert("and i am man");
});

 3、dean edwards base.js的類繼承方式

這個類繼承的方式會更優雅些,如果方法被覆蓋的情況下更是如此,只需this.base調用即可。不用顯示寫出方法名

 

代碼

//base.js begin
var Star = Base.extend({
    constructor: function (name) {
        this.name = name;
    },
    name: "",
    say: function (message) {
        alert(this.name + ": " + message);
    }
});

var Sun = Star.extend({
    say: function (message) {
        this.base(message);
        alert("base over");
    }
});

 

 

調用代碼

 

(new Sun("tom")).say("hello world!");

 

 

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.