Javascript 前端分頁——根據頁面大小(pageSize)和總行數(total)計算總頁面數(totalPage)

分頁時,根據頁面大小(pageSize)和總行數(total),計算總頁面數(totalPage)

一:總行數取余頁面大小,等于0,則頁數為整頁數,否則有余數,則頁數為正頁數加一

 // 總行數取余頁面大小,等于0,則頁數為整頁數,否則有余數,則頁數為正頁數加一const totalPage = (total % pageSize == 0) ? (total / pageSize) : (total / pageSize + 1)

二:總頁數=(總數-1)/每頁數量+1

// 總頁數 =(總數 - 1)/ 每頁數量 + 1
const totalPage = (total - 1) / pageSize + 1

三:總頁數=(總數 + 每頁數量 - 1)/ 每頁數量?

// ?總頁數=(總數+每頁數量-1)/每頁數量
const totalPage = (total + pageSize - 1) / pageSize

簡述一下第三個是如何證明的:

1. 特殊情況total = 0時,為0頁
2. total大于等于一頁時:
????????2.1 整除的情況下:total / pageSize 滿足
????????2.2 有余數的情況下,就多加一頁: total / pageSize + 1 等價于 (total + pageSize) / pageSize
3. total小于頁面大小時,為1頁
????????3.1 當total = 1時,total需要再加上整數x,才夠一頁,即(total + x) / pageSize,x ∈ [pageSize - 1, 2(pageSize - 1)]
????????3.2 當total = pageSize - 1時,total需要再加上整數x,才夠一頁,即(total + x) / pageSize,x ∈ [1, pageSize]
為了滿足情況3.1、3.2,二者取交集,所以total需要加上整數 x ∈ [pageSize - 1, pageSize]
如果x取pageSize,會影響情況2.1造成頁數多一頁,不會影響情況2.2,故舍去
又因為pageSize - 1為 total 除以 pageSize 的最大余數,對total大于等于一頁的兩種情況均不影響,所以x應取pageSize - 1


所以綜上所述:總頁數totalPage = (total + pageSize - 1) / pageSize,代入total=0時,為0頁,滿足,證明完畢!

total / pageSize + 1等價于(total + pageSize) / pageSize: 取整(/ 二元操作符)是一個整體和另一個整體進行運算,不可化簡,此處等價于有前提條件。
(total + pageSize - 1) / pageSize 不可化簡成 (total - 1) / pageSize + 1,因為此處是取整,不是除法。

四:使用Math.ceil()函數,進1法取整。Math.ceil(total / pageSize)

// 使用Math.ceil()函數,進1法取整
const totalPage = Math.ceil(total / pageSize)
Math.Ceiling(0.0) //0
Math.Ceiling(0.1) //1
Math.Ceiling(0.5) //1
Math.Ceiling(0.6) //1
Math.Ceiling(0.7) //1
Math.Ceiling(1.01) //2

引用:

【數據結構與算法】分頁時,根據頁面大小和總行數,計算總頁面數(含推理過程)_分頁查詢計算總頁數_debug4flaw的博客-CSDN博客

分頁計算總頁數算法:總頁數=(總數-1)/每頁數量+1----總頁數=(總數+每頁數量-1)/每頁數量_總頁數怎么算-CSDN博客

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/207976.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/207976.shtml
英文地址,請注明出處:http://en.pswp.cn/news/207976.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

解讀鏈上經濟“一等公民”:加密AI代理的優勢和前沿應用

機器人正在成為加密經濟的“一等公民”,最近的案例就能印證這一趨勢。 搜索者(Searchers)部署像Jaredfromsubway.eth這樣的機器人,利用真人用戶對便利的渴望在DEX搶先交易。Banana Gun和Maestro允許真人用戶通過Telegram的便利進…

力扣每日一題day31[101. 對稱二叉樹]

給你一個二叉樹的根節點 root , 檢查它是否軸對稱。 示例 1: 輸入:root [1,2,2,3,4,4,3] 輸出:true示例 2: 輸入:root [1,2,2,null,3,null,3] 輸出:fals 思路 對于二叉樹是否對稱&#xff…

二分查找算法

文章目錄 二分查找二分的實戰講解二分查找普通二分模版 在排序數組中查找元素的第一個和最后一個位置萬能二分模版 總結 二分查找 什么是二分查找:就是定義左右2個指針(此指針非真指針)取中間值 通過一次次取中間值找到要找到的數 二分的實戰講解 二分查找 題目:地址 題目解析…

ELK技術棧介紹及簡單使用實例

1. ELK技術棧介紹 引言 在當今數據驅動的世界里,有效地管理和分析大量日志數據變得至關重要。這里我們將深入探討ELK技術棧,這是一種流行的日志管理解決方案,它結合了三個開源項目:Elasticsearch、Logstash和Kibana。ELK技術棧因…

測試文檔---智力沖刺

文章目錄 項目背景測試計劃UI測試接口測試手工測試 測試總結 項目背景 項目描述:“智力沖刺”是一款網頁小游戲,就像我們平時看到的網頁游戲一樣,前端頁面負責展示游戲效果,后端服務器來實現游戲的邏輯。在我們的“智力沖刺”游戲…

YOLOv7 學習筆記

文章目錄 前言一、YOLOv7貢獻和改進二、YOLOv7核心概念三、YOLOv7架構改進總結 前言 在深度學習和計算機視覺領域,目標檢測一直是一個極具挑戰性和實用性的研究領域。特別是在實時目標檢測方面,準確率和速度之間的平衡成為了關鍵考量因素。YOLO&#xf…

C語言精選——選擇題Day40

第一題 1. int a[10] {2,3,5}, 請問a[3]及a[3]之后的數值是() A:不確定的數據 B:5 C:0 D:0xf f f f f f f f 答案及解析 C 數組的不完全初始化,會自動把沒初始化的部分初始化為0; 第…

postman做接口自動化測試

接口是用來連接服務端和客戶端,一般返回的數據都是json。 get和post請求的區別: 1. get請求比post請求安全 2. get請求參數有長度限制,post請求沒有 3. get請求沒有body,參數都是放在url里面,而post請求是放在body…

大華DSS S2-045 OGNL表達式注入漏洞復現

0x01 產品簡介 大華DSS安防監控系統平臺是一款集視頻、報警、存儲、管理于一體的綜合安防解決方案。該平臺支持多種接入方式,包括網絡視頻、模擬視頻、數字視頻、IP電話、對講機等。此外,該平臺還支持多種報警方式,包括移動偵測、區域入侵、越線報警、人員聚集等。 0x02 漏…

元宇宙:重塑游戲行業體驗下一個前沿

游戲行業在其整個歷史中經歷了顯著的轉變,從超級馬里奧的像素化冒險發展到Red Dead Redemption等游戲中迷人的開放世界體驗。隨著時間的推移,游戲不斷突破數字領域所能達到的極限。然而,被稱為元宇宙的突破性演變將徹底改變游戲行業&#xff…

PO模式在selenium自動化測試框架有什么好處

PO模式是在UI自動化測試過程當中使用非常頻繁的一種設計模式,使用這種模式后,可以有效的提升代碼的復用能力,并且讓自動化測試代碼維護起來更加方便。 PO模式的全稱叫page object model(POM),有時候叫做 p…

網工內推 | 外企、合資公司急招網工,國內外旅游,健身年卡

01 深圳市耐施菲信息科技有限公司 招聘崗位:網絡工程師 職責描述: 1、負責項目的計劃、實施、過程管控、項目驗收等工作; 2、負責大型項目設備實施、安裝調試等售后維護工作; 3、分析、設計網絡拓撲結構、配置H3C、華為等交換機…

SQL FOREIGN KEY 約束- 保障表之間關系完整性的關鍵規則

SQL FOREIGN KEY 約束 SQL FOREIGN KEY 約束用于防止破壞表之間關系的操作。FOREIGN KEY 是一張表中的字段(或字段集合),它引用另一張表中的主鍵。具有外鍵的表稱為子表,具有主鍵的表稱為被引用表或父表。 以下是兩個表的例子&a…

dll動態鏈接庫【C#】

1說明: 在C#中,dll是添加 【類庫】生成的。 2添加C#的dll: (1)在VS中新建一個Windows應用程序項目,并命名為TransferDll。 (2)打開Windows窗體設計器,從工具箱中為窗體…

Unity 性能優化的手段【更新中】

目錄 對象池 減少Draw Calls 批處理 合并網格 貼圖集 LOD 基本原理 應用 優點 挑戰 LightMap 基本概念 如何工作 優點 缺點 對象池 使用對象池:頻繁地創建和銷毀對象會導致性能下降和內存碎片化。對象池可以預先創建一些對象,然后在需要時…

【數據開發】Hive 多表join中的條件過濾與指定分區

1、條件過濾 left join 中 on 后面加條件 where 和 and 的區別 1、 on條件是在生成臨時表時使用的條件,它不管and中的條件是否為真,都會保留左邊表中的全部記錄。2、where條件是在臨時表生成好后,再對臨時表進行過濾的條件。這時已經沒有le…

Gemini:新一代AI產品的驚人功能和革命性影響

目錄 1 前言2 視頻分析與交互能力3 策劃推理能力4 教育領域的應用能力5 科學領域的論文解讀能力6 結語 1 前言 Google最新推出的AI產品Gemini引發了廣泛關注,其30分鐘的介紹和演示視頻展示了令人驚艷的功能。Gemini以其驚人的藝術創作能力脫穎而出,通過…

TCP一對一聊天

客戶端 import java.awt.BorderLayout; import java.awt.Color; import java.awt.Dimension; import java.awt.Font; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import java.io.BufferedReader; import java.io.IOException; import java.io…

python-04(入門基礎篇4——lists相關的部分語法)

python-04(入門基礎篇4——lists相關的部分語法) 1. 前言1.1 python入門1.2 參考官網 2. 關于索引和切片3. 在列表追加元素3.1 支持拼接3.2 使用list.append() 方法在列表末尾添加新項 4. 列表是可變類型4.1 更改其中某元素內容4.2 使用切片更改列表大小…

cesium學習記錄

有段時間自學了cesium,這里記錄一下自學過程,希望在所需之時查閱~~ 1、cesium源碼獲取與Index頁面介紹 官網網址 www.cesiumjs.org 源代碼下載:Platform-Dowmloads 在index.html右擊open with Live server開啟本地服務 點擊Documentation…