>  기사  >  웹 프론트엔드  >  예: JavaScript를 사용하여 문자열 연산(일부 문자열 함수)_기본 지식

예: JavaScript를 사용하여 문자열 연산(일부 문자열 함수)_기본 지식

WBOY
WBOY원래의
2016-05-16 19:19:02982검색

문자열 값을 조작하는 것은 일반 개발자가 직면해야 하는 일상적인 일입니다. 문자열에서 내용의 일부를 추출하거나 문자열에 특정 문자가 포함되어 있는지 확인하는 등 문자열을 조작하는 구체적인 방법이 많이 있습니다. 다음 JavaScript 함수는 개발자에게 필요한 모든 기능을 제공합니다.

 • concat() – 두 개 이상의 텍스트 문자를 연결하고 새 문자열을 반환합니다.

  • indexOf() – 문자열에서 하위 문자열이 처음 나타나는 인덱스를 반환합니다. 일치하는 항목이 없으면 -1이 반환됩니다.

  • charAT() – 지정된 위치의 문자를 반환합니다.

 • lastIndexOf() – 문자열에서 마지막으로 나타나는 하위 문자열의 인덱스를 반환합니다. 일치하는 항목이 없으면 -1을 반환합니다.

 • match() – 문자열이 정규 표현식과 일치하는지 확인합니다.

  • substring() – 문자열의 하위 문자열을 반환합니다. 들어오는 매개변수는 시작 위치와 끝 위치입니다.

 • replacement() – 정규식과 일치하는 문자열을 찾은 다음 일치하는 문자열을 새 문자열로 바꾸는 데 사용됩니다.

  • search() – 정규식 일치 검색을 수행합니다. 검색이 성공하면 문자열에서 일치하는 인덱스 값이 반환됩니다. 그렇지 않으면 -1이 반환됩니다.

  • Slice() – 문자열의 일부를 추출하고 새 문자열을 반환합니다.

  • Split() – 문자열을 하위 문자열로 나누어 문자열 배열로 변환합니다.

  • length() – 문자열의 길이를 반환합니다. 문자열의 길이는 포함된 문자 수를 나타냅니다.

  • toLowerCase() – 전체 문자열을 소문자로 변환합니다.

  • toUpperCase() – 전체 문자열을 대문자로 변환합니다.

참고: concat , match , replacement 및 search 기능은 JavaScript 1.2에 추가되었습니다. 다른 모든 기능은 JavaScript 1.0에서 제공되었습니다.

JavaScript에서 이러한 기능을 어떻게 사용하는지 살펴보겠습니다.하단의 현대적인 是사용到了前면提到的所有函数:

 함수 manipulateString(passedString1, passedString2) { 
var concatString;
// concat에 전달된 문자열은 첫 번째 문자열의 끝에 추가됩니다.
concatString = passedString1.concat(passedString2); 
경고(concatString);
// 첫 번째 단어가 Tony이므로 다음 if 문은 true가 됩니다.
if (concatString.charAt(3) == "y") { 
alert("Character Found!"); }
// 문자 n의 마지막 위치는 10입니다.
alert("n의 마지막 색인은 다음과 같습니다."   concatString.lastIndexOf("n"));
// 정규 표현식은 하위 문자열을 찾아 바꾸는 데 사용됩니다.
var newString = concatString.replace(/Tony/gi,"General");
// 다음 결과는 패튼 장군에게 경의를 표하세요.
alert("경례하세요 "   newString);
// 일치 함수는 발견된 모든 일치 항목이 포함된 배열을 반환합니다.
matchArray = concatString.match(/Tony/gi); 
for (var i=0; i  
alert("Match found: "   matchArray[i]); 

// 정규 표현식이 발견되었는지 확인합니다. a -1은 no를 나타냅니다.
 if (newString.search(/Tony/) == -1) { 
alert("문자열을 찾을 수 없음"); 
} else { 
alert("문자열을 찾았습니다.");

// 문자열의 일부를 추출하여 새 변수에 저장합니다.
var sliceString = newString.slice(newString.indexOf("l") 2,newString.length);
alert( SliceString); 
// split 함수는 공백으로 구분된 각 값을 포함하는 새 배열을 생성합니다.
stringArray = concatString.split(" "); 
(var i=0; i  
alert) (stringArray[i]; 

alert(newString.toUpperCase()); 
alert(newString.toLowerCase()); 


  下면是执行上面的代码得到的结果:

  Tony Patton

  문자 발견!

  n의 마지막 색인: 10

  일치 항목: Tony

  패튼 장군에게 경의를 표하세요

  문자열을 찾을 수 없음

  Patton

  Tony

  Patton

  GENERAL 패튼

  일반 패튼

  示例代码把所有这些提到的函数殊字符

  除了这些函数 外,还有很多 特殊字符可以用来表示关键的效果。这些特殊字符包括:

  • t – 跳格键

  • b - 退格 / 删除

  • r – 回车

  • n – 换行

  • f – 换页

  特殊字符最常见적용途就是格式化输流.例如,你可能需要재판 중 插入一个换行来正确地显示一个值。而且,在换行时也需要回车。在一些平台上,“ n ”已经足够产生换行效果了,而在一些机器上要正确地显示一个换行则需要" rn "。다음 예에서는 여러 줄로 구성된 창에 표시되는 특수 문자를 보여줍니다.


var 출력 = null
출력 = "특수 문자"
출력 = "n"; 출력 = "=============";
출력 = "n"
출력 = "\t - 탭"
출력 = "n ";
출력 = "\b - 백스페이스/삭제";
출력 = "n";
출력 = "\r - 캐리지 리턴";
출력 = "n"; "\n - 줄바꿈";
출력 = "n";
출력 = "\f - 양식 피드";
경고(출력); 이전 예에서는 concat 함수를 사용하지 않고 더하기 기호를 사용하여 문자열을 연결했습니다. 그 이유는 간단합니다. concat 함수의 경우 각 작업에는 새 변수가 필요합니다. 반대로 여기서 사용하는 방법은 새 변수가 필요하지 않고 원래 값을 확장합니다. 또한 예제에서는 이스케이프 문자를 사용하여 특수 문자를 올바르게 표시합니다. 시스템은 백슬래시를 특수 문자가 뒤에 오는 신호로 해석하지만 두 개의 백슬래시가 이 작업을 무효화합니다. 출력의 각 문자는 개행 특수 문자를 사용하여 새 줄에 표시됩니다.
도구 상자에 추가
특수 문자와 함수를 다른 JavaScript 기술과 결합하여 많은 문제를 해결할 수 있습니다. 그러한 사례 중 하나가 JavaScript 클라이언트 측 양식 유효성 검사에 대한 것이며, 이 기사에서 제안한 방법을 사용하여 양식 유효성 검사를 쉽게 구현할 수 있습니다.
양식이 제출되면 다음 코드가 호출됩니다. 제출할 양식에는 이름, 주소, 우편번호의 세 가지 필드가 포함되어 있습니다. 작업을 단순하게 유지하기 위해 각 필드를 비워둘 수 없으며 우편번호가 숫자여야 한다는 점만 확인합니다. 다음 JavaScript 코드는 이 기능을 수행합니다.
1 function 유효성 검사() {
2
3 var doc = document.forms[0];
4
5 var msg = ""
 6
7 if (doc.Name.value == "") {
8
9 msg = "- 이름이 없습니다n"
10
11}
12
13 if (doc.Address.value == "") {
14
15 msg = "- 주소가 없습니다."
16
17 }
18
19 if (doc.ZipCode.value == "") {
20
21 msg = "- 우편번호가 없습니다n"
22
23 }
24
25 var zip = new String(doc.ZipCode.value);
 26
 27 if (zip.search(/^[0-9][0-9][0-9][0-9][ 0 -9]$/)==-1) {
 28
29 msg = "- 유효한 우편번호를 입력하세요."
30
31 }
32
33 if ( msg == "") {
34
35 doc.submit;
36
37 } else {
38
39 msg = "다음 유효성 검사 오류를 수정하고 다시 제출해 주세요. :nn" msg;
40 경고(msg);
42
43}
45
46
47
사용자에서 이 함수는 양식이 제출될 때 호출됩니다. 함수 호출은 HTML 버튼의 onSubmit 이벤트에서 구현됩니다.




유효성 검사 기능은 각 필드가 비어 있는지 확인합니다. null 값이 발견되면 유효성 검사 메시지 변수 msg에 오류 메시지가 추가됩니다. 또한 우편번호 필드의 형식을 확인하는 데 정규식이 사용됩니다. 여기서는 5자리 미국 우편번호만 허용됩니다. 오류가 발견되면(즉, msg 변수가 비어 있지 않은 경우) 프로그램은 오류 메시지를 표시합니다. 그렇지 않으면 프로그램이 양식을 제출합니다.

강력한 언어
JavaScript는 강력한 애플리케이션을 구축하는 데 사용할 수 있는 모든 기능을 갖춘 언어로 발전했습니다.이는 웹 인터페이스의 비연결적 특성을 완벽하게 보완하므로 웹 서버와 상호 작용하지 않고도 많은 클라이언트 측 작업을 완료할 수 있습니다.

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