好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

ES6+ trim()

ES6+ trim()

1. 前言

本节介绍 ES6 的字符串新增 方法 trim() ,该 方法 会从 一个 字符串的两端 删除 空白字符。 在这 个上下文中的空白字符是所有的空白字符 (space, tab, no-break space 等) 以及所有行终止符字符(如 LF,CR 等)。

2. 方法 详情

trim() 的 方法 返回值是去掉两端空白字符的字符串,并不影响原字符串本身,不接收任何参数。

使用语法:

 str .  trim  (  ) 
 

在低版本浏览器中是 不支持 这 方法 的,一版我们会使用正则的方式去 去除 字符串两边的空格的。

  if   (  ! String . prototype . trim )   { 
    String . prototype .  trim   =   function   (  )   { 
         return   this  .  replace  (  /^\s+|\s+$/gm  ,   ''  )  ; 
     } 
 } 
 

3. 使用场景

去除 字符串两端的空白字符。

4. 实例

1. 删除 前后的空白字符。

  var  str  =   '   foo  '  ; 
console .  log  ( str .  trim  (  )  )  ;    // 'foo' 
 

2. 如果字符串只有一边有空白字符,则只 删除 一边的空白字符。

  var  str  =   'foo    '  ; 
console .  log  ( str .  trim  (  )  )  ;    // 'foo' 
 var  str  =   '   foo'  ; 
console .  log  ( str .  trim  (  )  )  ;    // 'foo' 
 

5. 拓展

通过 trim() 方法 衍生出的两个 方法 tr ims tart() 和 trimEnd() 。 tr ims tart() 是 删除字符串 左边的空白字符, trimEnd() 是 删除字符串 右边的空白字符。如:

  const  str  =   '  imooc  '  ; 
str .  trim  (  )  			 // "imooc" 
str .  tr ims tart  (  )  	 // "imooc  " 
str .  trimEnd  (  )  		 // "  imooc" 
 

tr ims tart() 把 str 左边的空白字符去掉了, trimEnd() 把 str 右边的空白字符去掉了。

另外在浏览器中我们可以使用 tr ims tart() 和 trimEnd() 的别名,也能达到同样的 效果 , trimLeft() 是 tr ims tart() 的别名, trimRight() 是 trimEnd() 的别名。

  const  str  =   '  imooc  '  ; 
str .  trimLeft  (  )  		 // "imooc  " 
str .  trimRight  (  )  	 // "  imooc" 
 

6. 小结

本节讲解了字符串的 trim() 方法 的使用,总结以下几点:

trim 方法 会 去除 字符串两边的空白字符串; 如果只 去除 一般字符串时可以使用 tr ims tart() 和 trimEnd() 。

查看更多关于ES6+ trim()的详细内容...

  阅读:50次

上一篇

下一篇

第1节:ES6+ 简介    第2节:ES6 环境配置    第3节:ES6+ let    第4节:ES6+ const    第5节:ES6+ 展开语法    第6节:ES6+ 剩余参数    第7节:ES6+ 解构赋值    第8节:ES6+ 模版字符串    第9节:ES6+ 箭头函数    第10节:ES6+ 数值扩展    第11节:ES6+ isFinite()&isNaN()    第12节:ES6+ Number 对象的方法    第13节:ES6+ Math 对象的扩展    第14节:ES6+ includes()    第15节:ES6+ 字符串的扩展    第16节:ES6+ startsWith()    第17节:ES6+ endsWith()    第18节:ES6+ repeat()    第19节:ES6+ padStart()    第20节:ES6+ padEnd()    第21节:ES6+ trim()    第22节:ES6+ Array.from()    第23节:ES6+ of()    第24节:ES6+ find()和findIndex()    第25节:ES6+ copyWithin()    第26节:ES6+ fill()    第27节:ES6+ isArray()    第28节:ES6+ 对象的扩展    第29节:ES6+ flat()    第30节:ES6+ 可选链操作符    第31节:ES6+ Object.is()    第32节:ES6+ Object.assign()    第33节:ES6+ Object.keys()    第34节:ES6+ Object.values()    第35节:ES6+ Object.entries()    第36节:ES6+ 数据结构扩展    第37节:ES6+ Set    第38节:ES6+ WeakSet    第39节:ES6+ Map    第40节:ES6+ WeakMap    第41节:ES6+ Symbol    第42节:ES6+ for...of    第43节:ES6+ 迭代协议    第44节:ES6+ 实现一个简版的 Promise    第45节:ES6+ Promise 基础    第46节:ES6+ Promise 进阶    第47节:ES6+ Generator 基础    第48节:ES6+ Generator 函数应用    第49节:ES6+ async/await    第50节:ES6+ Class 前置知识    第51节:ES6+ Class    第52节:ES6+ Proxy    第53节:ES6+ Reflect(一)    第54节:ES6+ Reflect(二)    第55节:ES6+ 模块化(一)    第56节:ES6+ 模块化(二)    第57节:ES6实战1-实现Vue3 reactive 源码    第58节:ES6实战2-实现 Vue3 effect 源码    第59节:ES6 实战2-封装请求    第60节:ES6+ 实战3-代码整洁之道    第61节:ES6 Map原理分析    第62节:ES6module语法加载importexport    第63节:ES6的循环与可迭代对象示例详解