JavaScript 字符串有用常操记要

原文链接

JavaScript 字符串用于存储和处置惩罚文本。因此在编写 JS 代码之时她总跬步不离,在你处置惩罚用户的输入数据的时刻,在读取或设置 DOM 对象的属性时,在操纵 Cookie 时,在转换种种差别 Date 时,诸此等等,繁不能数;而她那蛮多的 API 呵,总有些让人不肯去影象的激动,既然用经常搜,倒不如烂笔头一番,以作了却,顺路也体现下这博客存在的代价,由此就有了这篇记要。

一、字符串截取

1、substring()

str.substring(start, end)

substring()是最常用到的字符串截取要领,它能够吸收两个参数,参数不能为负值,离别是要截取的最先位置和完毕位置,而且返回一个新的字符串,其内容是从start处到end-1处的一切字符。若完毕参数end省略,则示意从start位置一向截取到末了。

let str = 'www.jeffjade.com'
console.log(str.substring(0,3)) // www
console.log(str.substring(4))   // jeffjade.com
console.log(str.substring(-2))  // www.jeffjade.com (传负值则视为0)

2、slice()

str.slice(start, end)

slice()要领与substring()要领异常相似,它传入的两个参数也离别对应着最先位置和完毕位置。而辨别在于,slice()中的参数能够为负值,假如参数是负数,则该参数划定的是从字符串的尾部最先算起的位置。比如说,-1指字符串的末了一个字符。

let str = 'www.jeffjade.com'
console.log(str.slice(0, 3))   // www
console.log(str.slice(-3, -1)) // co
console.log(str.slice(1, -1))  // www.jeffjade.co
console.log(str.slice(2, 1))   // '' (返回空字符串,start须小于end)
console.log(str.slice(-3, 0))  // '' (返回空字符串,start须小于end)

3、substr()

str.substr(start, length)

substr()要领可在字符串中抽取从start下标最先的指定数目的字符。其返回值为一个字符串,包含从 strstart(包含start所指的字符)处最先的length个字符。假如没有指定length,那末返回的字符串包含从startstr的末端的字符。别的假如start为负数,则示意从字符串尾部最先算起。

let str = 'www.jeffjade.com'
console.log(str.substr(1, 3))  // ww.
console.log(str.substr(0))     // www.jeffjade.com
console.log(str.substr(-3, 3)) // com
console.log(str.substr(-1, 5)) // m  (目的长度较大的话,以现实截取的长度为准)

4、split()

str.split([separator][, limit])

  • separator指定用来支解字符串的字符(串)。separator能够是一个字符串或正则表达式。假如疏忽 separator,则返回全部字符串的数组情势。假如separator是一个空字符串,则str将会把原字符串中每一个字符的数组情势返回。

  • limit是一个整数,限制返回的支解片断数目。split要领依然支解每一个婚配的separator,然则返回的数组只会截取最多limit个元素。

let str = 'www.jeffjade.com'
console.log(str.split('.'))          // ["www", "jeffjade", "com"]
console.log(str.split('.', 1))       // ["www"]
console.log(str.split('.').join('')) // wwwjeffjadecom

二、查找类要领

1、indexOf()

str.indexOf(searchValue, fromIndex)

indexOf()用来检索指定的字符串值在字符串中初次涌现的位置。它能够吸收两个参数,searchValue示意要查找的子字符串,fromIndex示意查找的最先位置,省略的话则从最先位置举行检索。

let str = 'www.jeffjade.com'
console.log(str.indexOf('.'))     // 3
console.log(str.indexOf('.', 1))  // 3
console.log(str.indexOf('.', 5))  // 12
console.log(str.indexOf('.', 13)) // -1

2、includes()(ES6)

includes()要领用于推断一个字符串是不是被包含在另一个字符串中,假如是返回true,不然返回false

str.includes(searchString[, position])

·searchString·将要征采的子字符串。position可选。从当前字符串的哪一个索引位置最先征采子字符串;默以为0。须要注重的是,includes()辨别大小写的。

console.log('Blue Whale'.includes('blue'));       // false
console.log('乔峰乔布斯乔帮主'.includes('乔布斯')); // true

3、lastIndexOf()

str.lastIndexOf(searchValue, fromIndex)

lastIndexOf()语法与indexOf()相似,它返回的是一个指定的子字符串值末了涌现的位置,其检索递次是从后向前。

let str = 'www.jeffjade.com'
console.log(str.lastIndexOf('.'))     // 12
console.log(str.lastIndexOf('.', 1))  // -1
console.log(str.lastIndexOf('.', 5))  // 3
console.log(str.lastIndexOf('.', 12)) // 12

4、search()

str.search(substr)
str.search(regexp)

search()要领用于检索字符串中指定的子字符串,或检索与正则表达式相婚配的子字符串。它会返回第一个婚配的子字符串的肇端位置,假如没有婚配的,则返回-1。

let str = 'www.jeffjade.com'
console.log(str.search('w'))    // 0
console.log(str.search(/j/g))   // 4
console.log(str.search(/\./g))  // 3

5、match()

str.match(substr)
str.match(regexp)

match()要领可在字符串内检索指定的值,或找到一个或多个正则表达式的婚配。

假如参数中传入的是子字符串或是没有举行全局婚配的正则表达式,那末match()要领会从最先位置实行一次婚配,假如没有婚配到效果,则返回null。不然则会返回一个数组,该数组的第0个元素寄存的是婚配文本,除此之外,返回的数组还含有两个对象属性indexinput,离别示意婚配文本的肇端字符索引和str的援用(即原字符串)。

let str = '#1a2b3c4d5e#';
console.log(str.match('A')); // 返回 null
console.log(str.match('b')); // 返回 ["b", index: 4, input: "#1a2b3c4d5e#"]
console.log(str.match(/b/)); // 返回 ["b", index: 4, input: "#1a2b3c4d5e#"]

假如参数传入的是具有全局婚配的正则表达式,那末match()从最先位置举行屡次婚配,直到末了。假如没有婚配到效果,则返回null。不然则会返回一个数组,数组中寄存一切相符要求的子字符串,而且没有indexinput属性。

let str = '#1a2b3c4d5e#'
console.log(str.match(/h/g))  // 返回 null
console.log(str.match(/\d/g)) // 返回 ["1", "2", "3", "4", "5"]

三、其他要领

1、replace()

str.replace(regexp/substr, replacement)

replace()要领用来举行字符串替代操纵,它能够吸收两个参数,前者为被替代的子字符串(能够是正则),后者为用来替代的文本。

假如第一个参数传入的是子字符串或是没有举行全局婚配的正则表达式,那末replace()要领将只举行一次替代(即替代最前面的),返回经由一次替代后的效果字符串。

let str = 'www.jeffjade.com'
console.log(str.replace('w', 'a')) // aww.jeffjade.com
console.log(str.replace(/w/, 'A')) // Aww.jeffjade.com

假如第一个参数传入的全局婚配的正则表达式,那末replace()将会对相符前提的子字符串举行屡次替代,末了返回经由屡次替代的效果字符串。

let str = 'www.jeffjade.com'
console.log(str.replace(/w/g, 'A'))   // AAA.jeffjade.com

replace(),这个要领挺有效。假如是在轻微善于正则的情况下,用replace等要领,来截取字符串,也是一个挺不错的挑选;这关于某些场景下,可到达事半功倍之效,以下示例:

let str = 'jeff@nice&jade'
console.log(str.replace(/@[\s\S]*/g, ''))  // "jeff"
console.log(str.replace(/@[\s\S]*&/g, '')) // "jeffjade"

2、toLowerCase()

str.toLowerCase()

toLowerCase()要领能够把字符串中的大写字母转换为小写

let str = 'www.jeffjade.com'
console.log(str.toLowerCase())   // www.jeffjade.com

3、toUpperCase()

str.toUpperCase()

toUpperCase()要领能够把字符串中的小写字母转换为大写

let str = 'www.jeffjade.com'
console.log(str.toUpperCase())   // WWW.JEFFJADE.COM

四、组合用法

1、字符串反转

String.prototype.reverse = function () {
    return this.split('').reverse().join('')
}

2、去除空白行

String.prototype.removeBlankLines = function () {
    return this.replace(/(\n[\s\t]*\r*\n)/g, '\n').replace(/^[\n\r\n\t]*|[\n\r\n\t]*$/g, '')
}

3、String转化为数组

  • 一维数组

let str= '陈寅恪,鲁迅,钱钟书,胡适,王国维,梁启超,吴宓,季羡林'
let arr= str.split(',')
console.log(arr) // ["陈寅恪", "鲁迅", "钱钟书", "胡适", "王国维", "梁启超", "吴宓", "季羡林"]
  • 二维数组

String.prototype.removeBlankLines = function () {
  return this.replace(/(\n[\s\t]*\r*\n)/g, '\n').replace(/^[\n\r\n\t]*|[\n\r\n\t]*$/g, '')
}
String.prototype.arr = function(firstSplit, secondSplit){
  var contentStr = this.removeBlankLines(),
      contentStrArr = contentStr.split(firstSplit),
      resultArr = contentStrArr.map((element) => {
        return element.split(secondSplit)
      })
  return resultArr
}
var str = `
渺渺钟声出远方,依依林影万鸦藏。
终身负气成本日,四海无人对旭日。
破裂江山迎成功,残余光阴送苦楚。
松门松菊何年梦,且认异域作老家。
`
console.log(str.arr('\n', ','))
// [['渺渺钟声出远方', '依依林影万鸦藏。'],
//  ['终身负气成本日', '四海无人对旭日。'],
//  ['破裂江山迎成功', '残余光阴送苦楚。'],
//  ['松门松菊何年梦', '且认异域作老家。']]

4、startsWith()

if (typeof String.prototype.startsWith != 'function') {
  String.prototype.startsWith = function (prefix){
    return this.slice(0, prefix.length) === prefix
  }
}

5、endWith()

if (typeof String.prototype.endsWith != 'function') {
  String.prototype.endsWith = function(suffix) {
    return this.indexOf(suffix, this.length - suffix.length) !== -1
  }
}
    原文作者:小小赵老汉
    原文地址: https://segmentfault.com/a/1190000008582883
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞