如何以有角度的方式实施队列？

Question

图片描述：

单击图标将在图标任务完成后执行其操作，该图标应终止。但是某些图标可以与其他图标结合使用。

问题：

我有30多种选择可以使用。我想追踪所有物品。每当单击一个项目时，都应将其插入。再次单击时，应将其删除。如果某个项目已经处于活动状态，并且再次单击该项目，则应将其删除。一些选项就像它们可以与其他选项组合一起使用。

我到目前为止所做的：

我为此实现了两种方法，执行和终止以插入和删除最后单击的项目。如果我采用相同的过程，那么将会有很多其他我不想实现的东西。我想实现一个队列，这将有助于我跟踪用户选择的所有选项。

如何在角度5 或更高版本中实施队列？如果还有其他更好的方法可以解决，请提出建议。

任何帮助将不胜感激。

Answer 1

这里是TypeScript中队列的快速实现。您可以对其进行修改以在Javascript中使用。

class Node<T> {
  next: Node<T>;
  constructor(public data: T) {
  }
}

export class Queue<T> {
  head: Node<T>;
  tail: Node<T>;

  constructor() {
    this.head = this.tail = null;
  }

  enqueue(data: T): void {
    const node = new Node(data);

    if (this.isEmpty()) {
      this.head = this.tail = node;
      return;
    }

    this.tail.next = node;
    this.tail = node;
  }

  dequeue(): T {
    if (this.isEmpty()) {
      return null;
    }

    const data = this.head.data;

    if (this.tail === this.head) {
      this.head = this.tail = null;
    } else {
      this.head =  this.head.next;
    }

    return data;
  }

  isEmpty() {
    return this.head === null;
  }
}

Answer 2

我找到了解决方案。请尝试

创建课程

 export class Queue<T> {
  _store: T[] = [];
  public push(val: T) {
    this._store.push(val);
  }
  public pop(): T | undefined {
    return this._store.shift();
  }
}

您可以将任何类型传递给该类的T参数。这是一个类约束

这是我的演示类，用于作为参数传递给队列

export class Demo{

    public val1:number;
    public val2:string;

}

使用方法

    let Qu:Queue<Demo>  = new Queue<Demo>();
    Qu.push({val1:1, val2:"Asanga1"});
    Qu.push({val1:2, val2:"Asanga2"});

    console.log(Qu.pop());

这是控制台中的输出

>Object {val1: 1, val2: "Asanga1"}

所以它拉出了队列中的第一个

请尝试。

Answer 3

JavaScript ES6使用Array对象提供了开箱即用的队列和堆栈数据结构的实现。

请参阅这篇文章。

https://dev.to/dilantha111/stacks-and-queues-in-js-with-es6-classes-and-array-20kh

要获得Angular类型的好处，请使用Array<T>界面。

Answer 4

在JavaScript中排队：

// initialization
const queue = []
// insertion
queue.unshift(/* element here */)
// removing
const removedElement = queue.shift()
// first element
const firstElement = queue[0]
// last element
const lastElement = queue[queue.length - 1]