何故配列リテラルを使用しているのか意味がいまいち分からないので解決したい

解決したいこと

何でclassList.removeで配列リテラルを使用しているのかが分からないので意味がわかるよう解決したい
##分からないこと
classList.removeの部分で、どうしてわざわざ配列リテラルを使用しているのかがわかりません。
この部分は配列リテラルを使用せずとも、クラス名は削除できるので意味がないように思うのですが、どのような意味があるのでしょうか？？
該当コード
JavaScriptの行番号0~4です

javascript
1import data from "./data.js";
2const container = document.querySelector(".slide-container");
3const nextBtn = document.querySelector(".next-btn");
4const prevBtn = document.querySelector(".prev-btn");
5// console.log(data.length)
6// if length is 1 hide buttons
7if (data.length === 1) {
8  nextBtn.style.display = "none";
9  prevBtn.style.display = "none";
10}
11// if length is 2, add copies of slides
12let people = [...data];
13if (data.length === 2) {
14  people = [...data, ...data];
15}
16container.innerHTML = people
17  .map((person, slideIndex) => {
18    const { img, name, job, text } = person;
19    // console.log(slideIndex)
20    // console.log(people.length)
21    let position = "next";
22    if (slideIndex === 0) {
23      position = "active";
24    }
25    if (slideIndex === people.length - 1) {
26      position = "last";
27    }
28    if (data.length <= 1) {
29      position = "active";
30    }
31    return `<article class="slide ${position}">
32  <img src=${img} class="img" alt="${name}"/>
33  <h4>${name}</h4>
34  <p class="title">${job}</p>
35  <p class="text">
36   ${text}
37  </p>
38<div class="quote-icon">
39<i class="fas fa-quote-right"></i>
40</div>
41 </article>`;
42  })
43  .join("");
44  // console.log(container)
45
46const startSlider = (type) => {
47  // get all three slides active,last next
48  const active = document.querySelector(".active");
49  const last = document.querySelector(".last");
50  let next = active.nextElementSibling;
51  // console.log(next);
52  if (!next) {
53    next = container.firstElementChild;
54  }
55// console.log(next)
560.   active.classList.remove(["active"]); 
571.   last.classList.remove(["last"]);
582.   next.classList.remove(["next"]);
59
60  if (type === "prev") {
61    active.classList.add("next");
62    last.classList.add("active");
63    next = last.previousElementSibling;
64    if (!next) {
65      next = container.lastElementChild;
66    }
674.     next.classList.remove(["next"]);
68    next.classList.add("last");
69    return;
70  }
71  active.classList.add("last");
72  last.classList.add("next");
73  next.classList.add("active");
74};
75nextBtn.addEventListener("click", () => {
76  startSlider();
77});
78prevBtn.addEventListener("click", () => {
79  startSlider("prev");
80});
81

HTML
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4  <meta charset="UTF-8">
5  <meta http-equiv="X-UA-Compatible" content="IE=edge">
6  <meta name="viewport" content="width=device-width, initial-scale=1.0">
7  <title>ES6-slider</title>
8  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css">
9  <link rel="stylesheet" href="style.css">
10</head>
11<body>
12  <section class="slider">
13    <div class="reviews">
14      <h2><span>/</span>reviews</h2>
15    </div>
16    <div class="slide-container">
17      <!-- <article class="slide">
18        <img
19          src="https://res.cloudinary.com/diqqf3eq2/image/upload/c_scale,w_200/v1595959121/person-1_aufeoq.jpg"
20          class="img"
21          alt="peter doe"
22        />
23        <h4>peter doe</h4>
24        <p class="title">product designer</p>
25        <p class="text">
26          Lorem ipsum dolor sit amet consectetur adipisicing elit. Quidem quo
27          eius recusandae officia voluptas sint deserunt dicta nihil nam
28          omnis?
29        </p>
30        <div class="quote-icon">
31          <i class="fas fa-quote-right"></i>
32        </div>
33      </article> -->
34    </div>
35    <!-- buttons -->
36    <!-- prev btn -->
37    <button class="btn prev-btn">
38      <i class="fas fa-chevron-left"></i>
39    </button>
40    <!-- next button -->
41    <button class="btn next-btn">
42      <i class="fas fa-chevron-right"></i>
43    </button>
44  </section>
45<script type="module" src="app.js"></script>
46</body>
47</html>
48

CSS
1/*
2===============
3Fonts
4===============
5*/
6@import url("https://fonts.googleapis.com/css?family=Open+Sans|Roboto:400,700&display=swap");
7
8/*
9===============
10Variables
11===============
12*/
13
14:root {
15  /* dark shades of primary color*/
16  --clr-primary-1: hsl(205, 86%, 17%);
17  --clr-primary-2: hsl(205, 77%, 27%);
18  --clr-primary-3: hsl(205, 72%, 37%);
19  --clr-primary-4: hsl(205, 63%, 48%);
20  /* primary/main color */
21  --clr-primary-5: hsl(205, 78%, 60%);
22  /* lighter shades of primary color */
23  --clr-primary-6: hsl(205, 89%, 70%);
24  --clr-primary-7: hsl(205, 90%, 76%);
25  --clr-primary-8: hsl(205, 86%, 81%);
26  --clr-primary-9: hsl(205, 90%, 88%);
27  --clr-primary-10: hsl(205, 100%, 96%);
28  /* darkest grey - used for headings */
29  --clr-grey-1: hsl(209, 61%, 16%);
30  --clr-grey-2: hsl(211, 39%, 23%);
31  --clr-grey-3: hsl(209, 34%, 30%);
32  --clr-grey-4: hsl(209, 28%, 39%);
33  /* grey used for paragraphs */
34  --clr-grey-5: hsl(210, 22%, 49%);
35  --clr-grey-6: hsl(209, 23%, 60%);
36  --clr-grey-7: hsl(211, 27%, 70%);
37  --clr-grey-8: hsl(210, 31%, 80%);
38  --clr-grey-9: hsl(212, 33%, 89%);
39  --clr-grey-10: hsl(210, 36%, 96%);
40  --clr-white: #fff;
41  --clr-red-dark: hsl(360, 67%, 44%);
42  --clr-red-light: hsl(360, 71%, 66%);
43  --clr-green-dark: hsl(125, 67%, 44%);
44  --clr-green-light: hsl(125, 71%, 66%);
45  --clr-black: #222;
46  --ff-primary: "Roboto", sans-serif;
47  --ff-secondary: "Open Sans", sans-serif;
48  --transition: all 0.3s linear;
49  --spacing: 0.1rem;
50  --radius: 0.25rem;
51  --light-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
52  --dark-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
53  --max-width: 1170px;
54  --fixed-width: 620px;
55}
56
57/*
58===============
59Slider Styles
60===============
61*/
62section {
63  width: 85vw;
64  max-width: var(--fixed-width);
65  margin: 0 auto;
66  margin-top: 5rem;
67  text-align: center;
68  padding: 1rem 0;
69  /* set relative for buttons */
70  position: relative;
71}
72.reviews {
73  margin-bottom: 4rem;
74}
75.reviews h2 {
76  display: flex;
77  align-items: center;
78  justify-content: center;
79}
80.reviews span {
81  font-size: 0.85em;
82  color: var(--clr-primary-5);
83  margin-right: 1rem;
84}
85.img {
86  width: 150px;
87  height: 150px;
88  object-fit: cover;
89  border: 1px solid var(--clr-grey-7);
90  background: var(--clr-white);
91  padding: 0.25rem;
92  border-radius: 50%;
93  box-shadow: var(--dark-shadow);
94}
95h4 {
96  text-transform: uppercase;
97  font-weight: 500;
98  color: var(--clr-primary-5);
99  letter-spacing: var(--spacing);
100  margin: 0.5rem 0;
101}
102.title {
103  margin-bottom: 1.25rem;
104  letter-spacing: 2px;
105  text-transform: capitalize;
106}
107.text {
108  color: var(--clr-grey-5);
109  line-height: 1.8;
110  max-width: 35em;
111  margin: 0 auto;
112  letter-spacing: 1px;
113}
114
115.icon:hover {
116  transform: scale(1.1);
117  opacity: 0.8;
118}
119.quote-icon {
120  font-size: 3rem;
121  margin-top: 2rem;
122  color: var(--clr-primary-5);
123}
124/* set buttons */
125.btn {
126  position: absolute;
127  top: 175px;
128  background: var(--clr-grey-5);
129  color: var(--clr-white);
130  padding: 0.25rem 0.35rem;
131  border-radius: 0.25rem;
132  border: transparent;
133  cursor: pointer;
134}
135.next-btn {
136  right: -0.5rem;
137}
138.prev-btn {
139  left: -0.5rem;
140}
141@media screen and (min-width: 768px) {
142  .next-btn {
143    right: -5rem;
144  }
145  .prev-btn {
146    left: -5rem;
147  }
148  .btn {
149    font-size: 1.3rem;
150    padding: 0.35rem 0.5rem;
151  }
152  .quote-icon {
153    font-size: 4rem;
154  }
155}
156
157/* MORE CSS FOR JS */
158
159.slide-container {
160  display: flex;
161  position: relative;
162  height: 450px;
163  /* overflow: hidden; */
164}
165
166.slide {
167  position: absolute;
168  top: 0;
169  left: 0;
170  width: 100%;
171  height: 100%;
172  transition: all 0.3s ease-in-out;
173  opacity: 0;
174}
175.slide.active {
176  opacity: 1;
177  transform: translateX();
178}
179.slide.next {
180  transform: translateX(100%);
181}
182.slide.last {
183  transform: translateX(-100%);
184}
185