>웹 프론트엔드 >JS 튜토리얼 >JS 스택 DS&A 소개

JS 스택 DS&A 소개

WBOY
WBOY원래의
2024-08-16 06:03:071012검색

최신 장치를 사용한다면 깨닫지 못하더라도 스택 작업을 접했을 가능성이 높습니다. 스택은 함수 호출 관리부터 실행 취소 작업 활성화에 이르기까지 많은 프로그래밍 작업의 기본입니다.

스택이란 무엇입니까?

스택은 LIFO 또는 FILO 구조로 데이터를 구성하는 작업 순서를 따르는 선형 데이터 구조입니다.

LIFO: 후입선출.

FILO: 선입선출.

스택은 요소 추가 및 제거, 최상위 요소 표시, 컬렉션이 비어 있는지 또는 꽉 찼는지 표시 등 요소 컬렉션에 대한 작업을 수행하는 데 사용됩니다.

예:

현재 웹 브라우저에서 www.ESPN.com을 방문하고 있는데 실수로 시카고 화이트삭스 야구 티켓 광고를 클릭한 경우입니다. 의도한 것은 아니지만 스택에 추가했지만 이제 스택의 맨 위에 있습니다. 그러다가 시카고 화이트삭스가 15연패를 당했다는 사실을 알게 됩니다. 음... 뒤로 버튼을 눌러 보겠습니다(스택 상단에서 해당 요소 제거).

JS stacks DS&A intro

네, 바로 저기에 있는 거요. 이는 스택 작업의 LIFO 원칙을 보여줍니다. 기록(또는 스택)에서 마지막으로 방문한 페이지를 떠나(제거) www.ESPN.com으로 돌아갑니다. 아마도 내년에는 White Sox로 돌아갈 것입니다.

스택 작업은 주문 웹 브라우저 기록을 유지해야 하는 애플리케이션, 텍스트 편집기에서 실행 취소 및 다시 실행, 함수 호출 스택 등을 관리하는 데 자주 사용됩니다.

스택을 변경할 때 일반적으로 사용되는 기능은 다음과 같습니다.

.Push =를 누르면 스택에 요소가 추가됩니다.

.pop = 스택에서 최상위 요소를 제거합니다.

.peek = 스택의 최상위 요소를 표시합니다.

.length/.size = 스택의 총 인덱스를 결정합니다. 자바스크립트는 (.length)

를 사용합니다.

.isEmpty = 스택이 비어 있는지 확인합니다.

.isFull = 스택이 가득 찼는지 확인합니다. 배열의 크기가 고정된 경우.

스택 클래스 또는 일반 배열을 사용하여 스택 데이터 구조를 생성할 수 있습니다.

클래스 없이 스택 구현:

스택 클래스 없이 스택 작업을 수행할 때 배열을 사용하여 스택 작업을 시뮬레이션합니다.

다음은 스택 연산을 사용하여 숫자 배열을 뒤집는 예입니다. JSON.stringify를 사용하여 배열 결과 값을 원하는 배열 결과와 비교하겠습니다.

예:

// Reverse an array using stack operations

let number = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]; // original array
let numberList = [9, 8, 7, 6, 5, 4, 3, 2, 1, 0]; // reversed array
let ordernumberList = []; // array to store the reversed order

// Loop through the numberList array to reverse its order
for (var i = 0; i < number.length; i++) {
  let currentValue = numberList.pop(); // using the key .pop method to remove the last element from numberList
  ordernumberList.push(currentValue); // using the key .push method to push the popped element into ordernumberList
}

console.log(ordernumberList + " vs " + number); // compare the arrays

// Convert both arrays into JSON strings for comparison
if (JSON.stringify(ordernumberList) === JSON.stringify(number)) {
  console.log("The number list is reversed: " + ordernumberList);
  return ordernumberList;
} else {
  console.log("The number list is not reversed: " + ordernumberList);
}

맨 마지막에 if-else 문을 강조하고 싶습니다. JSON.stringify 메서드를 사용하여 두 배열을 비교했습니다. 이 메서드가 없으면 배열의 내용이 동일하더라도 비교 결과 false가 반환되어 else 조건이 트리거되기 때문입니다. 이는 JavaScript에서 배열을 비교할 때 배열 내부의 실제 내용이 아닌 참조(즉, 메모리 위치)를 확인하기 때문에 발생합니다.

for 루프 전체에서 볼 수 있듯이, 우리의 메소드 .pop은 numberList 배열의 마지막 인덱스부터(LIFO) 먼저 제거합니다. 그런 다음 .push 메소드를 사용하여 이를 새 배열 ordernumberList에 추가하고 원래 배열을 반대로 합니다.

스택 작업으로 수정된 경우 ordernumberList 배열에 푸시된 첫 번째 인덱스가 마지막 인덱스(FILO)가 되기 때문에 FILO는 공식화된 새 배열에 들어옵니다.

이 기사에서는 LIFO 및 FILO 원칙을 사용하여 스택이 작동하는 방식을 살펴보고 JavaScript로 스택 작업을 구현했습니다. 웹 탐색과 같은 실제 시나리오에서 볼 수 있듯이 스택을 이해하는 것은 많은 프로그래밍 작업에 필수적입니다.

위 내용은 JS 스택 DS&A 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.