javascript建立一个基于数组的栈结构

时间 2019-11-09

标签 javascript 建立一个基于数组结构栏目 JavaScript 繁體版

原文原文链接

　　栈是一种听从后进先出（LIFO）原则的有序集合。新添加或待删除的元素都保存在栈的同一端，称做栈顶，另外一端就叫栈底。在栈里，新元素都靠近栈顶，旧元素都接近栈底。 javascript

栈拥有如下方法：html

push(element): 元素入栈，添加一个或多个新元素到栈顶java

pop(): 元素出栈，移除栈顶的元素，同时返回被移除的元素数组

peek(): 返回栈顶的元素，不对站内元素作任何修改函数

isEmpty(): 判断栈是否为空，若是栈内没有任何元素就返回true，不然返回false测试

clear(): 移除栈内的全部元素ui

size(): 返回栈里的元素个数，该方法和数组的length属性相似this

说明：spa

　　数组的头部就是栈底，数组的尾部就是栈顶3d

由于是基于javascript的数组构建的栈，因此会用到各类数组方法，首先建立一个类表示类，这里用到了ES6的语法，接下来便开始逐个实现栈中的6个常规方法。

s1.声明栈构造函数

1 //在栈的构造函数中声明一个空数组用来保存栈内的元素
2 class Stack {
3     constructor() {
4         this.items = [];    
5     }
6 }

s2.实现push()方法，元素入栈

使用数组的push方法，将元素放入数组的末尾，也就是栈结构中的栈顶。

push(element){
　　this.items.push(element);
}

s3.实现pop()方法，元素出栈,并返回该元素

根据先进后出的原则，移除的元素是最后添加进栈的元素，这里使用数组的pop方法

pop() {
　　return this.items.pop();
}

s4.实现peek()方法，查看栈顶元素，也就是最后添加进栈的元素

在数组中表现为数组最后一个索引位置的元素，访问数组的最后一个元素能够用 length -1

peek() {
    return this.items[this.items.length - 1];
}

s5.实现isEmpty()方法，查看栈是否为空

其实就是判断数组的长度是否为0

isEmpty() {
　　return this.items.length === 0;
}

s6.实现clear()方法，清空栈内全部元素

直接将数组重置为空便可

clear() {
　　return this.items = [];
}

s7.实现size()方法，返回栈的长度

在数组中的表现就是返回数组的length

size() {
　　return this.items.length;
}

　　至此，基于数组搭建的栈就完成了，接下来就开始测试一下！下面的代码直接复制就能够用了。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>
  
  </title>
</head>
<body>
	<h1>测试 栈</h1>
	<script>
		//在栈的构造函数中声明一个空数组用来保存栈内的元素
class Stack {
	constructor() {
		this.items = [];	
	}
	
	push(element){
		this.items.push(element);
	}

	pop() {
		return this.items.pop();
	}

	peek() {
		return this.items[this.items.length - 1];
	}

	isEmpty() {
		return this.items.length === 0;
	}

	clear() {
		return this.items = [];
	}

	size() {
		return this.items.length;
	}
}
	//首先实例化一个栈对象
	const stack = new Stack();

	stack.push(12);		//进栈
	stack.push(20);
	console.log(stack.isEmpty());	//输出false
	console.log(stack.pop());	//输出20，这里移除了栈顶元素20，并返回了
	console.log(stack.peek());	//输出12，这是返回元素，12依然保存在栈中

	console.log(stack.size());	//输出1

	stack.clear();	//清栈，此时栈空了
	console.log(stack.isEmpty());	//输出true
</script>
</body>
</html>

后面会再写一篇基于JavaScript对象搭建的栈结构实现。纯手打不易，转载请注明出处！

<html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title> </title></head><body><h1>测试栈</h1><script>//在栈的构造函数中声明一个空数组用来保存栈内的元素class Stack {constructor() {this.items = [];}push(element){this.items.push(element);}pop() {return this.items.pop();}peek() {return this.items[this.items.length - 1];}isEmpty() {return this.items.length === 0;}clear() {return this.items = [];}size() {return this.items.length;}}//首先实例化一个栈对象const stack = new Stack();stack.push(12);//进栈stack.push(20);console.log(stack.isEmpty());//输出falseconsole.log(stack.pop());//输出20，这里移除了栈顶元素20，并返回了console.log(stack.peek());//输出12，这是返回元素，12依然保存在栈中console.log(stack.size());//输出1stack.clear();//清栈，此时栈空了console.log(stack.isEmpty());//输出true</script></body></html>