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 相关文章推荐
jquery使用ColorBox弹出图片组浏览层实例演示
Mar 14 Javascript
javascript+html5实现仿flash滚动播放图片的方法
Apr 27 Javascript
基于jquery实现智能提示控件intellSeach.js
Mar 17 Javascript
非常酷炫的Bootstrap图片轮播动画
May 27 Javascript
原生js封装二级城市下拉列表的实现代码
Jun 16 Javascript
Javascript中常用的检测方法小结
Oct 08 Javascript
详解JavaScript跨域总结与解决办法
Oct 31 Javascript
js验证手机号、密码、短信验证码代码工具类
Jun 24 Javascript
Vue单页面应用保证F5强刷不清空数据的解决方案
Jan 31 Javascript
D3.js实现拓扑图的示例代码
Jun 30 Javascript
JavaScript 面向对象基础简单示例
Oct 02 Javascript
使用React代码动态生成栅格布局的方法
May 24 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程序运行时:Fatal error: Maximum execution time of 30 seconds exceeded in的错误提示
2016/11/25 PHP
PHP常见的序列化与反序列化操作实例分析
2019/10/28 PHP
PHP PDO和消息队列的个人理解与应用实例分析
2019/11/25 PHP
基于PHP实现邮箱验证激活过程详解
2020/10/28 PHP
js模拟select下拉菜单控件的代码
2013/05/08 Javascript
解析瀑布流布局:JS+绝对定位的实现
2013/05/08 Javascript
Javascript中各种trim的实现详细解析
2013/12/10 Javascript
利用javascript判断文件是否存在
2013/12/31 Javascript
jq实现酷炫的鼠标经过图片翻滚效果
2014/03/12 Javascript
用jquery模仿的a的title属性的例子
2014/10/22 Javascript
javascript实现删除前弹出确认框
2015/06/04 Javascript
jquery实现弹出层登录和全屏层注册特效
2015/08/28 Javascript
javaScript数组迭代方法详解
2016/04/14 Javascript
jQuery实现查找链接文字替换属性的方法
2016/06/27 Javascript
关于javascript事件响应的基础语法总结(必看篇)
2016/12/26 Javascript
AngularJS表单验证功能
2017/10/19 Javascript
vue拦截器实现统一token,并兼容IE9验证功能
2018/04/26 Javascript
基于node+vue实现简单的WebSocket聊天功能
2020/02/01 Javascript
python回调函数的使用方法
2014/01/23 Python
Python判断两个对象相等的原理
2017/12/12 Python
基于并发服务器几种实现方法(总结)
2017/12/29 Python
python 实现让字典的value 成为列表
2019/12/16 Python
Python3 利用face_recognition实现人脸识别的方法
2020/03/13 Python
解决tensorflow/keras时出现数组维度不匹配问题
2020/06/29 Python
pycharm中使用request和Pytest进行接口测试的方法
2020/07/31 Python
Django静态文件加载失败解决方案
2020/08/26 Python
python利用opencv实现颜色检测
2021/02/23 Python
浅谈css3中calc在less编译时被计算的解决办法
2017/12/04 HTML / CSS
英国最受欢迎的手表网站:Watch Shop
2016/10/21 全球购物
JDO的含义
2012/11/17 面试题
《乞巧》教学反思
2014/02/27 职场文书
班组长竞聘书
2014/03/31 职场文书
高中班级口号
2014/06/09 职场文书
考试作弊检讨书
2014/10/21 职场文书
三国演义读书笔记
2015/06/25 职场文书
小学生作文之《压岁钱的烦恼》
2019/09/27 职场文书