JavaScript中数组继承的简单示例
更新时间：2015年07月29日 11:01:13 投稿：goldensun
这篇文章主要介绍了JavaScript中数组继承的简单示例,数组继承是JavaScript入门学习中的基础知识,需要的朋友可以参考下
在写一些库时经常会用到树结构的数据，而且一些树形结构的数据对从根到叶的路径获取需求非常高。比如一个站点的整个路由表就是一棵这样的树，它的「路径」实际上就是 URL 中的 path 部分。所以我好几次都用了丧心病狂的数组继承去实现，下面给大家分享下。
在 JavaScript 中，数组也属于 Object 的一种，它也可以继承。任何两个对象本身就可以有继承关系，数组也不例外。于是我们让一个树的任何一个节点都是数组，它只维护自己下标最大的那个元素的值。其它元素的值通过原型继承从祖先节点继承而来。这样我们就可以像操作一般数组一样在叶节点上访问从根节点过来的路径了。下面是一个简易实现：
运行
<script>
// 定义节点类
var TNode = function(value) {
this.push(value);
};
TNode.prototype = [];
TNode.prototype.constructor = TNode;
TNode.prototype.createChild = function(value) {
var node = Object.create(this);
TNode.call(node, value);
return node;
};
// 使用节点造出一棵简单的树
var root = new TNode('root');
var a = root.createChild('a');
var b = a.createChild('b');
// 将叶节点视为数组，直接得到路径
document.write(b.join('/')); <!-- root/a/b
</script>
这个用法算是比较黑的魔法，如果不懂原型继承的原理可能很难看懂。所以如果只是作为一个库的实现也许可以这么写（我已经用过好多次了，事实证明并没有坑），但直接在业务代码中如果这么用就可能被吐槽到死。虽然这个用法并没有违背 JavaScript 这种语言的核心思想。
这个用法的一个特点就是祖先节点的值更新时会自动同步到所有子节点上。虽然原型链访问也存在性能开销，但比起在代码层自己去遍历树已经是快得不能再多了。当然如果没有这样的需求，只是想实现一棵简简单单的数还是使用传统方式比较好。毕竟这太依赖语言了，以后如果要迁移到别的编程语言可能会比较困难。
相关文章
Javascript基础教程之数据类型 （字符串 String）
javascript一共有9种数据类型，分别是字符串 String、数值型 Number、布尔型 Boolean、未定义 Undefine、空值 Null、对象 Object、引用Refernce、列表型 List、完成型 Completion，我们今天首先来看看（字符串 String）2015-01-01
AJAX,近几年火热起来的一个词.什么是ajax本文就不介绍了，其实,AJAX也就是 javascript脚本的应用.全拼是:AsynchronousJavaScript+XML .现在我们就来看一个用javascript实现的局部刷新2008-12-12
这篇文章主要介绍了深入理解JavaScript定时机制,对于学习JavaScript有一定的帮助，感兴趣的小伙伴们可以参考一下。2016-10-10
JSON格式本就发自于JavaScript中的对象和数组,所以js操作起来自然也是最为简单原始,接下来我们就来看一些常用的JavaScript中对JSON对象的基本操作示例2016-05-05
这个问题一般是因为网页中使用了一些js代码，而ie的默认安全级别过高导致运行js时需要经过准许才可以。下面是IE的设置方法。2010-10-10
这篇文章主要介绍了javascript中clone对象的方法,需要的朋友可以参考下2014-12-12
这篇文章主要介绍了javascript中声明函数的方法及调用函数时的返回值，示例如下，不了解的方法可以参考下2014-07-07
本文向大家简单介绍了javascript的数据类型以及他们直接的转换方法，虽然没有太多示例，但是也是个人的一些经验总结，这里推荐给大家。2015-02-02
我们经常需要在JavaScript中给Element动态添加各种属性，这可以通过使用setAttribute()来实现，这就涉及到了浏览器的兼容性问题2013-07-07
这篇文章主要为大家介绍了前端变量函数命名规则的总结，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-07-07
最新评论