溫故知新之javascript面向?qū)ο?/p>

類和實例是大多數(shù)面向?qū)ο缶幊陶Z言的基本概念

類：類是對象的類型模板

實例：實例是根據(jù)類創(chuàng)建的對象


但是，JavaScript語言的對象體系，不是基于“類”的，而是基于構(gòu)造函數(shù)（constructor）和原型鏈（prototype）。了與普通函數(shù)區(qū)別，構(gòu)造函數(shù)名字的第一個字母通常大寫。

JavaScript_面向?qū)ο蟪绦蛟O(shè)計

Object每個實例都會具有的屬性和方法：

Constructor：保存著用于創(chuàng)建當(dāng)前對象的函數(shù)。（構(gòu)造函數(shù)）

hasOwnProperty(propertyName)：用于檢測給定的屬性在當(dāng)前對象實例中(而不是原型中)是否存在。

isPrototypeOf(Object)：用于檢查傳入的對象是否是另外一個對象的原型。

propertyIsEnumerable(propertyName)：用于檢查給定的屬性是否能夠使用for-in語句來枚舉。

toLocaleString()：返回對象的字符串表示。該字符串與執(zhí)行環(huán)境的地區(qū)對應(yīng).

toString()：返回對象的字符串表示。

valueOf()：返回對象的字符串、數(shù)值或布爾表示。


判斷一個對象是不是另一個對象的實例，通常使用的是 instanceof，比較少使用constructor。

JavaScript設(shè)計模式與開發(fā)實踐 | 01 - 面向?qū)ο蟮腏avaScript

JavaScript在設(shè)計的時候，模仿Java引入了兩套類型機制：基本類型和對象類型。
按照J(rèn)avaScript設(shè)計者的本意，除了undefined之外，一切都應(yīng)是對象。為了實現(xiàn)這一目標(biāo)，number、boolean等幾種基本類型數(shù)據(jù)可以通過“包裝類”的方式變成對象類型數(shù)據(jù)。
JavaScript絕大部分?jǐn)?shù)據(jù)都是對象。事實上，JavaScript中的根對象是Object.prototype對象。Object.prototype對象是一個空對象。JavaScript的每個對象，都是從Object.prototype對象克隆而來。

CoffeeScript—面向?qū)ο?/p>

自從面向?qū)ο蟮木幊趟枷氤霈F(xiàn)以來，這個概念已經(jīng)被炒爛了，只要編程開發(fā)大家都會拿面向?qū)ο髞碚f事，好像只要跟面向?qū)ο笳催吘蜁@得逼格很高一樣，不過確實逼格提高了。要知道，面向?qū)ο笾皇且环N手段，最終目的是為了提高我們項目的重用性、靈活性和擴展性。
為了迎合面向?qū)ο蟮某绦蛟O(shè)計思想，JavaScript也通過自己的語法實現(xiàn)了自己的一套面向?qū)ο髾C制。不過我想問下，前端開發(fā)當(dāng)中有多少人使用過面向?qū)ο螽?dāng)中的繼承？
JavaScript面向?qū)ο蟮膶崿F(xiàn)確實有點不倫不類的感覺。下面先簡單說明下JavaScript當(dāng)中面向?qū)ο蟮膶崿F(xiàn)，涉及的東西比較深，要對constructor、prototype有一定的理解，不然看起來會很吃力，或者你也可以跳開這部分內(nèi)容，直接看CoffeeScript面向?qū)ο蟮膶崿F(xiàn)。

細(xì)說 Javascript 對象篇（一） : 對象的使用和屬性

一個經(jīng)常容易被誤解的就是數(shù)字常量不能視為對象，實際上數(shù)字常量仍然可以視為對象。這是因為 Javascript 解析器在解析點操作符時而將其視為浮點數(shù)特征而犯下的錯誤。

細(xì)說 Javascript 對象篇（二） : 原型對象

Javascript 并沒有類繼承模型，而是使用原型對象 prototype 進行原型式繼承。
盡管人們經(jīng)常將此看做是 Javascript 的一個缺點，然而事實上，原型式繼承比傳統(tǒng)的類繼承模型要更加強大。舉個例子，在原型式繼承頂端構(gòu)建一個類模型很簡單，然而反過來則是個困難得多的任務(wù)。
Javascript 是唯一一個被廣泛運用的原型式繼承的語言，所以理解兩種繼承方式的差異是需要時間的。

細(xì)說 Javascript 對象篇（三） : hasOwnProperty

判斷一個屬性是定義在對象本身而不是繼承自原型鏈，我們需要使用從 Object.prototype 繼承而來的 hasOwnProperty 方法。

hasOwnProperty 方法是 Javascript 中唯一一個處理對象屬性而不會往上遍歷原型鏈的。

細(xì)說 Javascript 對象篇（四） : for in 循環(huán)

如同 in 運算符一樣，使用 for in 循環(huán)遍歷對象屬性時，也將往上遍歷整個原型鏈。
這里我們要注意兩點，一是 for in 循環(huán)會忽略 enumerable 設(shè)置為 false 的屬性。例如一個數(shù)組的 length 屬性。第二是，由于 for in 會遍歷整個原型鏈，所以當(dāng)原型鏈過長時，會對性能造成影響。

JavaScript學(xué)習(xí)總結(jié)（五）原型和原型鏈詳解

原型鏈：當(dāng)從一個對象那里調(diào)取屬性或方法時，如果該對象自身不存在這樣的屬性或方法，就會去自己關(guān)聯(lián)的prototype對象那里尋找，如果prototype沒有，就會去prototype關(guān)聯(lián)的前輩prototype那里尋找，如果再沒有則繼續(xù)查找Prototype.Prototype引用的對象，依次類推，直到Prototype.….Prototype為undefined（Object的Prototype就是undefined）從而形成了所謂的“原型鏈”。

Javascript面向?qū)ο缶幊蹋ǘ簶?gòu)造函數(shù)的繼承

上面是采用prototype對象，實現(xiàn)繼承。我們也可以換一種思路，純粹采用"拷貝"方法實現(xiàn)繼承。簡單說，如果把父對象的所有屬性和方法，拷貝進子對象，不也能夠?qū)崿F(xiàn)繼承嗎？這樣我們就有了第五種方法。

面向?qū)ο?非構(gòu)造函數(shù)的繼承

除了使用“prototype”鏈以外，還有另一種思路：就是把父對象的屬性，全部拷貝給子對象，也能實現(xiàn)繼承。

理清javascript中的面向?qū)ο螅ㄒ唬屠^承

與其它編程語言不一樣的是，javascript的面向?qū)ο蟛⒎且蕾囉诔橄蟮念悾峭ㄟ^原型鏈，將一個個具體的對象實例進行連接，位于原型鏈下游的對象實例可以讀取/使用位于上游的對象實例的屬性/方法。
下文由簡及深，試圖一步步理清javascript面向?qū)ο蟮谋举|(zhì)。

javascript對象詳解：__proto__ 和 prototype 的區(qū)別和聯(lián)系

函數(shù)是js中的一等公民，js在創(chuàng)建對象的時候，都有一個叫做__proto__的內(nèi)置屬性，用于指向創(chuàng)建它的函數(shù)對象的原型對象prototype。只有函數(shù)有prototype, 當(dāng)你創(chuàng)建一個函數(shù)時，js會自動為這個函數(shù)加上prototype屬性，值是一個空對象。

JavaScript深入之創(chuàng)建對象的多種方式以及優(yōu)缺點

優(yōu)點：該共享的共享，該私有的私有，使用最廣泛的方式
缺點：有的人就是希望全部都寫在一起，即更好的封裝性

js面向?qū)ο缶毩?xí)-拖拽效果

普通方法變形

盡量不要出現(xiàn)函數(shù)嵌套函數(shù)

可以有全局變量

把onload函數(shù)中不是賦值的語句放到多帶帶函數(shù)中


改成面向?qū)ο?/p>

全局變量就是屬性

函數(shù)就是方法

onload中創(chuàng)建對象

改this指針問題

談?wù)?javascript 面向?qū)ο蟮囊恍┘?xì)節(jié)問題

JavaScript面向?qū)ο笾R點小結(jié)

一張圖秒懂原型鏈查找，這個是理解js原型繼承的關(guān)鍵

SegmentFault 官方目前開放的微信技術(shù)群如下：

SF.GG 后端攻城獅交流群

SF.GG 前端攻城獅交流群

SF.GG 北京技術(shù)交流群

SF.GG 上海技術(shù)交流群

SF.GG 廣州技術(shù)交流群

SF.GG 深圳技術(shù)交流群

SF.GG 杭州技術(shù)交流群

以上群組僅限程序員加入，需要入群的小伙伴請?zhí)砑庸芾韱T微信好友：mgr_segmentfault，備注『群名稱+SF用戶ID』，審核成功后會拉你進入相應(yīng)技術(shù)群。

本期完
:）