在 JavaScript 中为 String.prototype.trim() 方法实现 polyfill

在 javascript 中为 string.prototype.trim() 方法实现 polyfill

一些旧版本的浏览器或旧浏览器本身不支持JavaScript新发展的功能。例如,如果您使用的是非常旧的浏览器版本,它不支持 ES10 版本 JavaScript 的功能。例如,某些版本的浏览器不支持 ES10 版本的 JavaScript 中引入的 Array.falt() 方法来展平数组。

在这种情况下,我们需要实现用户定义的方法来支持旧浏览器版本的功能。在这里,我们将为 String 对象的trim()方法实现polyfill。

语法

用户可以按照下面的语法使用正则表达式为 string.prototype.trim() 方法实现polyfill。

String.prototype.trim = function (string) {   return str.replace(/^s+|s+$/g, "");}

登录后复制

在上面的语法中,我们使用正则表达式来替换字符串开头和结尾的空格。

立即学习“Java免费学习笔记(深入)”;

正则表达式解释

^ – 这是字符串的开头。

s+ – 代表一个或多个空格。

| – 它代表“OR”运算符。

s+$ – 它表示字符串末尾的空格。

g – 它告诉我们删除所有匹配项。

示例(使用内置 string.trim() 方法)

在下面的示例中,我们使用了 String 对象的内置 trim() 方法来删​​除字符串开头和结尾的空格。

   

Using the trim() method without polyfill in JavaScript

let content = document.getElementById('content'); let str = " This is string with white spaces! "; content.innerHTML += "The original string is :-" + str + ".
"; let trimmed = str.trim(); content.innerHTML += "The trimmed string using trim() method is :-" + str + ".
";

登录后复制

示例(为 string.trim() 方法实现了 polyfill)

在下面的示例中,我们实现了polyfill,以使用正则表达式修剪字符串。我们编写了正则表达式,用空字符串替换开头和结尾的空格。

   

Using the trim() method with polyfill in JavaScript

let content = document.getElementById('content'); String.prototype.trim = function (string) { let regex = /^s+|s+$/g; return str.replace(regex, ""); } let str = "Hi, How are you? "; content.innerHTML += "The original string is :-" + str + ".
"; let trimmed = str.trim(); content.innerHTML += "The trimmed string using trim() method is :-" + str + "
";

登录后复制

示例

在下面的示例中,我们使用 for 循环来查找字符串的第一个和最后一个有效字符的索引。我们创建了一个包含代表空白的不同字符的数组。之后,第一个 for 循环遍历字符串的字符,检查不在“spaces”数组中的第一个字符,并将该索引存储在 start 变量中。此外,它以相同的方式从最后一个字符中查找第一个有效字符。

最后,我们使用了 slice() 方法来获取从“start”位置开始到“end”位置结束的子字符串。

   

Using the trim() method with polyfill in JavaScript

let content = document.getElementById('content'); String.prototype.trim = function () { const spaces = ["s", "", "", " ", "", "u3000"]; let start = 0; let end = this.length - 1; // get the first index of the valid character from the start for (let m = 0; m -1; n--) { if (!spaces.includes(this[n])) { end = n; break; } } // slice the string return this.slice(start, end + 1); } let str = " Hi, How are you? "; content.innerHTML += "The original string is :-" + str + ".
"; let trimmed = str.trim(); content.innerHTML += "The trimmed string using trim() method is :-" + str + "
";

登录后复制

用户在本教程中学习了如何实现 string.trim() 方法的 polyfill。我们已经看到了两种为trim()方法实现polyfill的方法。第一种方法使用正则表达式和replace()方法。第二种方法是简单的方法,使用 for 循环、slice() 和includes() 方法。

以上就是在 JavaScript 中为 String.prototype.trim() 方法实现 polyfill的详细内容,更多请关注【创想鸟】其它相关文章!

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

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2694515.html

(0)
上一篇 2025年3月7日 18:07:44
下一篇 2025年3月7日 18:07:53

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • 15个Java线程并发面试题和答案

    1. 现在有线程 T1、T2 和 T3。你如何确保 T2 线程在 T1 之后执行,并且 T3 线程在 T2 之后执行? 这个线程面试题通常在第一轮面试或电话面试时被问到,这道多线程问题为了测试面试者是否熟悉 join 方法的概念。答案也非常…

    2025年5月3日
    000
  • java面试题最容易犯错的8道

    1. static 和 final 的用法 static 的作用从三个方面来谈,分别是静态变量、静态方法、静态类。 静态变量:声明为 static 的静态变量实质上就是全局变量,当声明一个对象时,并不产生static 变量的拷贝,而是该类所…

    2025年5月3日
    000
  • Person p = new Person();在内存中做了哪些事情?

    Person p = new Person();在内存中做了哪些事情? 将Person.class文件加载进内存中。 如果p定义在主方法中,那么,就会在栈空间开辟一个变量空间p。 在堆内存给对象分配空间。 对对象中的成员进行默认初始化。 对…

    2025年5月3日
    000
  • 2020年JAVA最常见面试题汇总(收藏)

    java基础以及多个“比较” 1.collections.sort排序内部原理 在Java 6中Arrays.sort()和Collections.sort()使用的是MergeSort,而在Java 7中,内部实现换成了TimSort,其…

    2025年5月3日
    000
  • 9道常见的java笔试选择题

    1.关于Java编译,下面哪一个正确()(选择一项) A.Java程序经编译后产生machine code B.Java程序经编译后会生产byte code C.Java程序经编译后会产生DLL 立即学习“Java免费学习笔记(深入)”; …

    2025年5月3日
    000
  • java最新基础知识面试题

    java最新基础知识面试题 1、static关键字什么意思?java中是否可以覆盖一个private或者是static的方法? “static”表明一个成员变量或者是成员方法可以在没有所属类的实例变量的情况下访问。 java中static方…

    2025年5月3日
    000
  • java内存溢出面试题

    引起内存溢出的原因有很多种,常见的有以下几种: 内存中加载的数据量过于庞大,如一次从数据库取出过多数据; 集合类中有对对象的引用,使用完后未清空,使得JVM不能回收; 代码中存在死循环或循环产生过多重复的对象实体; 立即学习“Java免费学…

    2025年5月3日
    000
  • Java中高级面试题(附答案)

    1、redis如何跟本地数据同步? 程序实现mysql更新、添加、删除就会同步操作redis 程序查询redis,不存在就查询mysql,自动保存redis 2、redis几种数据结构? set、list、hash、string、zset …

    2025年5月3日
    000
  • java gc 面试题及答案(1~5题)

    1、既然有GC机制,为什么还会有内存泄露的情况? 理论上Java因为有垃圾回收机制(GC)不会存在内存泄露问题(这也是Java被广泛使用于服务器端编程的一个重要原因)。然而在实际开发中,可能会存在无用但可达的对象,这些对象不能被GC回收,因…

    2025年5月3日
    000
  • java笔试常见的选择题

    1.已知表达式int m[] = {0,1,2,3,4,5,6}; 下面那个表达式的值与数组的长度相等() A m.length() B. m.length C. m.length()+1 立即学习“Java免费学习笔记(深入)”; D. …

    2025年5月3日
    000

发表回复

登录后才能评论