>  기사  >  웹 프론트엔드  >  JavaScript 문자열 개체 코드 예제에 대한 심층적인 이해

JavaScript 문자열 개체 코드 예제에 대한 심층적인 이해

黄舟
黄舟원래의
2017-03-14 15:35:25938검색

이 글에서는 JavaScript에서 String 객체 의 구체적인 사용법과 String 객체에 관련된 메소드를 주로 소개하고 분석합니다. 개발자가 JavaScript 개발에서 더 많은 진전을 이룰 수 있도록 문자열을 훌륭하게 처리합니다.

1. 문자열에 대한 작업(예: 하위 문자열 가로채기, 문자열/문자 검색, 대소문자 변환 등)을 수행하는

String 개체를 도입합니다.

2. 정의 방법

2.1 new String(Value) Constructor: 내용이 Value
인 String 객체를 반환합니다. 🎜>

①value {String}: 문자열

반환 값:

{String object} 내용이 Value

인 String 개체를 반환합니다. 예:

var demoStr = new String('abc');
console.log(typeof demoStr); // => object
console.log(demoStr); // => abc

2.2 직접 할당(권장)

예:

var demoStr = 'abc';
console.log(typeof demoStr); // string
console.log(demoStr); // => abc

3. 예

속성

3.1 길이: 문자열의 문자 수를 반환합니다.

var s = 'abc';
console.log(s.length); // => 3
console.log('新年快乐'.length); // => 4 :一个中文字符也计算为1个数量
console.log(''.length); // => 0 :空字符串返回0

4. 인스턴스 메서드

참고: 문자열의 인스턴스 메서드는 문자열 자체를 변경하지 않고 작업 결과만 반환합니다.

4.1 charAt(index): 문자열의 지정된 위치에 있는 문자를 반환합니다. 숫자는 0부터 시작합니다. 존재하지 않는 값이 전달되면 빈 문자열이 반환됩니다.

매개변수 :

①index {int}: 위치

인덱스 , 0부터 계산

반환 값:

{string} 지정된 위치에 있는 문자를 반환합니다. 문자열, 전달된 경우 존재하지 않는 위치 값을 입력하고 빈 문자열을 반환합니다.

예:

var s = 'abc';
console.log(s.charAt(1)); // => b :返回位置为1的字符
console.log(s); // => 不影响原来的数组
console.log(s.charAt(5)); // => '' :获取一个不存在位置的字符,返回一个长度为0的空字符串

4.2 charCodeAt(index): 지정된 위치에 있는 문자의 유니코드 인코딩을 반환합니다. 문자열

매개변수:

①index {int}: 위치 인덱스, 0부터 계산

반환 값:

{number} 해당 문자의 유니코드 인코딩을 반환합니다. 문자열에서 지정된 위치, 존재하지 않는 위치 값을 입력하고 NaN

을 반환합니다. 예:

var s = 'abc';
console.log(s.charCodeAt(0)); // => 98 :字符b的Unicode编码
console.log(s.charCodeAt(5)); // => NaN :获取一个不存在位置的字符,返回NaN

4.3 concat(value1, value2 ... valueN): 하나 이상 연결

매개변수:

①value1, value2 … valueN {string}: 하나 이상의 문자열

반환값:

{string} 연결된 문자열

예:

var s = 'abc';
console.log(s.concat('d')); // => abcd
console.log(s); // => abc :不影响原先的字符串
console.log(s.concat('d', 'e')); // => abcde

4.4 indexOf(value, |start

Position): 인스턴스에서 앞에서 뒤로 문자열 또는 문자를 찾아 찾은 위치를 반환합니다. (0부터 계산이 시작됩니다.) 찾을 수 없으면 -1을 반환 매개변수:

①값 {string}: 검색할 문자열

②startPosition {int} 선택: 검색을 시작할 시작 위치, 기본값 시작 위치 0부터 검색 시작

반환 값:

{int} 찾은 위치를 반환합니다(0부터 계산). 찾지 못한 경우 -1을 반환

예시:

var s = 'abc';
console.log(s.indexOf('b')); // => 1
console.log(s.indexOf('d')); // => -1 :未找到
console.log(s.indexOf('b', 2)); // => -1 :从位置2(第3个字符处)开始查找

4.5 lastIndexOf(value, |startPosition): 인스턴스에서 문자열이나 문자를 뒤에서 앞으로 검색하여 찾은 위치를 반환합니다. (0부터 계산). 찾지 못한 경우 -1을 반환합니다.

매개변수:

①값 {string}: 검색할 문자열

②startPosition {int} 선택사항: 검색을 시작할 시작 위치, 기본값은 끝부터 검색 시작

반환 값 :

{int} 찾은 위치를 반환합니다(0부터 계산). 찾을 수 없으면 -1을 반환

예:

var s = 'abcabc';
console.log(s.lastIndexOf('a')); // => 3 :从后往前查找
console.log(s.lastIndexOf('d')); // => -1 :未找到返回-1
console.log(s.lastIndexOf('a', 2)); // => 0 :从位置2(第3个字符处)开始往前查找

4.6 localeCompare(value): 인스턴스를 매개변수와 비교하고 비교 결과를 반환

매개변수:

①value { string}: 비교할 문자열

반환값:

0: 인스턴스가 매개변수보다 큼

1: 인스턴스가 매개변수와 같음

-1: 인스턴스가 매개변수보다 작습니다

예:

var s='abc';
console.log(s.localeCompare('ab')); // => 1 :实例比参数大
console.log(s.localeCompare('abc')); // => 0 :实例与参数相等
console.log(s.localeCompare('abd')); // => -1 :实例比参数小

4.7 match(regexp): 일치 검색에

정규식 사용매개변수:

①regexp {regexp}: 정규 표현식, 예: /d+/

반환 값:

은 정규 표현식에 ' 속성이 있는지 여부에 따라 다른 결과를 반환합니다. g'; 일치하는 항목이 없으면 {

null}을 반환합니다.

① 정규 표현식에는 'g' 속성이 없으며 일치를 수행하고 {단일 일치를 반환합니다. } 결과 객체에는 다음 속성이 포함됩니다.

배열 일련 번호: 일치 결과를 나타내며, 0은 일치하는 텍스트, 1은 오른쪽에서 오른쪽으로 첫 번째 괄호의 일치 결과, 2는 다음과 같습니다. 두 번째 괄호 등

index 속성: 일치하는 텍스트가 일치하는 소스의 시작 위치에 있음을 나타냅니다.

입력 속성: 일치하는 소스를 나타냅니다.

②Regular 'g' 속성이 있는 표현식은 전역 일치를 수행하고, 문자열에서 일치하는 모든 개체를 찾고, {string array }를 반환합니다. 배열 요소는 문자열에서 일치하는 각 개체를 포함하고, 정규식 대괄호 안에 문자열을 포함하지 않습니다. 인덱스 및 입력 속성을 제공하지 않습니다.

예:

// 1.单个匹配
var s = 'a1b2c3d4';
var mc = s.match(/\d+/); // => 获取第一个正则匹配的结果
if (mc != null) {
    console.log(mc.index); // => 1 :匹配结果在匹配源的起始位置
    console.log(mc.input) // => a1b2c3d4 :匹配源
    console.log(mc[0]); // => 1 :获取匹配到的结果
}
// 2.全局匹配
var mcArray = s.match(/\d+/g); // => 获取全部正则匹配的数字
if (mcArray != null) {
    for (var i = 0,len=mcArray.length; i < len; i++) {
        var mc=mcArray[i];
        console.log(mc); // => 1,2,3,4 :获取匹配到的结果
    }
}
// 3.带括号的匹配
s = &#39;a1b2c3d4&#39;;
mc = s.match(/[a-z]([1-9])/); // => 获取第一个正则匹配的结果
if (mc != null) {
    console.log(mc.index); // => 0 :匹配结果在匹配源的起始位置
    console.log(mc.input) // => a1b2c3d4 :匹配源
    console.log(mc[0]); // => a1 :序号0表示匹配到的结果
    console.log(mc[1]); // => 1 :序号1表示第一个括号内的子匹配结果
}

4.8 replacement(regexp, replacementStr): 정규식과 일치하는 하위 문자열을 바꾸고 대체된 문자열을 반환합니다.

매개변수:

①regexp {regexp }: 정규식. 예:/d+/

②replaceStr {문자열 함수}:

1)若是字符串,表示替换的字符串,匹配到字串都替换成此字符串;

字符串中的$字符有特殊的含义:

$1,$2 … $99 :表示①参从左到右圆括号的匹配子项

$& :表示整个①参匹配的子项

$$ :美元符号

2)若是函数,表示每个匹配结果都调用此函数,函数的唯一参数为匹配结果,并返回一个替换结果。

返回值:

{string} 返回一个替换后的字符串

示例:

var oldStr = &#39;a1b2c3d4&#39;;
// 1.正则匹配到【所有】数字,替换成:&#39;,&#39;逗号
var newStr = oldStr.replace(/\d+/g, &#39;,&#39;);
console.log(newStr); // => a,b,c,d,
// 2.正则匹配到【所有】数字,替换成:匹配结果 + &#39;,&#39;逗号
newStr = oldStr.replace(/\d+/g, &#39;$&,&#39;);
console.log(newStr); // => a1,b2,c3,d4,
// 3.正则匹配到【所有】数字,每个匹配结果都调用函数,并返回替换后的结果
newStr = oldStr.replace(/\d+/g, function (word) {
    if (word % 2 == 0) {
        return &#39;偶&#39;;
    }
    return &#39;奇&#39;;
});
console.log(newStr); // => a奇b偶c奇d偶

4.9 search(regexp) :返回查找正则表达式第一个匹配的位置
参数:

①regexp {regexp} :正则表达式。eg:/\d+/

返回值:

{int} 返回第一个匹配的结果的位置;若没找到匹配结果返回-1

示例:

console.log( &#39;abcd&#39;.search(/\d+/) ); // => -1 :没有找到数字
console.log( &#39;abcd1234&#39;.search(/\d+/) ); // => 4 :位置序号为4,返回第一个数字的位置

4.10  slice(start, |end):返回从字符串start位置到end前一个位置的子串
参数:

①start {int} :子串提取的开始位置索引(包括此位置的字符)。

若数字为负,表示从字符串尾部开始计算。如:-1表示倒数一个字符串,-2表示倒数第二个字符。

②end {int} 可选:子串提取的结束位置索引(不包括此位置的字符)。

若数字为负,表示从字符串尾部开始计算。如:-1表示倒数一个字符串,-2表示倒数第二个字符。

若省略此参数,返回从start位置到结束的所有字符。

注意:

子串的提取顺序是从左到有,若start索引位置大于end索引位置,将返回一个空字符串。

返回值:

{string} 返回从字符串start位置到end前一个位置的子串。

示例:

var s = &#39;abcdefg&#39;;
console.log( s.slice(1) ); // bcdefg :省略end参数,结束位置为末尾
console.log( s.slice(1, 3) ); // bc :返回从位置序号1到位置序号2(end前一个位置)的子串
console.log( s.slice(-3) ); // efg :返回从倒数第三个开始到末尾的所有字符
console.log( s.slice(-3, -1) ); // ef :返回从倒数第三个开始到第二个(end前一个位置)的所有字符

4.11 split(delimiter, |arrayLength) :将字符串按照某种分隔符切分成一个由字符串组成的数组并返回
参数:

①delimiter {regexp | string} :指定的分隔符,可以为正则表达式或字符串。

②arrayLength {int} 可选 :分割数组的长度。若省略,返回所有分割的子串。

注意:

若分隔符在字符串的第一个或最后一个,将添加一个空字符串到返回的数组。

返回值:

{ string[] } 返回一个由字符串组成的数组。

示例:

console.log( &#39;a,b,c,d,e&#39;.split(&#39;,&#39;) ); // => ["a", "b", "c", "d", "e"]
console.log( &#39;,a,b,c,d,e,&#39;.split(&#39;,&#39;) ); // => ["", "a", "b", "c", "d", "e", ""] :分隔符在最前或最后面,会添加一个空字符串
console.log( &#39;a,b,c,d,e&#39;.split(&#39;,&#39;,3) ); // => ["a", "b", "c"] :返回前3个分割的子串
console.log( &#39;a1b2c3d4e&#39;.split(/\d/) ); // => ["a", "b", "c", "d", "e"] :将数字来做为分隔符

4.12 substr(start, |wordLength):返回从字符串start位置开始计算到wordLength个长度的子串
参数:

①start {int} :子串提取的开始位置索引(包括此位置的字符)。

若数字为负,表示从字符串尾部开始计算。如:-1表示倒数一个字符串,-2表示倒数第二个字符。

②wordLength {int} 可选 :提取字符的长度。若省略此参数,返回从start位置到结束的所有字符。

返回值:

{string} 返回提取的字符串

示例:

ar s = &#39;abcdefg&#39;;
onsole.log( s.substr(0) ); // =>  abcdefg :省略第二个参数,返回从位置序号0开始,一直到最后的字符
onsole.log( s.substr(0, 3) ); // => abc :返回从位置序号0开始,计数3个字符
onsole.log( s.substr(2, 4) ); // => cdef :返回从位置序号2开始,计数4个字符
onsole.log( s.substr(-2, 3) ); // fg :返回从倒数第二个字符串开始,计数3个(超过字符长度,就只返回可统计的字符)

4.12 substr(start, |wordLength):返回从字符串start位置开始计算到wordLength个长度的子串
参数:

①start {int} :子串提取的开始位置索引(包括此位置的字符)。

若数字为负,表示从字符串尾部开始计算。如:-1表示倒数一个字符串,-2表示倒数第二个字符。

②wordLength {int} 可选 :提取字符的长度。若省略此参数,返回从start位置到结束的所有字符。

返回值:

{string} 返回提取的字符串

示例:

ar s = &#39;abcdefg&#39;;
onsole.log( s.substr(0) ); // =>  abcdefg :省略第二个参数,返回从位置序号0开始,一直到最后的字符
onsole.log( s.substr(0, 3) ); // => abc :返回从位置序号0开始,计数3个字符
onsole.log( s.substr(2, 4) ); // => cdef :返回从位置序号2开始,计数4个字符
onsole.log( s.substr(-2, 3) ); // fg :返回从倒数第二个字符串开始,计数3个(超过字符长度,就只返回可统计的字符)

4.13 substring(start, |end) :返回从字符串start位置到end前一个位置的子串
参数:

①start {int} :子串提取的开始位置索引(包括此位置的字符)。数字不能为负数,若为负数按0来处理

②end {int} 可选:子串提取的结束位置索引(不包括此位置的字符)。数字不能为负数,若为负数按0来处理

返回值:

{string} 返回从字符串start位置到end前一个位置的子串。

示例:

var s = &#39;abcdefg&#39;;
console.log( s.substring(0) ); // =>  abcdefg :省略end参数,返回从位置序号0开始,一直到最后的字符
console.log( s.substring(0, 3) ); // => abc :返回从位置序号0开始到位置序号2(②参的前一个)的字符
console.log( s.substring(2, 4) ); // => cd :返回从位置序号2开始到位置序号3(②参的前一个)的字符
console.log( s.substring(-3, 3) ); // abc :参数若为负,就按数字0来处理,所以此参数实际返回位置序号0到位置序号3的字符

4.14 toUpperCase() :将字符串转换为大写并返回

4.15 toUpperCase() :将字符串转换为小写并返回

4.16 trim() :移除字符串开头和结尾处的空白字符并返回

위 내용은 JavaScript 문자열 개체 코드 예제에 대한 심층적인 이해의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.