JavaScript数据结构与算法之栈详解


Posted in Javascript onMarch 12, 2015

在上一篇博客介绍了下列表,列表是最简单的一种结构,但是如果要处理一些比较复杂的结构,列表显得太简陋了,所以我们需要某种和列表类似但是更复杂的数据结构---栈。栈是一种高效的数据结构,因为数据只能在栈顶添加或删除,所以这样操作很快,而且容易实现。

一:对栈的操作。

栈是一种特殊的列表,栈内的元素只能通过列表的一端访问,这一端陈为栈顶。比如餐馆里面洗盘子,只能先洗最上面的盘子,盘子洗完后,也只能螺到这一摞盘子的最上面。栈被称为 "后入先出"(LIFO)的数据结构。

由于栈具有后入先出的特点,所以任何不在栈顶的元素都无法访问,为了得到栈低的元素,必须先拿掉上面的元素。我们可以对栈的两种主要操作是将一个元素 压入栈 和 将一个元素 弹出栈。入栈我们可以使用方法push()方法,出栈我们使用pop()方法。pop()方法虽然可以访问栈顶的元素,但是调用该方法后,栈顶元素也就从栈中被永久性的删除了。另一个我们很常用的方法是peek(),该方法只返回栈顶元素,而不删除它。

入栈和出栈的实列图如下:

JavaScript数据结构与算法之栈详解

push(),pop()和peek()是栈的三个主要方法,但是栈还有其他方法和属性。如下:

clear():清除栈内的所有元素。

length(): 记录栈内元素的个数。

二:对栈的实现如下:

我们可以先实现栈类的方法开始;如下:
 

  function Stack() {

      this.dataStore = [];

      this.top = 0;

  }

 

 如上:dataStore 是保存栈内的所有元素。变量top记录栈顶的位置,初始化为0. 表示栈顶对应数组的起始位置为0,如果有元素被压入栈。该变量值将随之变化。

我们还有如下几个方法:push(), pop(), peek(),clear(),length();

1.  push()方法;当向栈内压入一个新元素时,需要将其保存在数组中变量top所对应的位置,然后top值加1,让其指向数组中下一个位置。如下代码:

function  push(element) {

     this.dataStore[this.top++] = element;

}

2. pop()方法与push()方法相反---它返回栈顶元素,同时将top值减1.如下代码:
   function pop(){

       return this.dataStore[--this.top];

   }

3. peek()方法返回数组的第top-1个位置的元素,即栈顶元素;
    function peek(){

        return this.dataStore[this.top - 1];

    }

4. length()方法 有时候我们要知道栈内有多少个元素,我们可以通过返回变量top值的方式返回栈内的元素个数,如下代码:
     function length(){

         return this.top;

     }

5. clear(); 有时候我们要清空栈,我们将变量top值设为0;如下代码:
   function clear() {
        this.top = 0;
    }

如下所有代码:
function Stack() {

    this.dataStore = [];

    this.top = 0;

}
Stack.prototype = {

    

    // 向栈中压入一个新元素

    push: function(element) {

        this.dataStore[this.top++] = element;

    },

    // 访问栈顶元素,栈顶元素永久的被删除了

    pop: function(){

        return this.dataStore[--this.top];

    },

    // 返回数组中的 top-1 个位置的元素,即栈顶元素

    peek: function(){

        return this.dataStore[this.top - 1];

    },

    // 栈内存储了多少个元素

    length: function(){

        return this.top;

    },

    // 清空栈

    clear: function(){

        this.top = 0;

    }

};
demo实例如下:
var stack = new Stack();

stack.push("a");

stack.push("b");

stack.push("c");

console.log(stack.length()); // 3

console.log(stack.peek());   // c
var popped = stack.pop();

console.log(popped);  // c
console.log(stack.peek()); // b
stack.push("d");
console.log(stack.peek());  // d
stack.clear();
console.log(stack.length());  // 0
console.log(stack.peek());  // undefined

下面我们可以实现一个阶乘函数的递归定义;比如5!的阶乘 5!= 5 * 4 * 3 * 2 * 1;

如下代码:

function fact(n) {

    var s = new Stack();

    while(n > 1) {

        s.push(n--);

    }

    var product = 1;

    while(s.length() > 0) {

        product *= s.pop();

    }

    return product;

}

console.log(fact(5));

上面的代码含义是:先数字5传入函数,使用while循环,每次自减1的之前,把自己使用栈的函数push()压入栈内,直到变量n  小于 1为止。然后定义一个变量product;通过栈的length()的方法判断是否大于0 且每次执行 product* = s.pop();  pop()方法返回栈顶元素,且从栈中删掉该元素。所以每次执行一次,就删掉一个元素,直到s.length() <= 0 为止。所以 product = 5*4*3*2*1 .等操作。

Javascript 相关文章推荐
onpropertypchange
Jul 01 Javascript
JavaScript 学习笔记(十三)Dom创建表格
Jan 21 Javascript
事件委托与阻止冒泡阻止其父元素事件触发
Sep 02 Javascript
jQuery的观察者模式详解
Dec 22 Javascript
Javascript验证Visa和MasterCard信用卡号的方法
Jul 27 Javascript
用瀑布流的方式在网页上插入图片的简单实现方法
Sep 23 Javascript
微信小程序 解决swiper不显示图片的方法
Jan 04 Javascript
JS仿Base.js实现的继承示例
Apr 07 Javascript
详解Angular的8个主要构造块
Jun 20 Javascript
前后端常见的几种鉴权方式(小结)
Aug 04 Javascript
javascript自定义右键菜单插件
Dec 16 Javascript
vue 导航锚点_点击平滑滚动,导航栏对应变化详解
Aug 10 Javascript
jQuery实现简单的日期输入格式化控件
Mar 12 #Javascript
Javascript数据结构与算法之列表详解
Mar 12 #Javascript
javascript实现 百度翻译 可折叠的分享按钮列表
Mar 12 #Javascript
基于jquery实现的自动补全功能
Mar 12 #Javascript
jquery实现页面百叶窗走马灯式翻滚显示效果的方法
Mar 12 #Javascript
window.open()实现post传递参数
Mar 12 #Javascript
js运动动画的八个知识点
Mar 12 #Javascript
You might like
php抽奖小程序的实现代码
2013/06/18 PHP
php实现事件监听与触发的方法
2014/11/21 PHP
php文件操作相关类实例
2015/06/18 PHP
PHP中两个float(浮点数)比较实例分析
2015/09/27 PHP
php搜索文件程序分享
2015/10/30 PHP
详解PHP swoole process的使用方法
2017/08/26 PHP
jquery之empty()与remove()区别说明
2010/09/10 Javascript
JavaScript移除数组元素减少长度的方法
2013/09/05 Javascript
SeaJS入门教程系列之SeaJS介绍(一)
2014/03/03 Javascript
跟我学Node.js(四)---Node.js的模块载入方式与机制
2014/06/04 Javascript
详解NodeJs支付宝移动支付签名及验签
2017/01/06 NodeJs
jQuery表格(Table)基本操作实例分析
2017/03/10 Javascript
jQuery轻松实现无缝轮播效果
2017/03/22 jQuery
12个非常有用的JavaScript技巧
2017/05/17 Javascript
基于node.js express mvc轻量级框架实践
2017/09/14 Javascript
动态创建Angular组件实现popup弹窗功能
2017/09/15 Javascript
vue中前进刷新、后退缓存用户浏览数据和浏览位置的实例讲解
2018/09/21 Javascript
详解mpvue中小程序自定义导航组件开发指南
2019/02/11 Javascript
layui实现二维码弹窗、并下载到本地的方法
2019/09/25 Javascript
JavaScript读取本地文件常用方法流程解析
2020/10/12 Javascript
学习 Vue.js 遇到的那些坑
2021/02/02 Vue.js
[52:29]DOTA2上海特级锦标赛主赛事日 - 2 胜者组第一轮#3Secret VS OG第三局
2016/03/03 DOTA
教你如何将 Sublime 3 打造成 Python/Django IDE开发利器
2014/07/04 Python
在Mac OS上搭建Python的开发环境
2015/12/24 Python
python开发之str.format()用法实例分析
2016/02/22 Python
解决Jupyter因卸载重装导致的问题修复
2020/04/10 Python
Python多线程thread及模块使用实例
2020/04/28 Python
css3实现的下拉菜单效果示例
2014/01/22 HTML / CSS
校园门卫岗位职责
2013/12/09 职场文书
高校十八大报告感想
2014/01/27 职场文书
乡镇庆八一活动方案
2014/02/02 职场文书
2014年五四青年节活动策划书
2014/04/22 职场文书
先进典型发言材料
2014/12/30 职场文书
社区敬老月活动总结
2015/05/07 职场文书
nginx location 带斜杠【 / 】与不带的区别
2022/04/13 Servers
Go web入门Go pongo2模板引擎
2022/05/20 Golang