next.jsで破壊的メソッドを使わずにデータ操作したい

実現したいこと

next.jsで破壊的メソッドを使わずにデータ操作したい

前提

とあるカスタムフックス内部で以下の様なコードを作成しました。
classObjectのデータを使って
[{"class":"A","name":"田中"},{ class: "B", name: "佐藤" }],{ class: "C", name: "中島" },{ class: "C", name: "菊池" }]というデータを作成しています。

next.js

1export const useTekito =()=>{ 2 const classObject = { 3 "A":["田中"], 4 "B":["佐藤"], 5 "C":["中島","菊池"] 6 } 7 // { class: "A", name: "田中" } 8 let student = [] 9 for (const [key, values] of Object.entries(classObject)) { 10 for(const value of values){ 11 student.push({ "class": key, "name": value }) 12 } 13 } 14 console.log(student) 15 } 16

発生している問題・エラーメッセージ

一応これでもうまく動いているのですがJavaScriptではpushなどの破壊的メソッドの使用を推奨していないとの記述を見つけました。
この動きをスプレッド構文など、破壊的メソッド以外で再現できますでしょうか？
しばらく考えたのですが、知識が乏しく思いつかなかったので知恵をお借りしたいです。