JavaScript: The Good Parts 中 Inheritance 一章 Parts 章節的意思
問題描述
最近在看JavaScript: The Good Parts,目前為止看的輕松愉快,內容講的很好。但是到了 Inheritance 一章 Parts 這一節的時候,完全傻眼了,根本不知道它在講什么東西,求給點提示或者例子,以下是章節內容
PartsWe can compose objects out of sets of parts. For example, we can make a functionthat can add simple event processing features to any object. It adds an on method, afire method, and a private event registry:
var eventuality = function (that) { var registry = {}; that.fire = function (event) { // Fire an event on an object. The event can be either // a string containing the name of the event or an // object containing a type property containing the // name of the event. Handlers registered by the ’on’ // method that match the event name will be invoked.var array,func,handler,i,type = typeof event === ’string’ ?event : event.type;// If an array of handlers exist for this event, then// loop through it and execute the handlers in order.if (registry.hasOwnProperty(type)) { array = registry[type]; for (i = 0; i < array.length; i += 1) {handler = array[i];// A handler record contains a method and an optional// array of parameters. If the method is a name, look// up the function.func = handler.method;if (typeof func === ’string’) { func = this[func];}// Invoke a handler. If the record contained// parameters, then pass them. Otherwise, pass the// event object.func.apply(this,handler.parameters || [event]);} } return this;};that.on = function (type, method, parameters) {// Register an event. Make a handler record. Put it// in a handler array, making one if it doesn’t yet// exist for this type.var handler = { method: method, parameters: parameters};if (registry.hasOwnProperty(type)) { registry[type].push(handler);} else { registry[type] = [handler];}return this; }; return that;};
We could call eventuality on any inpidual object, bestowing it with event handling
We could also call it in a constructor function before that is returned:
eventuality(that)
In this way, a constructor could assemble objects from a set of parts. JavaScript’sloose typing is a big benefit here because we are not burdened with a type systemthat is concerned about the lineage of classes. Instead, we can focus on the characterof their contents.If we wanted eventuality to have access to the object’s private state, we could pass itthe my bundle
問題解答
回答1:英文的 'parts' 意思是部分,這里我不知道該怎么準確的描述它的意思。大概就是說,可以通過一些方法將多個“部分”組合在對象上,在構建函數中,當然就是組合在 this 上。比如 eventuality,簡化一下
var eventuality = function(that) { // 用于保存注冊到 that 上的事件,閉包實現 var registry = {}; // 注冊事件,將事件注冊到 registry 中 that.on = function() {}; // 從 registry 中搜索對應的事情處理函數來執行 that.fire = function() {};};
它會為傳入的對象 that 添加 on() 和 fire() 兩個方法用于事件的注冊和觸發,而閉包變量 registry 用于保存注冊的事件(處理函數)。這個函數當然是為對象添加事件處理功能的。
假如我們還有一個其它功能需要添加到對象,比如序列化為 JSON,也就是添加一個 toJson() 方法將當前對象序列化成 JSON 字符串,比如
function jsonlity(that) { that.toJson = function() {};}
然后我們有一個 Boo 類,它除了自身的一些特性之外,還需要事件和 JSON 特性,那么在其構造函數中就可以這樣
function Boo() { // Boo 自身的構造內容 // ...... eventuality(this); // 添加事件功能 jsonlity(this); // 添加 JSON 支持}
后面兩句應該就是所謂的 compose parts 吧
補充這種方法會為每個對象設置相關方法函數的副本,不能重用定義的方法,所以還是比較耗資源的。不過教程中引入這一段應該是為了引出后面的繼承這個知識點。
說到繼承,ES2015 語法上已經支持 class 和 extends,比起之前的構造函數方式更加嚴格,也更方便,所以這部分我建議你多了解一下新的類語法,不要太糾結舊的類語法。以后有一定基礎也有時間的時候,如果有興趣,再去研究 JS 的原型機制和基于原型機制的 OO 實現。
相關文章:
1. docker安裝后出現Cannot connect to the Docker daemon.2. Docker for Mac 創建的dnsmasq容器連不上/不工作的問題3. 刷新頁面出現彈框4. javascript - 編程,算法的問題5. javascript - 怎么看網站用了什么技術框架?6. mysql - 用PHPEXCEL將excel文件導入數據庫數據5000+條,本地數據庫正常,線上只導入15條,沒有報錯,哪里的問題?7. javascript - 請教空白文本節點的問題8. PC 手機兼容的 編輯器9. 關于Android權限的獲取問題,大家遇到過這樣的情況嘛?10. css - 關于border-image
