>  기사  >  웹 프론트엔드  >  JavaScript를 사용하여 문자열에서 숫자 추출

JavaScript를 사용하여 문자열에서 숫자 추출

WBOY
WBOY앞으로
2023-08-26 13:09:211719검색

使用 JavaScript 从字符串中提取数字

JavaScript에는 문자열에서 숫자를 추출하는 여러 가지 방법이 있습니다. 한 가지 방법은 match() 메서드와 정규식을 사용하여 문자열의 모든 숫자를 검색하는 것입니다. 또 다른 방법은 replace() 메서드와 정규식을 사용하여 문자열에서 숫자가 아닌 문자를 모두 제거하고 숫자만 남기는 것입니다.

몇 가지 예를 통해 각 방법을 이해해 봅시다.

match() 메소드와 정규 표현식을 사용하세요

정규 표현식은 여러 문자와 특수 문자를 조합하여 만들 수 있는 검색 패턴입니다. "/d+/" 검색 패턴을 사용하여 문자열에서 숫자를 검색할 수 있습니다. 'd+' 검색 모드에서 d는 0에서 9 사이의 숫자를 나타내고, '+'는 발견된 최소 한 자리 이상을 나타냅니다.

따라서 이 정규식을 JavaScript의 내장 일치 메서드에 대한 인수로 사용하여 주어진 문자열의 모든 숫자를 검색할 수 있습니다.

문법

사용자는 다음 구문에 따라 주어진 문자열에서 모든 숫자를 추출할 수 있습니다.

으아아아

위 구문에서는 주어진 문자열에서 숫자의 발생을 일치시키는 match() 메서드를 사용했습니다.

이 예에서는 숫자가 포함된 문자열을 만들었습니다. 그 후, 문자열에 있는 모든 숫자를 일치시키기 위해 g 플래그를 사용하여 정규 표현식을 생성하고 이를 문자열에서 일치시키기 위해 match() 메소드의 매개변수로 전달했습니다

match() 메서드는 정규식 일치를 기반으로 모든 숫자가 포함된 배열을 반환합니다.

으아아아

replace() 메소드와 정규 표현식을 사용하세요

정규식을 사용하여 숫자 및 기타 문자를 식별할 수 있습니다. 따라서 정규식을 사용하여 다른 문자를 식별하고 이를 빈 문자열로 대체합니다. 이 방법으로 숫자를 제외한 모든 문자를 제거하고 문자열에서 숫자를 추출할 수 있습니다.

문법

사용자는 다음 구문에 따라 교체() 메서드를 사용하여 문자열에서 숫자를 추출할 수 있습니다.

으아아아

위 구문에서 str은 숫자를 추출하려는 인용 문자열입니다. 또한 정규식 [^0-9]은 0~9를 제외한 모든 문자를 나타냅니다.

아래 예에서는 교체() 메서드를 사용하여 숫자를 제외한 모든 문자를 빈 문자열로 바꿉니다. 정규식을 첫 번째 매개변수로 전달하고 빈 문자열을 두 번째 매개변수로 전달합니다.

replace() 메서드는 숫자를 제외한 모든 문자를 빈 문자열로 바꾼 후 문자열을 반환합니다. 출력에서 match() 메서드와 같은 배열을 반환하지 않고 단일 문자열만 반환하는 것을 볼 수 있습니다.

으아아아

reduce() 메서드를 사용하여 문자열에서 숫자 추출

reduce()는 JavaScript의 내장 라이브러리 메서드입니다. 문자열을 문자 배열로 변환하고 문자 배열에 Reduce() 메서드를 사용할 수 있습니다. Reduce() 메소드는 배열 요소에 대한 작업을 수행하여 배열을 단일 요소로 줄이는 데 도움이 됩니다.

여기서 문자가 숫자인지 확인하고 이를 최종 요소에 추가합니다. 그렇지 않으면 빈 문자열을 추가합니다.

문법

사용자는 줄이기() 메서드를 사용하여 아래 구문에 따라 문자열에서 숫자를 추출할 수 있습니다.

으아아아

위 구문에서는 charArray와 함께 축소 메서드를 사용하고 있습니다. 콜백 함수를 첫 번째 매개변수로 전달하고 빈 문자열을 두 번째 매개변수로 전달합니다.

알고리즘

  • 1단계 - 스프레드 연산자를 사용하여 문자열을 문자 배열로 변환합니다.

  • 2단계 - charArray의 Reduce() 메서드를 사용하여 전체 배열을 숫자만 포함하는 단일 문자열로 줄입니다.

  • 3단계 - 축소된 문자열을 반환하는 축소() 메서드의 첫 번째 매개변수로 콜백 함수를 전달합니다.

  • 4단계 - 콜백 함수에서 첫 번째 매개변수로 단순화된 문자열인 numString을 전달하고, 두 번째 매개변수로 문자열의 문자열을 나타내는 배열 요소인 element를 전달합니다.

  • 5단계 - 콜백 함수에서 배열의 문자가 요소가 0에서 9 사이임을 의미하는지 확인합니다. 그렇다면 해당 문자는 numString에 추가되고 반환됩니다. 그렇지 않으면 numString이 변경되지 않고 반환됩니다.

  • 6단계 - numString의 초기값인 Reduce() 메소드의 두 번째 매개변수로 빈 문자열을 전달합니다.

  • 7단계 - 배열을 완전히 반복한 후 Reduce() 메서드는 numString의 최종 값을 반환합니다.

아래 예에서는 숫자가 포함된 문자열을 가져와 위의 알고리즘을 구현하여 문자열에서 숫자를 추출했습니다.

<html>
   <body>
      <h3>Using the <i>reduce() </i>method to extract the numbers from the string</h3>
      <div id = "output"> </div>
      <script>
         let output = document.getElementById("output");
         let string = "34gr345fr45";
         output.innerHTML += "Original String: " + string + "<br/>";
         let charArray = [...string];
         let numbers = charArray.reduce(function (numString, element) {
            let nums = "0123456789";
            if (nums.includes(element)) {
               return numString + element;
            }
            return numString;
         }, "");
         output.innerHTML +="<br> Number in the String: " + numbers + "<br/>";
      </script>
   </body>
</html>

在本教程中,我们讨论了从给定字符串中提取数字的三种方法。第一种方法是使用 match() 方法和正则表达式来搜索字符串中的所有数字。第二种方法使用 replace() 方法和正则表达式从字符串中删除所有非数字字符,只留下数字。第三种方法是使用reduce()includes()方法。仔细考虑哪种方法最适合特定情况非常重要。

위 내용은 JavaScript를 사용하여 문자열에서 숫자 추출의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 tutorialspoint.com에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제