padstart兼容_显示列出polyfill

padstart兼容_显示列出polyfill?原文链接:欢迎star.今天在看ES7新增的部分Api的时候刚好看到padStart的这个方法,好像还挺实用的,而且也想在正式开始工作之前先找找写代码的感觉,于是顺手(其实还是花了不少时间的)就实现了这个polyfill。相关的API用法在MDN上有说明。链接下面是具体实现if(!String.p…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

?

原文 链接:欢迎 star.

今天在看 ES7 新增的部分 Api 的时候刚好看到 padStart 的这个方法,好像还挺实用的,而且也想在正式开始工作之前先找找写代码的感觉,于是顺手(其实还是花了不少时间的)就实现了这个 polyfill。

相关的 API 用法在 MDN 上有说明。 链接 下面是具体实现

if(!String.prototype.padStart)
    String.prototype.padStart = 
       // 为了方便表示这里 fillString 用了ES6 的默认参数,不影响理解
        function (maxLength, fillString=' ') {
            if(Object.prototype.toString.call(fillString) !== "[object String]") throw new TypeError('fillString must be String')
            let str = this
            // 返回 String(str) 这里是为了使返回的值是字符串字面量,在控制台中更符合直觉
            if(str.length >= maxLength) return String(str)

            let fillLength = maxLength - str.length, 
                 times = Math.ceil(fillLength / fillString.length)
           
           // 这个算法叫啥?
           // SICP 的中文版第 30页 有用到同种算法计算乘幂计算
            while(times >>= 1) { 
                fillString += fillString
                    if(times === 1){
                       fillString += fillString
                    }     
            }
            return fillString.slice(0, fillLength) + str  
        }
// padStart  对于我来说最常用的地方就在于时间或者数字格式补全了

'5'.padStart(2, '0') // '05'
'15'.padStart(2, '0') // '15'

ps:
写完之后突然发现这个好像就是之前 npm 的 left-pad 删库事件;隐约记得好多人都重写过这个库。anyway, 练手的目的算是达到了。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/197797.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 单调队列初步「建议收藏」

    单调队列初步「建议收藏」
    一直弄不明白单调队列是什么,在网上也找不到易懂的介绍。最后结合别人博客上的介绍和程序看才理解是怎么回事。
    我们从最简单的问题开始:
    给定一个长度为N的整数数列a(i),i=0,1,…,N-1和窗长度k.
    要求:
         f(i)=max{a(i-k+1),a(i-k+2),…,a(i)},i=0,1,…,N-1
    问题的另一种描述就是用一个长度为k的窗在整数数列上移动,求窗里面所包含的数的最大值。
    解法一:

    2022年6月25日
    25
  • 二进制与十进制的讲解与转换「建议收藏」

    二进制与十进制的讲解与转换「建议收藏」文章目录?什么是十进制呢??什么是二进制??十进制和二进制之间可以转换吗??十进制与二进制之间的转换?二进制转十进制?十进制转二进制?写在最后哈喽,大家好!这是我的第一篇博客,就先来介绍一下自己吧,我是Why,一名在读学生,目前刚刚开始进入自己的编程学习生涯。虽然学习起步较晚,但我坚信做了才有0或1的可能。学了一段时间以后也是选择在CSDN上分享自己的日常笔记,也希望能够在众多道友的大家庭中打成一片。本文主要讲解二进制以及进制之间的转换,如果大家读后觉得有用的话,还请大家多多支持博主:欢迎❤️点赞

    2022年10月18日
    2
  • docker离线安装部署_ubuntu 离线安装docker

    docker离线安装部署_ubuntu 离线安装docker说明使用虚拟机真实模仿离线环境虚拟机系统为CentOS7正文下载Docker二进制文件(离线安装包):下载地址本文使用/x86_64/docker-17.12.1-ce.tgz,注意对应操作系统类型。通过FTP工具将docker-17.12.1-ce.tgz上传到服务器上解压安装包tarzxfdocker-17.12.1-ce.tgz将docker相关命令拷贝到/usr/bin,方便直接运行命令sudocpdocker/*/usr/bin/启动Docke

    2022年9月26日
    4
  • JavaScript之继承

    JavaScript之继承

    2020年11月19日
    173
  • vue入门基础教程之经验总结篇(小白入门必备)|建议收藏「建议收藏」

    vue入门基础教程之经验总结篇(小白入门必备)|建议收藏「建议收藏」VUEvue组件的三个API:prop、event、slotprop定义了这个组件有哪些可配置的属性,组件的核心功能也都是它来确定的。组件里定义的prop都是单向数据流,只能通过父级组件对齐进行修改,组件本身不能修改props的值,只能修改定义在data里的数据,非要修改,也是通过后面介绍的自定义事件通知父级,由父级来修改;在子组件定义prop是,使用了camelCase的命名法,由于html特性不区分大小写。camelCase的prop用于特性时,会转为短横线隔开(比如availab

    2022年6月4日
    30
  • osi七层模型各层功能简述(简述osi七层模型各层功能)

    读完本篇文章将会了解以下问题1.OSI的基本概念及原则2.OSI七层模型各层功能概述3.OSI七层模型举例4.OSI七层模型总结—————————————————————————————————————————…

    2022年4月10日
    64

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号