웹 프로그래밍 기초/객체

indexOf(), search()

별초롱언니 2025. 4. 9. 10:45

indexOf(), search()

상당히 동일한 기능이나 search() 메서드는 인수가 하나이고 훨씬 더 강한 검색 값을 갖는다. 

** search의 인수에는 정규표현식을 작성한다. 

 

문자열 일부 추출

총 3가지 방법이 있다. 

slice()는 문자열의 일부를 추출하고 추출된 부분을 새 문자열로 반환한다. 해당 메서드는 시작 인덱스와 끝 인덱스의 두 매개변수를 사용한다. 인수가 음수면 문자열의 끝에서부터 계산한다. 만약 두번째 인자가 없다면 문자열의 나머지 부분을 잘라낸다.

 

substring()은 slice()와 비슷하나 음수 인덱스를 허용하지 않는다.

 

substr()도 slice()와 유사하나 두번째 인수가 추출될 부분의 길이를 지정한다. 첫번째 인수가 음수면 문자열의 끝부터 계산하며, 두번째 인수는 문자의 길이를 나타내므로 음수가 올 수 없다. 

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    let str01 = "JavaScript objects are containers for name values, called properties and methods.";

    let position01 = str01.indexOf("containers",15);
    document.write(`1. indexOf( 'containers', 15 ) : ${position01} <br>`);
    
    let position02 = str01.search("containers");
    document.write(`2. search( 'containers' ) : ${position02} <br>`);


    let result01 = str01.slice(7,13);
    document.write(`3. slice(7,13) : ${result01} <br>`);

    let result02 = str01.slice(-12,-6);
    document.write(`4. slice(-12,-6) : ${result02} <br>`);

    let result03 = str01.slice(7);
    document.write(`5. slice(7) : ${result03} <br>`);

    let result04 = str01.slice(-12);
    document.write(`6. slice(-12) : ${result04} <br>`);

    let result05 = str01.substring(7,13);
    document.write(`7. substring(7,13) : ${result05} <br>`);

    let result06 = str01.substr(7,6);
    document.write(`8. substr(7,6) : ${result06} <br>`);
  </script>
</body>
</html>