首页 > 其他分享 >JS实现控制台简易进度条

JS实现控制台简易进度条

时间:2022-10-17 22:11:30浏览次数:48  
标签:index stdout process 进度条 JS write let 控制台

JS实现控制台输出简易的进度条

代码效果如下

运行环境: vscode + node.js

控制台输出进度条的原理

  1. 暂停效果实现
// 在js里面可以定义一个延时函数
//延时函数,ms为需要暂停的毫秒数
function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms))
}
  1. 不换行打印
//js里面的不换行打印为process.stdout.write()
process.stdout.write(message);
  1. 光标移动到起始位置
//光标所在的行不变,列回到起始位置
process.stdout.write('\r');
  1. 清空上一次的输出信息
 process.stdout.clearLine();

完整的代码如下:

/*
 * @Author: JIA 
 * @Date: 2022-10-17 22:05:26 
 * @Last Modified by: JIA
 * @Last Modified time: 2022-10-17 22:08:29
 */
// 运行环境 vscode + node.js
//延时函数
function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms))
}
//需要拼接的字符串
let str0 = '当前进度: ';
let str02 = '';
let str03 = '';
let str04 = '';
//加一点动态性效果
let array = new Array('*','\\',  '|', '/', '-');
//主函数代码如下,使用匿名函数实现,await需要配合async使用
(async function () {
    //简单处理,进度条长度为100
    for (let index = 1; index <= 100; index++) {
        let str = `${index}${'%'} `;
        //更新进度条,计算百分比
        str03 = str0 + str02;
        str03 += '=> ';
        //不换行打印
        process.stdout.write(str03);
        process.stdout.write(' '.repeat(100 - index));
        process.stdout.write(str);
        //最后一次不需要打印动态信息标识符
        if(index != 100){
            process.stdout.write(array[index % array.length]);
        }
        //暂停200毫秒
        await sleep(200);
        if (index != 100) {
            //清空之前的输入内容
            process.stdout.clearLine();
            //光标移动到最前面
            process.stdout.write('\r');
            str02 += '=';
        } else {
            break;
        }
    }
})();

标签:index,stdout,process,进度条,JS,write,let,控制台
From: https://www.cnblogs.com/jackchen1928/p/16800919.html

相关文章

  • Js-Ajax
    jQueryAjax1ajax$.ajax({type:'POST',//请求方式GET/POSTurl:"/api/jsonws/cch-portlet.scorestatisticshelper/list-exam-score",//url地址......
  • 通过Js来设置页面样式
    介绍我们可以在编辑HTML源码的时候将CSS样式写死到.css文件或者HTML元素的style属性中,但又时候可能会需要动态地来修改某个元素的样式。我这里介绍两种方式:修改HTML元素的s......
  • 移动端适配+flexible.js+rem适配
    !function(a,b){functionc(){varb=f.getBoundingClientRect().width;b/i>540&&(b=540*i);varc=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}vard,e=a.document,f=e.d......
  • 原生js document.getElementById("XXX").disabled="false";无效
    想要设置表单元素不能访问时,使用document.getElementById("XXX").disabled="true";但是想要取消disabled的时候,发现document.getElementById("XXX").disabled="false";无......
  • Spring boot JSP
        路径            静态资源图片读取     ......
  • JS节流与防抖
    概述说明:在前端页面中,有些事件可能会由于用户不必要的操作而频繁触发,这在无形之中就增加了服务器的IO并发量.为了解决这个问题,我们通常会通过防抖或节流的方式对这类......
  • 在node中import from引入的文件要跟.js后缀,但是webapck不用?
    //a.jsletb=333;export{b};//index.jsimport{b}from'./a'//终端nodeindex.js//终端提示Error[ERR_MODULE_NOT_FOUND]:Cannotfindmodule'E:\Thousan......
  • 【C#之控制台与窗体应用程序】
    前言:学习一个东西,是一个逐步的过程,如盲人摸象,这是一个过程,到了最后的最后,会认识全局。这是在学习C#视频的一个感受。开始学习C#的时候,新建项目—控制台应用程序,然后开始敲代......
  • @vitejs/plugin-vue
      需要cmd命令下载,我指定的版本是1.0.0,这里需要的node版本的要>=12.0.0 而我的vue版本是3.04>npmi@vitejs/[email protected] 以下的@vitejs/plugin-vue的......
  • js 外部调用 嵌套函数
     在函外部直接调用函数的内部函数是不可以的,因为是向外查找的 所以不能直接内部函数  functionone(){functiontwo(){varb=30;......