如何为 js 变量设置最小和最大边界？

Posted 2023-02-22

【中文标题】如何为 js 变量设置最小和最大边界？

【英文标题】：How to set min and max boundaries for a js variable?

【发布时间】：2016-01-05 03:13:32

【问题描述】：

我目前正在使用 vuejs 渲染分页。这是我的 algolia 数据。

我正在检查用户是否按下了上一个按钮/下一个按钮或直接输入（1、2、3 等）

    setPage: function(page) 
            if(page === 'previous') 
                // go back one page
                this.currentPage--;
                this.helper.setCurrentPage(this.currentPage).search();
             else if(page === 'next') 
                // go forward one page
                this.currentPage++;
                this.helper.setCurrentPage(this.currentPage).search();
             else 
                // change the currentPage with direct select(no prev/next button)
                this.helper.setCurrentPage(page).search();
            

            // update the currentPage
            this.currentPage = this.helper.getCurrentPage();
        

这很好用，但我只有 0 - 4 页（页面从 0 开始）。如何确保我的 currentPage var 不会出现负数或超出我拥有的最大页面数？

我想使用另一个 if 语句可能会起作用，但感觉有点草率。我正在学习 javascript 和 vue.js，所以我想知道是否有更好的方法。

【问题讨论】：

if (page < MIN || page > MAX) throw new Error("That page does not exist!")

取决于想要的行为...您是否希望它在结束时循环到开始？还是隐藏按钮？无论哪种方式都需要与某处可用的总数进行比较，而这并未在问题中显示

【参考方案1】：

创建类似于属性的方法：

function nextPage(pageParam)
    if (page > MAX) 
        // Disable next btn enable prev btn
     else  
        // advance page 
    
 

function prevPage(pageParam)
    if (page =< 0 ) 
        // Disable prev btn enable next btn
     else  
        // go back a page 
    

 

无论你在哪里调用 decrimentor (this.currentPage--)，你都会调用 prevPage。这使您可以集中管理行为。例如，如果您决定希望它在最后一页上点击下一页时进行轮播，它将转到第一页，您可以在一个地方实现它。

【讨论】：

谢谢我喜欢这种方法。非常干净地将所有杂乱的代码隐藏在其他函数中，并保持整个代码的可读性。感谢您花时间阅读我的问题！