對象_原型

1: OOP 指什么媚赖?有哪些特性

OOP 即Object-oriented programming的縮寫:意為面向?qū)ο蟪绦蛟O(shè)計(jì)闹究,是一種計(jì)算機(jī)編程架構(gòu)幔崖。

OOP的關(guān)鍵特性:

  • 第一個(gè)關(guān)鍵特性是定義了類,封裝了表現(xiàn)和操作的抽象數(shù)據(jù)類型渣淤。
  • 第二個(gè)關(guān)鍵特性是繼承赏寇,從已存在的類型中繼承元素(表現(xiàn)和方法),改變或擴(kuò)展舊類型的方法价认。
  • 第三個(gè)關(guān)鍵技術(shù)被稱為多態(tài)性嗅定,它允許使用類似的方法操作不同類型的對象(通常是子類對象)。它使得類的可用性進(jìn)一步提高用踩,程序也因此更容易維護(hù)和擴(kuò)展渠退。
2: 如何通過構(gòu)造函數(shù)的方式創(chuàng)建一個(gè)擁有屬性和方法的對象?
function Box(name, age) { //構(gòu)造函數(shù)模式
    this.name = name;
    this.age = age;
    this.run = function() {
        return this.name + this.age;
    };
}
var box1 = new Box('Lee', 100); //new Box() 即可
var box2 = new Box('Jack', 200);

構(gòu)造函數(shù)的方法有一些規(guī)范:
1)函數(shù)名和實(shí)例化構(gòu)造名相同且大寫,(PS:非強(qiáng)制脐彩,但這么寫有助于區(qū)分構(gòu)造函數(shù)和
普通函數(shù))碎乃;
2)通過構(gòu)造函數(shù)創(chuàng)建對象,必須使用new 運(yùn)算符惠奸。

構(gòu)造函數(shù)可以創(chuàng)建對象執(zhí)行的過程:

1)當(dāng)使用了構(gòu)造函數(shù)梅誓,并且new 構(gòu)造函數(shù)(),那么就后臺(tái)執(zhí)行了new Object()佛南;
2)將構(gòu)造函數(shù)的作用域給新對象梗掰,(即new Object()創(chuàng)建出的對象),而函數(shù)體內(nèi)的this 就
代表new Object()出來的對象嗅回。
3)執(zhí)行構(gòu)造函數(shù)內(nèi)的代碼及穗;
4)返回新對象(后臺(tái)直接返回)。

1.構(gòu)造函數(shù)和普通函數(shù)的唯一區(qū)別妈拌,就是他們調(diào)用的方式不同拥坛。只不過,構(gòu)造函數(shù)也是函數(shù)尘分,必須用new 運(yùn)算符來調(diào)用猜惋,否則就是普通函數(shù)。
2.this就是代表當(dāng)前作用域?qū)ο蟮囊门喑睢H绻谌址秶鷗his 就代表window 對象著摔,如果在構(gòu)造函數(shù)體內(nèi),就代表當(dāng)前的構(gòu)造函數(shù)所聲明的對象定续。

3: prototype 是什么谍咆?有什么特性

prototype

prototype是函數(shù)對象上面預(yù)設(shè)的對象屬性

  1. JS中所有的東西都是對象,每個(gè)對象都有prototype這個(gè)屬性禾锤,這個(gè)屬性是一個(gè)對象(object)
  2. JS中所有的東西都由Object衍生而來, 即所有東西原型鏈的終點(diǎn)指向Object.prototype
  3. JS中構(gòu)造函數(shù)和實(shí)例(對象)之間的關(guān)系,構(gòu)造函數(shù)通過定義prototype來約定其實(shí)例的規(guī)格, 再通過 new 來構(gòu)造出實(shí)例, 他們的作用就是生產(chǎn)對象摹察。而構(gòu)造函數(shù)(方法)本身又是方法(Function)的實(shí)例, 因此也可以查到它的proto(原型鏈)

特性
給prototype 增加或者減少屬性恩掷,將改變這個(gè)類型的原型,這種改變將直接作用到由這個(gè)原型創(chuàng)建的所有對象上

4:畫出如下代碼的原型圖
function People (name){
  this.name = name;
  this.sayName = function(){
    console.log('my name is:' + this.name);
  }
}

People.prototype.walk = function(){
  console.log(this.name + ' is walking');  
}

var p1 = new People('饑人谷');
var p2 = new People('前端');
原型圖.png
5: 創(chuàng)建一個(gè) Car 對象供嚎,擁有屬性name黄娘、color、status克滴;擁有方法run逼争,stop,getStatus
function Car (name, color, status){
  this.name = name;
  this.color = color;
  this.status = status;
}
Car.prototype.run = function(){
  console.log(this.name + 'is running')
}
Car.prototype.stop = function(){
  console.log(this.name + 'stoped')
}
Car.prototype.getStatus = function(){
  console.log('status:' + this.status)
}
6: 創(chuàng)建一個(gè) GoTop 對象劝赔,當(dāng) new 一個(gè) GotTop 對象則會(huì)在頁面上創(chuàng)建一個(gè)回到頂部的元素誓焦,點(diǎn)擊頁面滾動(dòng)到頂部。擁有以下屬性和方法
1. `ct`屬性着帽,GoTop 對應(yīng)的 DOM 元素的容器
2.  `target`屬性杂伟, GoTop 對應(yīng)的 DOM 元素
3.  `bindEvent` 方法, 用于綁定事件
4 `createNode` 方法启摄, 用于在容器內(nèi)創(chuàng)建節(jié)點(diǎn)

預(yù)覽
代碼

7: 使用木桶布局實(shí)現(xiàn)一個(gè)圖片墻

預(yù)覽
代碼

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末稿壁,一起剝皮案震驚了整個(gè)濱河市幽钢,隨后出現(xiàn)的幾起案子歉备,更是在濱河造成了極大的恐慌,老刑警劉巖匪燕,帶你破解...
    沈念sama閱讀 207,113評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件蕾羊,死亡現(xiàn)場離奇詭異,居然都是意外死亡帽驯,警方通過查閱死者的電腦和手機(jī)龟再,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,644評論 2 381
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來尼变,“玉大人利凑,你說我怎么就攤上這事∠邮酰” “怎么了哀澈?”我有些...
    開封第一講書人閱讀 153,340評論 0 344
  • 文/不壞的土叔 我叫張陵,是天一觀的道長度气。 經(jīng)常有香客問我割按,道長,這世上最難降的妖魔是什么磷籍? 我笑而不...
    開封第一講書人閱讀 55,449評論 1 279
  • 正文 為了忘掉前任适荣,我火速辦了婚禮现柠,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘弛矛。我一直安慰自己够吩,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,445評論 5 374
  • 文/花漫 我一把揭開白布丈氓。 她就那樣靜靜地躺著废恋,像睡著了一般。 火紅的嫁衣襯著肌膚如雪扒寄。 梳的紋絲不亂的頭發(fā)上鱼鼓,一...
    開封第一講書人閱讀 49,166評論 1 284
  • 那天,我揣著相機(jī)與錄音该编,去河邊找鬼迄本。 笑死,一個(gè)胖子當(dāng)著我的面吹牛课竣,可吹牛的內(nèi)容都是我干的嘉赎。 我是一名探鬼主播,決...
    沈念sama閱讀 38,442評論 3 401
  • 文/蒼蘭香墨 我猛地睜開眼于樟,長吁一口氣:“原來是場噩夢啊……” “哼公条!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起迂曲,我...
    開封第一講書人閱讀 37,105評論 0 261
  • 序言:老撾萬榮一對情侶失蹤靶橱,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后路捧,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體关霸,經(jīng)...
    沈念sama閱讀 43,601評論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,066評論 2 325
  • 正文 我和宋清朗相戀三年杰扫,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了队寇。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,161評論 1 334
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡章姓,死狀恐怖佳遣,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情凡伊,我是刑警寧澤零渐,帶...
    沈念sama閱讀 33,792評論 4 323
  • 正文 年R本政府宣布,位于F島的核電站窗声,受9級特大地震影響相恃,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,351評論 3 307
  • 文/蒙蒙 一拦耐、第九天 我趴在偏房一處隱蔽的房頂上張望耕腾。 院中可真熱鬧,春花似錦杀糯、人聲如沸扫俺。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,352評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽狼纬。三九已至,卻和暖如春骂际,著一層夾襖步出監(jiān)牢的瞬間疗琉,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,584評論 1 261
  • 我被黑心中介騙來泰國打工歉铝, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留盈简,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 45,618評論 2 355
  • 正文 我出身青樓太示,卻偏偏與公主長得像柠贤,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個(gè)殘疾皇子类缤,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,916評論 2 344

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