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 相关文章推荐
cookie 最近浏览记录(中文escape转码)具体实现
Jun 08 Javascript
解析js如何获取当前url中的参数值并复制给input
Jun 23 Javascript
纯JavaScript实现HTML5 Canvas六种特效滤镜示例
Jun 28 Javascript
js拖动div 当鼠标移动时整个div也相应的移动
Nov 21 Javascript
JavaScript中各种引用类型的常用操作方法小结
May 05 Javascript
JS实现获取剪贴板内容的方法
Jun 21 Javascript
javascript中异常处理案例(推荐)
Oct 03 Javascript
fullCalendar中文API官方文档
Feb 07 Javascript
JS+WCF实现进度条实时监测数据加载量的方法详解
Dec 19 Javascript
vue-cli4.x创建企业级项目的方法步骤
Jun 18 Javascript
基于Vant UI框架实现时间段选择器
Dec 24 Javascript
详解jQuery的核心函数和事件处理
Feb 18 jQuery
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中文字母数字验证码实现代码
2008/04/25 PHP
PHP 作用域解析运算符(::)
2010/07/27 PHP
php出现内存位置访问无效错误问题解决方法
2014/08/16 PHP
简单概括PHP的字符串中单引号与双引号的区别
2016/05/07 PHP
js获取变量
2006/08/24 Javascript
JavaScript QueryString解析类代码
2010/01/17 Javascript
javascript中的onkeyup和onkeydown区别介绍
2013/04/28 Javascript
js截取小数点后几位的写法
2013/11/14 Javascript
Jquery创建一个层当鼠标移动到层上面不消失效果
2013/12/12 Javascript
js数值和和字符串进行转换时可以对不同进制进行操作
2014/03/05 Javascript
什么是MEAN?JavaScript编程中的MEAN是什么意思?
2014/12/18 Javascript
Jquery 实现checkbox全选方法
2015/01/28 Javascript
JavaScript实现当网页加载完成后执行指定函数的方法
2015/03/21 Javascript
jquery实现Slide Out Navigation滑出式菜单效果代码
2015/09/07 Javascript
Javascript函数式编程语言
2015/10/11 Javascript
详解BootStrap中Affix控件的使用及保持布局的美观的方法
2016/07/08 Javascript
简单的JS轮播图代码
2016/07/18 Javascript
jQuery Ajax 实现在html页面实时显示用户登录状态
2016/12/30 Javascript
JS简单实现点击按钮或文字显示遮罩层的方法
2017/04/27 Javascript
VUE axios发送跨域请求需要注意的问题
2017/07/06 Javascript
jquery获取input输入框中的值
2019/11/13 jQuery
浅谈Python中chr、unichr、ord字符函数之间的对比
2016/06/16 Python
用Python设计一个经典小游戏
2017/05/15 Python
python3+PyQt5重新实现自定义数据拖放处理
2018/04/19 Python
Python调用百度根据经纬度查询地址的示例代码
2019/07/07 Python
Python Django中的STATIC_URL 设置和使用方式
2020/03/27 Python
如何使用pycharm连接Databricks的步骤详解
2020/09/23 Python
CSS3教程(7):CSS3嵌入字体
2009/04/02 HTML / CSS
socket.io 和canvas 实现的共享画板功能
2019/05/22 HTML / CSS
世界上最大的网络主机公司:1&1
2016/10/12 全球购物
什么是跨站脚本攻击
2014/12/11 面试题
数据库测试通常都包括哪些方面
2015/11/30 面试题
试用期转正员工自我评价
2014/09/18 职场文书
幼儿教师自我剖析材料
2014/09/29 职场文书
挂职锻炼个人总结
2015/03/05 职场文书
nginx中proxy_pass各种用法详解
2021/11/07 Servers