JavaScript 문자열 실제 루틴의 세부사항

JavaScript 문자열은 텍스트를 저장하고 조작하는 데 사용됩니다. 따라서 JS 코드를 작성할 때, DOM 객체의 속성을 읽거나 설정할 때, 쿠키를 조작할 때, 다양한 날짜를 변환할 때 등 항상 함께합니다. count;와 그녀의 많은 API는 항상 사람들이 자주 사용하기 때문에 烂笔头을 검색하는 것이 좋을 수도 있고, 그건 그렇고 블로그의 존재 가치를 반영하므로 존재합니다. 이 요약.

문자열 차단

1. substring()

xString.substring(start,end)

substring()은 가장 일반적으로 사용되는 문자열 차단 방법입니다. 매개변수는 음수일 수 없습니다. )는 각각 가로챌 시작 위치와 끝 위치입니다. 내용이 시작부터 끝-1까지의 모든 문자인 새 문자열을 반환합니다. end 매개변수(end)를 생략하면 시작 위치부터 끝까지 가로채는 것을 의미한다.

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

2.slice()

stringObject.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()

stringObject.substr(start,length)

substr() 메서드는 문자열의 시작 첨자부터 지정된 개수의 문자를 추출할 수 있습니다. 반환 값은 stringObject의 시작 부분부터 시작하는 길이 문자(start가 가리키는 문자 포함)를 포함하는 문자열입니다. 길이를 지정하지 않으면 반환된 문자열에는 stringObject의 시작부터 끝까지의 문자가 포함됩니다. 또한, start가 음수이면 문자열의 끝에서부터 센다는 뜻이다.

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

4.split()

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

• separator는 문자열을 분할하는 데 사용되는 문자(문자열)를 지정합니다. 구분 기호는 문자열이거나 정규 표현식일 수 있습니다. 구분 기호를 생략하면 전체 문자열의 배열이 반환됩니다. 구분 기호가 빈 문자열인 경우 str은 원래 문자열의 각 문자 배열을 반환합니다.

• limit 반환되는 분할 조각 수를 제한하는 정수입니다. 분할 메소드는 여전히 일치하는 각 구분 기호를 분할하지만 반환된 배열은 최대 제한 요소까지만 차단합니다.

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

말하자면, 이 기능은 정말 사용하기 쉽습니다. 문자 차단 요구 사항은 특정 문자에 따라 달라지며 위의 세 가지 기능은 모두 해당 위치를 알아야 합니다. 물론 indexOf 및 다른 방법을 사용하여 얻을 수 있습니다. 물론 이는 매우 번거롭지만 split을 사용하면 더 쉽습니다.

검색 클래스 메서드

1. indexOf() & include()

stringObject.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('.', 12)) // -1

indexOf()은 지정된 문자열 값이 문자열에서 처음 나타나는 위치를 검색하는 데 사용되지만 지정된 문자열이 문자열에 존재하는지 확인하는 데 여러 번 사용됩니다.

if (str.indexOf('yoursPecifiedStr') !== -1) {
    // do something
}

이러한 시나리오에서는 ES6 언어의 include()가 훨씬 더 우아하다는 것을 알아야 합니다. include() 메서드는 문자열이 다른 문자열에 포함되어 있는지 확인하는 데 사용됩니다. true를 반환하면 false를 반환합니다.

str.includes(searchString[, position])

searchString 검색할 하위 문자열입니다. 위치는 선택 사항입니다. 하위 문자열 검색을 시작하는 현재 문자열의 인덱스 위치는 기본값은 0입니다. include()는 대소문자를 구분한다는 점에 유의해야 합니다.

'Blue Whale'.includes('blue'); // returns false
'乔峰乔布斯乔帮主'.includes('乔布斯'); // returns true
if (str.includes('yoursPecifiedStr')) {
    // do something(这样写是不是更为人性化？Yeah，这是一个更趋向人性化的时代嘛)
}

2.lastIndexOf()

stringObject.lastIndexOf(searchValue,fromIndex)

lastIndexOf() 구문은 지정된 하위 문자열 값이 마지막으로 나타나는 위치를 반환하며 검색 순서는 Back부터입니다. 앞쪽.

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

search()

stringObject.search(substr)
stringObject.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

match() 메서드

stringObject.match(substr)
stringObject.match(regexp)

match() 메서드는 문자열 내에서 지정된 값을 검색하거나 하나 이상의 정규 표현식과 일치하는 항목을 찾을 수 있습니다.

전달된 매개 변수가 전역 일치를 수행하지 않는 하위 문자열 또는 정규 표현식인 경우 match() 메서드는 처음부터 일치하는 결과를 수행합니다. 일치하는 결과가 없으면 null이 반환됩니다. 그렇지 않은 경우 배열의 0번째 요소는 일치하는 텍스트를 저장합니다. 또한 반환된 배열에는 일치하는 텍스트의 시작 문자 인덱스와 stringObject를 각각 나타내는 두 개의 개체 속성도 포함됩니다. 참조(즉, 원래 문자열).

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이 반환됩니다. 그렇지 않으면 요구 사항을 충족하고 인덱스 및 입력 속성이 없는 모든 하위 문자열을 저장하는 배열이 반환됩니다.

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

其他方法

replace()方法

stringObject.replace(regexp/substr,replacement)

replace()方法用来进行字符串替换操作，它可以接收两个参数，前者为被替换的子字符串（可以是正则），后者为用来替换的文本。

如果第一个参数传入的是子字符串或是没有进行全局匹配的正则表达式，那么replace()方法将只进行一次替换（即替换最前面的），返回经过一次替换后的结果字符串。

let str = 'www.jeffjade.com'
console.log(str.replace('w', 'W'))   // Www.jeffjade.com
console.log(str.replace(/w/, 'W'))   // Www.jeffjade.com

如果第一个参数传入的全局匹配的正则表达式，那么replace()将会对符合条件的子字符串进行多次替换，最后返回经过多次替换的结果字符串。

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

toLowerCase() & toUpperCase()

stringObject.toLowerCase()
stringObject.toUpperCase()

toLowerCase()方法可以把字符串中的大写字母转换为小写，toUpperCase()方法可以把字符串中的小写字母转换为大写。

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

模板字符串

这个也是 ES6 才引入进来的新语法，来解决传统输出String模板的蹩脚问题；其功能之强大，设计之贴心，着实令人得到极大满足感，好如久旱逢甘霖一般的舒畅。更何况，在当今 MVVM 前端框架大行其道的时代，使用 ES6 语法也是不用自己个儿去操心兼容性问题，对于塑造 Dom Template 更是如虎添翼，令人爱不释手。

对于她的使用，阮一峰在ECMAScript 6 入门有过详细的描述以及示例，在此就不赘述。只需要明白我们可以像这样去操作了，试问爽否？

function ncieFunc() {
  return "四海无人对夕阳";
}
var niceMan = "陈寅恪";
var jadeTalk = `一生负气成今日 \n ${ncieFunc()} ,
语出 ${niceMan} 的《忆故居》。
`
console.log(jadeTalk)

运行之，Chrome Console 输出结果如下：

一生负气成今日
四海无人对夕阳 ,
语出 陈寅恪 的《忆故居》。

组合其法

细看 JavaScript 提供的String Api，还是有蛮多的，也有些许废弃的，也有将在未来版本会出来的；这其中不乏很多也挺有用的，譬如： charAt(x)、charCodeAt(x)、concat(v1, v2,…)、fromCharCode(c1, c2,…) 等等,还有 ES6 对字符串的扩展，比如 字符串的遍历器接口，repeat() 等等，这可以参见 ES6-string，这里就不多赘述。

在实际代码生产中，很多时候需要用这些提供的基本方法，来打出一套组合拳，以解决其需求所需。很显然又可以借助 prototype 属性，将自造的各路拳法，其归置于 String 对象，然后天亮啦。这一步就看个人喜好了，这里抛出一二段，以引大玉。

字符串反转

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

去除空白行

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转化为数组

1, 转化为一维数组

场景是根据某子字符串转化，直接就用 split 就好；如果转换规则不统一，那么请自求多福吧。

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

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, '')
}
String.prototype.strTo2dArr = 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.strTo2dArr('\n', ','))

运行之，输出结果如下：

[ [ ‘渺渺钟声出远方’, ‘依依林影万鸦藏。’ ],
[ ‘一生负气成今日’, ‘四海无人对夕阳。’ ],
[ ‘破碎山河迎胜利’, ‘残馀岁月送凄凉。’ ],
[ ‘松门松菊何年梦’, ‘且认他乡作故乡。’ ] ]

抗战时期，陈寅恪先生在给傅斯年的信中，说了这样一段话：“弟之生性，非得安眠饱食，不能作文，非是既富且乐，不能作诗，平生偶有安眠饱食之时，故偶可为文，而一生从无既富且乐之日，故总做不好诗。” 虽是以调侃的以言说，恐也是寄之感慨的悟道之语。自由独立的经济生活，是自由思想与独立人格的坚强后盾与实际保障。写博这事儿，也是一样，整日疲于需求之成改，熬时碌碌，生为糊口；偶有的闲时气力，哪儿是能经得起折腾的？唯是在垒码的间隙，略做记录，积而成篇。而这番为得的糊口的奋争，也是希望将来的某天——能有既富且乐之时，谈那些想谈的，做那些想做的事，如此而已。

 以上就是JavaScript 字符串实用常操纪要详情的内容，更多相关内容请关注PHP中文网（www.php.cn）！