JS:day13

繼承

1.原型對(duì)象鏈和 Object.prototype
  hasOwnProperty()            //檢查是否存在一個(gè)給定名字的自有屬性
  propertyIsEnumerable()      //檢查一個(gè)自有屬性是否可枚舉
  isPrototypeOf()             //檢查一個(gè)對(duì)象是否是另一個(gè)對(duì)象的原型對(duì)象
  valueOf()                   //返回一個(gè)對(duì)象的表達(dá)式
  toString()                  //返回一個(gè)對(duì)象的字符串表達(dá)
<script>
    Object.prototype.add = function(value){
        return this + value;
    };
    var book = {
        title:"hello world"
    };
    console.log(book.add(5));
    console.log("title".add("end"));
</script>
2.對(duì)象繼承(Object.create)
<script>
    var person1 = {
        name:"Anqi",
        sayName:function(){
            console.log(this.name);
        }
    };
    var person2 = Object.create(person1,{
        name:{
            configurable:true,
            enumerable:true,
            value:"Hello",
            writable:true
        }
    });
    person1.sayName();
    person2.sayName();
</script>
3.構(gòu)造函數(shù)的繼承(兩種方式)
<script>
    function Rectangle(length,width){
        this.length = length;
        this.width = width;
    }
    Rectangle.prototype.getArea = function(){
        return this.length * this.width;
    };
    Rectangle.prototype.toString = function(){
        return "[Rectangle" + this.length + "x" + this.width + "]";
    };
    function Square(size){
        this.length = size;
        this.width = size;
    }

//    Square.prototype = new Rectangle();
//    Square.prototype.constructor = Square;
//    上面這段注釋改寫(xiě)成下面這段
    Square.prototype = Object.create(Rectangle.prototype,{
        constructor:{
            configurable:true,
            enumerable:true,
            value:Square,
            writable:true
        }
    });

    Square.prototype.toString = function(){
        return "[Square" + this.length + "x" + this.width + "]";
    };

    var rect = new Rectangle(5,10);
    var square = new Square(6);

    console.log(rect.getArea());
    console.log(square.getArea());

    console.log(rect.toString());
    console.log(square.toString());
</script>

【重要的兩段代碼】

    Square.prototype = new Rectangle();
    Square.prototype.constructor = Square;
Square.prototype = Object.create(Rectangle.prototype,{
        constructor:{
            configurable:true,
            enumerable:true,
            value:Square,
            writable:true
        }
    });
3.構(gòu)造函數(shù)的竊取

用 call() 和 apply() 是構(gòu)造函數(shù)竊取的關(guān)鍵蚕泽。

<script>
    function Rectangle(length,width){
        this.length = length;
        this.width = width;
    }
    Rectangle.prototype.getArea = function(){
        return this.length * this.width;
    };
    Rectangle.prototype.toString = function(){
        return "[Rectangle" + this.length + "x" + this.width + "]";
    };
    function Square(size){
        Rectangle.call(this,size,size);
    }

    Square.prototype = Object.create(Rectangle.prototype,{
        constructor:{
            configurable:true,
            enumerable:true,
            value:Square,
            writable:true
        }
    });

    Square.prototype.toString = function(){
        return "[Square" + this.length + "x" + this.width + "]";
    };

    var square = new Square(6);

    console.log(square.length);
    console.log(square.width);
    console.log(square.getArea());
</script>
4.訪問(wèn)父類(lèi)方法
Square.prototype.toString = function(){
        var text = Rectangle.prototype.toString.call(this);
        return text.replace("Rectangle","Square");
    };

該方法只需把 Square.prototype.toString 改成 Rectangle.prototype.toString 哄孤,這是唯一訪問(wèn)父類(lèi)的方法。

對(duì)象模式

1.模塊模式

模塊模式是一種用于創(chuàng)建擁有私有數(shù)據(jù)的單件對(duì)象的模式艰额。

<script>
    var person =(function(){
        var age=25;
        return{
            name:"Anqi",
            getAge:function(){
                return age;
            },
            setAge:function(value){
                age=value
            }
        }
    })();
    person.setAge(20);
    console.log(person.getAge())
</script>

以下是更改后的暴露模塊模式

<script>
    var person = (function(){
        /*私有*/
        var age=25;
        function getAge(){
            return age;
        }
        function setAge(value){
            age=value;
        }
        return{
            /*共有的*/
            name :"Anqi",
            getAge:getAge,
            setAge:setAge
        }
    })();
</script>
2.構(gòu)造函數(shù)的私有成員

在構(gòu)造函數(shù)中定義私有數(shù)據(jù)

<script>
    /*在構(gòu)造函數(shù)中定義私有數(shù)據(jù)*/
    function Person(name){
        //私有
        var age;
        this.getAge = function(){
            return age;
        };
        this.setAge = function(value){
            age = value;
        };

        this.name=name;
    }
    var anqi = new Person("Anqi");
    anqi.setAge(24);
    console.log(anqi.getAge())
</script>
3.作用域安全的構(gòu)造函數(shù)

當(dāng)你不用 new 操作符直接調(diào)用來(lái)改變this的值床玻,會(huì)遇到錯(cuò)誤

<script>
    function Person(name){
            this.name = name;
    }
    Person.prototype.sayName=function(){
        console.log(this.name)
    };
    var Anqi = Person("anqi");

    console.log(Anqi instanceof  Person);     // false
    console.log(typeof Anqi);       // undefined
</script>

可以使用這種模式來(lái)根據(jù) new 的使用與否來(lái)控制函數(shù)的行為奋蔚。

function Person(name){
        if(this instanceof Person){
            this.name = name;
        }else{
            return new Person(name);
        }
    }
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末送火,一起剝皮案震驚了整個(gè)濱河市娘汞,隨后出現(xiàn)的幾起案子歹茶,更是在濱河造成了極大的恐慌,老刑警劉巖你弦,帶你破解...
    沈念sama閱讀 218,546評(píng)論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件惊豺,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡禽作,警方通過(guò)查閱死者的電腦和手機(jī)尸昧,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,224評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門(mén),熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)旷偿,“玉大人烹俗,你說(shuō)我怎么就攤上這事∑汲蹋” “怎么了幢妄?”我有些...
    開(kāi)封第一講書(shū)人閱讀 164,911評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)茫负。 經(jīng)常有香客問(wèn)我蕉鸳,道長(zhǎng),這世上最難降的妖魔是什么忍法? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,737評(píng)論 1 294
  • 正文 為了忘掉前任置吓,我火速辦了婚禮,結(jié)果婚禮上缔赠,老公的妹妹穿的比我還像新娘衍锚。我一直安慰自己,他們只是感情好嗤堰,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,753評(píng)論 6 392
  • 文/花漫 我一把揭開(kāi)白布戴质。 她就那樣靜靜地躺著度宦,像睡著了一般。 火紅的嫁衣襯著肌膚如雪告匠。 梳的紋絲不亂的頭發(fā)上戈抄,一...
    開(kāi)封第一講書(shū)人閱讀 51,598評(píng)論 1 305
  • 那天,我揣著相機(jī)與錄音后专,去河邊找鬼划鸽。 笑死,一個(gè)胖子當(dāng)著我的面吹牛戚哎,可吹牛的內(nèi)容都是我干的裸诽。 我是一名探鬼主播,決...
    沈念sama閱讀 40,338評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼型凳,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼丈冬!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起甘畅,我...
    開(kāi)封第一講書(shū)人閱讀 39,249評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤埂蕊,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后疏唾,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體蓄氧,經(jīng)...
    沈念sama閱讀 45,696評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,888評(píng)論 3 336
  • 正文 我和宋清朗相戀三年槐脏,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了喉童。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,013評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡准给,死狀恐怖泄朴,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情露氮,我是刑警寧澤祖灰,帶...
    沈念sama閱讀 35,731評(píng)論 5 346
  • 正文 年R本政府宣布,位于F島的核電站畔规,受9級(jí)特大地震影響局扶,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜叁扫,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,348評(píng)論 3 330
  • 文/蒙蒙 一三妈、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧莫绣,春花似錦畴蒲、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 31,929評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)咖祭。三九已至,卻和暖如春蔫骂,著一層夾襖步出監(jiān)牢的瞬間么翰,已是汗流浹背。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,048評(píng)論 1 270
  • 我被黑心中介騙來(lái)泰國(guó)打工辽旋, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留浩嫌,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,203評(píng)論 3 370
  • 正文 我出身青樓补胚,卻偏偏與公主長(zhǎng)得像码耐,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子糖儡,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,960評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容

  • 工廠模式類(lèi)似于現(xiàn)實(shí)生活中的工廠可以產(chǎn)生大量相似的商品伐坏,去做同樣的事情怔匣,實(shí)現(xiàn)同樣的效果;這時(shí)候需要使用工廠模式握联。簡(jiǎn)單...
    舟漁行舟閱讀 7,763評(píng)論 2 17
  • 官方中文版原文鏈接 感謝社區(qū)中各位的大力支持,譯者再次奉上一點(diǎn)點(diǎn)福利:阿里云產(chǎn)品券每瞒,享受所有官網(wǎng)優(yōu)惠金闽,并抽取幸運(yùn)大...
    HetfieldJoe閱讀 2,998評(píng)論 4 14
  • 渾渾噩噩等姻緣, 等來(lái)一場(chǎng)壞姻緣剿骨, 哀哉代芜,哀哉。 如今都腫么了浓利? 一個(gè)兩個(gè)試婚姻挤庇, 意見(jiàn)不和就離婚, 反正大家都一...
  • 如果不能見(jiàn)你贷掖,我會(huì)每天唱歌給自己 如果能每天見(jiàn)你嫡秕,每一首情歌都是給你 我擁有許多的鮮花 但沒(méi)有你的掌聲 你存在每一...
    要多帥氣的昵稱(chēng)呢閱讀 95評(píng)論 0 0
  • 故事的開(kāi)頭牙甫,都是我給你幸福掷酗,但結(jié)局卻是我祝你幸福。 他根本不愛(ài)你 窟哺,只是舍不得你泻轰,鞍前馬后的殷勤 。 在這只好強(qiáng)飲...
    君莫笑吾閱讀 426評(píng)論 0 3