中文字幕精品亚洲无线码二区,国产黄a三级三级三级看三级,亚洲七七久久桃花影院,丰满少妇被猛烈进入,国产小视频在线观看网站

Jquery真的不(bu)難~第(di)七回 JS也(ye)要面向對象(xiang)

回到目錄  

  前幾篇文章以JQ為主(zhu),本系列(lie)的(de)八篇文章中,第(di)一講(jiang)為JS基礎,從第(di)二講(jiang)開(kai)始到第(di)六(liu)講(jiang)主(zhu)要(yao)是(shi)JQ基礎知(zhi)識,而第(di)七講(jiang)與第(di)八講(jiang)是(shi)JS中的(de)一些高級(ji)應(ying)用,寫到這(zhe)(zhe)里(li),也(ye)快(kuai)要(yao)和《Jquery真(zhen)的(de)不難(nan)》說再見了,有點舍不得,恩(en),連續的(de)兩天(tian)失眠,呵呵,不知(zhi)道為什么,可能(neng)是(shi)興奮過度了吧,呵呵,總(zong)之(zhi)這(zhe)(zhe)幾天(tian)的(de)狀(zhuang)態超級(ji)好,我喜歡這(zhe)(zhe)種感覺,非常感謝!

JS也要面向對(dui)象這個(ge)題目(mu)很大(da),我是(shi)搞C#開發的,而(er)C#是(shi)個(ge)面向人(ren)性(xing)化(hua)的語言(yan),呵(he)(he)呵(he)(he),我更希望把(ba)面向對(dui)象改成(cheng)面向人(ren)性(xing)化(hua),呵(he)(he)呵(he)(he),因為只有(you)你把(ba)它擬人(ren)化(hua)之后,你才能更好的去學習吧,編(bian)程(cheng),上(shang)學時大(da)多人(ren)說它是(shi)個(ge)枯燥的東西(xi),編(bian)程(cheng)課卓(zhuo)見(jian)變成(cheng)了(le)(le)睡覺課,呵(he)(he)呵(he)(he),但似乎從那里起,我就已經(jing)被代(dai)碼吸(xi)引(yin)了(le)(le),不(bu)知道為什(shen)么,但到(dao)今天我終(zhong)于找(zhao)到(dao)原因了(le)(le),因為我把(ba)代(dai)碼擬人(ren)化(hua)了(le)(le),或者說我被代(dai)碼擬人(ren)化(hua)了(le)(le),呵(he)(he)呵(he)(he)!

一 函數實現(xian)的面(mian)向對象

       window.onload = function () {

            //定義一(yi)下游戲功能的函(han)數對象
            var Game = function (canvas, options) {
                var _options = options || { width: 300, height: 300, background: "#ff0000", border: "solid 1px black" };
                var _pos = { x: _options.width / 2, y: _options.height / 2 };
                var _this = this; //這樣在canvas對象的事件內部可以向到root級(ji)的元素了
                canvas.onmousemove = function (ev) {
                    _pos = {
                        x: ev.clientX - canvas.offsetLeft,
                        y: ev.clientY - canvas.offsetTop
                    };
                    _options = { width: 100, height: 100, background: "#ffff00" };
                    init();
                }

                var init = function () {
                    canvas.style.position = "absolute";
                    canvas.style.border = _options.border;
                    canvas.style.background = _options.background;
                    canvas.style.width = _options.width + "px";
                    canvas.style.height = _options.height + "Px";
                    canvas.style.left = _pos.x + "px";
                    canvas.style.top = _pos.y + "px";
                }
                init();
                this.Content("真的不錯,擴展方法"); //不(bu)在本方法(fa)內實(shi)現,只是調用一下

            }
            Game.prototype.Content = function (msg) {//在(zai)這(zhe)樣實現它的功能
                console.log(msg);
            }
            var canvas = document.getElementById("canvas");
            new Game(canvas); //如果想用Game里的擴展方(fang)法(fa)Content,需(xu)要new一下,因(yin)為Content屬于實例方(fang)法(fa)
}

二 通過(guo)JS對(dui)象實(shi)現的面向對(dui)象

        //一個人
            var People = {
                Name: "lose.zhang",
                Age: 30,
                Enjon: ["C#", "JS", "SQL", "NoSQL", "SOA", "AOP", "IOC", "DynamicProxy", "OOD&DDP"],
                Print: function (msg) {
                    console.log(msg);
                },
                Work: {
                    Name: "Software Architect",
                    Salary: "保密",
                    Print: function () {
                        console.log("這個人:" + People.Name
                        + ",他的年齡:" + People.Age
                        + ",他的特長是:" + People.Enjon
                        + ",它的職位是:" + this.Name
                        + ",它的薪水是:" + this.Salary);
                    }
                }
            };
            People.Work.Print();

恩,在這(zhe)些代碼實現過程(cheng)中(zhong),有幾個基礎東西(xi)要撐握一下了:

聲明變量:var x=1;

聲(sheng)明數組:var xArr=[];

聲明(ming)對象:var xObject={};

聲明函(han)數:var xFunction=function(){};

函數實例(li):var xFunInstance=new xFunction();

函數擴(kuo)展(zhan)方(fang)法:XFunction().prototype.ExtensionForPrint(){};  //只有(you)函數的實(shi)例對象,才能訪問擴(kuo)展(zhan)方(fang)法

恩差不多了(le),就到這里吧!

感謝閱讀!

回到目錄

posted @ 2013-01-17 17:29  張占嶺  閱讀(4843)  評論(2)    收藏  舉報