這篇文章主要介紹了JavaScript中數組繼承的簡單示例,數組繼承是JavaScript入門學習中的基礎知識,需要的朋友可以參考下

在寫一些庫時經常會用到樹結構的數據，而且一些樹形結構的數據對從根到葉的路徑獲取需求非常高。比如一個站點的整個路由表就是一棵這樣的樹，它的「路徑」實際上就是 URL 中的 path 部分。所以我好幾次都用了喪心病狂的數組繼承去實現，下面給大家分享下。

在 JavaScript 中，數組也屬于 Object 的一種，它也可以繼承。任何兩個對象本身就可以有繼承關系，數組也不例外。于是我們讓一個樹的任何一個節點都是數組，它只維護自己下標最大的那個元素的值。其它元素的值通過原型繼承從祖先節點繼承而來。這樣我們就可以像操作一般數組一樣在葉節點上訪問從根節點過來的路徑了。下面是一個簡易實現：

運行

1. <script> 
2. // 定義節點類 
3. var TNode = function(value) { 
4. this.push(value); 
5. }; 
6. TNode.prototype = []; 
7. TNode.prototype.constructor = TNode; 
8. TNode.prototype.createChild = function(value) { 
9. var node = Object.create(this); 
10. TNode.call(node, value); 
11. return node; 
12. }; 
13.  
14. // 使用節點造出一棵簡單的樹 
15. var root = new TNode('root'); 
16. var a = root.createChild('a'); 
17. var b = a.createChild('b'); 
18.  
19. // 將葉節點視為數組，直接得到路徑 
20. document.write(b.join('/')); <!-- root/a/b 
21. </script> 

這個用法算是比較黑的魔法，如果不懂原型繼承的原理可能很難看懂。所以如果只是作為一個庫的實現也許可以這么寫(我已經用過好多次了，事實證明并沒有坑)，但直接在業務代碼中如果這么用就可能被吐槽到死。雖然這個用法并沒有違背 JavaScript 這種語言的核心思想。

這個用法的一個特點就是祖先節點的值更新時會自動同步到所有子節點上。雖然原型鏈訪問也存在性能開銷，但比起在代碼層自己去遍歷樹已經是快得不能再多了。當然如果沒有這樣的需求，只是想實現一棵簡簡單單的數還是使用傳統方式比較好。畢竟這太依賴語言了，以后如果要遷移到別的編程語言可能會比較困難。