前端不需要掌握队列和栈(一)

简介: 前端不需要掌握队列和栈

概述

答案肯定是需要的。

0246daf7fa5334d844581ddb55ab017.png

首先js 中没有队列 和栈的概念。

我相信大部分前端人对这两个数据结构的概念仅仅存在,在大学学习数据机构时,课堂上老师讲的队列和栈的结构,用c语言实现的版本。

我们先来重温一下大学课堂

队列:先入先出,后入后出。


栈:先入后出,后入先出。

理解

其实也没啥好理解的,字面意思很清晰了。

今天我去做核酸,排了很长的队伍。

队列就可以想象是我们做核酸排队,只能一个一个往队伍后面排队,从前到后一个一个做核酸,来得早,早做核酸,早点离开,来得晚,晚做核酸,晚点离开。

北京的冬天除了冷还是冷。

栈就可以想象成我们冬天穿衣服和脱衣服。 先穿一件保暖内衣,再套一件卫衣,再套一件羽绒服。脱衣服时,不可能先直接脱掉内衣,需要从外到内一件一件脱掉,先脱羽绒服,再脱卫衣,最后是内衣。

最先穿的是内衣,最后脱的是内衣,这就先入后出,最后穿的是羽绒服,最先脱的是羽绒服,这就是后入先出。


1686888667411.jpg


实现

js没有这个数据结构,也不要问我,怎么用c语言实现,不好意思,现在的我全忘光了。

虽然没有这个数据结构,但是我们每个前端开发肯定用过,只是没注意到罢了。

js中对数组的封装已经非常完美了,以下四个方法,各位小可爱们肯定是用过

Array.prototype.push()
Array.prototype.pop()
Array.prototype.shift()
Array.prototype.unshfit()

每个API是什么意思,不解释,只要使用过,那就肯定能实现队列和栈的数据结构。

既然队列只能头部出,尾部插入

那就是数组的shift() push()

既然栈只能 尾部插入,尾部出

那就是数组的 push() pop()

一次面试的经历

我相信数组的这四个方法,各位大帅比都会了,我们有封装更好的数组结构,还掌握队列和数组结构干什么,

但是,作为一个前端工程师,一个工程师最重要的就是数据结构,栈和队列是数据结构的基础中的基础。

这不,字节的面试官,在3月份的一个晚上,就问我,用队列实现一个栈结构。

面试官:你自己想一下栈的结构和特点,想一下栈应该具备什么方法,想一下怎么实现。

:前端都用数组了,很少用这个结构,我有点懵逼。

面试官:对,知道前端用数组用得多,但是大学肯定学过嘛,你想一下用数组的什么方法来实现这个栈。

:呃呃呃,我想一哈

......后面事情就不说了

通过这个事情,我总结出两点

  • 字节的面试算法咩有想象得那么难
  • 前提是你至少得刷一些简单的中等难度的算法题,不然可能题都读不懂

1686888725411.jpg

刷题

所以下面我们来点真实的,一起看两道算法题,不想看的,您可以点在赞,关闭页面了,因为算法题甚是索然无味。

题目就是这两道:

225.用队列实现栈

232.用栈实现队列

怕你么有思路,我把题目改改。1686888744009.jpg

用双队列实现栈

描述

实现 MyStack 类:

void push(int x) 将元素 x 压入栈顶。

int pop() 移除并返回栈顶元素。

int top() 返回栈顶元素。

boolean empty() 如果栈是空的,返回 true ;否则,返回 false 。

思路

用数组的 shift() push() 表示队列来实现栈的 push() pop() shift() empty()

答案就在题目中

双队列,两个队列来存储栈,主队列queue1 来表示 主队列,queue2 表示 辅助队列

当入栈操作时,先把入栈元素放入辅助队列,我们先将主队列内容导入辅助队列。此时主队列空,交换辅助队列和主队列

this.queue2.push(x)
while(this.queue1.length){
  this.queue2.push(this.queue1.shift())
}
[this.queue1,this.queue2] = [this.queue2,this.ueue1]

pop 需要删除队列最后一个元素,执行queue1.shift()方法

top 返回栈顶元素,返回第0个元素即可

代码实现

var MyStack = function() {
  this.queue1() = []
  this.queue2() = []
}  
MyStack.prototype.push = function(x) {
  this.queue2.push(x)
  while (this.queue1.length) this.queue2.push(this.queue1.shift());
  [queue1,queue2] = [queue2,queue1]
}  
MyStack.prototype.pop = function() {
  return this.queue1.shift();
} 
MyStack.prototype.top = function() {
  return this.queue1[0];
} 
MyStack.prototype.empty = function() {
   return !this.queue1.length;
} 



相关文章
|
13天前
|
存储 前端开发 JavaScript
【Web 前端】JS中的栈和堆是什么?优缺点?
【4月更文挑战第22天】【Web 前端】JS中的栈和堆是什么?优缺点?
|
9月前
|
前端开发
数据结构与前端(一)——栈
数据结构与前端(一)——栈
49 0
|
10月前
|
存储 JavaScript 前端开发
前端 js 栈内存和堆内存 基本数据类型和复杂数据类型的区别?
前端 js 栈内存和堆内存 基本数据类型和复杂数据类型的区别?
72 0
|
11月前
|
存储 前端开发
前端不需要掌握队列和栈(二)
前端不需要掌握队列和栈
64 0
|
11月前
|
算法 前端开发
前端算法-设计最小栈
前端算法-设计最小栈
|
前端开发
前端学习案例1-栈
前端学习案例1-栈
36 0
前端学习案例1-栈
|
前端开发
前端学习案例2-栈
前端学习案例2-栈
32 0
前端学习案例2-栈
|
前端开发
前端知识案例45-javascript基础语法-栈模式
前端知识案例45-javascript基础语法-栈模式
28 0
前端知识案例45-javascript基础语法-栈模式
|
前端开发
前端知识案例-栈的定义
前端知识案例-栈的定义
51 0
前端知识案例-栈的定义
|
算法 前端开发 测试技术
【前端算法】两个栈实现一个队列
介绍栈和队列的区别,以及如何使用栈实现一个队列
117 0