JavaScriptでページング機能を実現したい

前提・実現したいこと

JQueryなどライブラリを使わず、ページング機能を実現させたいです。

解決したい課題「サーブレットから得られるリストをJavaScriptに渡したい」

以下の記事がとても参考になっており、このソースコードをもとにJavaScriptを書きたいと思っていますが、
１つ問題点となるのが連想配列のリストが動的でないということです。
https://qiita.com/ayaka105/items/c950bf8025bae699cffe

window.onload で引数を渡せれば問題ないですが、それはできないと察しております。
画面表示時にサーブレットから取得したデータをjavascriptのリスト「menu」に設定するためにはどうすれば良いでしょうか。
または、これに匹敵するような処理が実現できれば問題ないです。

JavaScript
1
2// リスト表示用（今回name_jpしか使ってません...）
3const menu = [
4    {"id": 1, "name_jp": "コーヒー", "name_en": "coffee"},
5    {"id": 2, "name_jp": "エスプレッソ", "name_en": "espresso"},
6    --- (省略) ---
7    {"id": 16, "name_jp": "パフェ", "name_en": "pudding"}
8]
9
10// ページング機能
11const pagination = () => {
12    // 初期値設定
13    let page = 1; // 現在のページ（何ページ目か）
14    const step = 5; // ステップ数（1ページに表示する項目数）
15   　・
16   　・
17   　・

備考

・eclipseでWEBアプリを実装
・JavaEE(Java11)
・Tomcat9.0

yambejp

2021/10/19 01:01

サーバーサイドのAPIが用意されていてSPAで処理したいのでしょうか？

K.KATSU2

2021/10/19 01:58

コメントありがとうございます。単純にDAOから取れるデータ（例えばアカウント情報など）を一覧表示するにあたり、件数が多い場合何ページかに分けて表示したいので、そのページング機能を実装するというものになります。これにあたり、現在特にこれといったフレームワークを使用せず（ライブラリは順次導入）プログラムを組んでいるのですが、質問内容に記載のURLがちょうど自分に合っているなと思ったところでした。ですが、この記事だとあらかじめリストがconstで用意されております。なので、単にjspでWEBページが作られる際にDAOからとってきたデータをリストとして初期化したいだけなのですが、勉強不足というのもあり実現方法が分からないでいます。