코딩물고기

[J] JavaScript & jQuery 공부하기 #17 본문

코딩물고기의 IT월드

[J] JavaScript & jQuery 공부하기 #17

코딩하는물고기 2019. 4. 5. 11:54
728x90

경기도 일자리 재단에서 수업을 배웠고 자료를 참고하여 공부를 해보았다.

 

19. string

  - string 객체 생성과 속성
    * string 객체
    - JavaScript에서 문자열을 다루는 객체

    * string 객체 생성 방법
    - 문자열을 큰따옴표나 작은따옴표로 싸서 객체 생성
    < script type="text/javascript">
      var str1 = "abcde";
      var str2 = 'abcde';
    </ script>
    - string 생성자 함수를 사용해 객체 생성
    < script type="text/javascript">
      var str3 = new String("abced");
    </ script>

    * 문자열 내 큰따옴표/작은따옴표 자체를 문자로 사용한 경우
    - 문자열을 큰따옴표로 묶어주는 경우 > 작은따옴표를 이용하여 삽입
      문자열을 작은따옴표로 묶어주는 경우 > 큰따옴표를 이용하여 삽입
      < script type="text/javascript">
        var str3 = "ab'c'def";
      </ script>
    - 문자열을 큰따옴표로 묶어주고 문자열 사이에 큰따옴표 문자를
      사용할 경우 > \라는 escape 문자를 이용하여 삽입
      < script type="text/javascript">
        var str4 = "ab\"c\"def";
      </ script>

    * 특수문자의 사용
      \ = '
      \" = "
      \\ = \
      \b = backspace
      \t = horizontal tabulator (수평)
      \r = carriage return
      \f = form feed
      \v = vertical tabulator (수직)

    * string 객체의 속성
      - length : string 객체의 길이
      - constructor : string 객체의 생성자 함수
        < script type="text/javascript">
          str1.constructor
        </ script>
      - prototype : string 객체에 속성과 메소드 추가
        < script type="text/javascript">
          string.prototype.getFirst = function(){
            return this.charAt(0);
          };
        </ script>

      - indexOf()
        : 원본 문자열에서 인자로 지정된 문자열이 시작되는 인덱스 번호를 반환
        : 인자로 지정된 문자열을 찾지 못하면 -1을 반환
        < script type="text/javascript">
          var testStr = "I am a student";
          var index = testStr.indexOf("am");
        </ script>
        > 결과 2

      - lastIndexOf()
        : 원본 문자열에서 인자로 지정된 문자열이 마지막으로 찾아진 인덱스 번호를 반환
        : 인자로 지정된 문자열을 찾지 못하면 -1 반환
        < script type="text/javascript">
          var testStr = "I am a am student";
          var index = testStr.lastIndexOf("am");
        </ script>
        > 결과 7

      - indexOf(str, position)
        : position이 지정되지 않으면 0번 인덱스부터 인자로 지정된 문자열을
        검색하고, position을 지정하면 해당 인덱스부터 검색함
        < script type="text/javascript">
          var testStr = "I am a student am";
          var index = testStr.indexOf("am",4);
        </ script>
        > 결과 7

      - concat()
       : 두 개 혹은 그 이상의 문자열을 연결하며, 연결된 문자열 반환
       < script type="text/javascript">
         var str1 = "javascript";
         var str2 = "Fighting";
         var str3 = str1.concat(str2);
       </ script>
       > 결과 : str3 : Javascript Fighting

      - charAt()
        : 인자로 주어진 인덱스 위치에 있는 문자 하나 반환
        < script type="text/javascript">
          var str1 = "Javascript";
          var str2 = str1.charAt(4);
        </ script>
        > 결과 : str2:s

      - slice()
       : 첫 번째 인자로 주어진 인덱스 위치에 있는 문자부터
       두 번째 인자로 주어진 위치 바로 앞 문자까지 반환
       < script type="text/javascript">
         var str1 = "Javascript";
         var str2 = str1.slice(0,4);
       </ script>
       > 결과 : str2 : Java

      - split()
       : 인자로 지정된 문자열을 분리하여 문자열 배열을 반환
       < script type="text/javascript">
         var str1 = "aaa,bbb,ccc"
         var strArray = str1.split(",");
       </ script>
       > 결과 : ["aaa","bbb","ccc"]

      - replace()
       : 첫 번째 인자로 지정된 문자열을 두 번째 인자로 지정된 문자열로 치환
      < script type="text/javascript">
        var str1 = "Java Fighting";
        var str2 = str1.replace("Java", "Javascript");
      </ script>
      > 결과 str2 : Javascript Fighting

     - substring()
      : 첫 번째 인자로 지정된 인덱스 위치의 문자부터 두 번째 인자로 지정된
      인덱스 위치의 바로 앞 문자까지 반환합니다.
      < script type="text/javascript">
        var str1 = "Java Fighting"
        var str2 = "str1.substring(0,3)"
      </ script>
      > 결과 : str2 : jav

     - substr()
      : 첫 번째 인자로 지정된 인덱스 위치의 문자부터
      두 번째 인자로 지정된 길이 만큼 문자 반환
      < script type="text/javascript">
        var str1 = "Java Fighting"
        var str2 = str1.substr(0,4);
      </ script>
      > 결과 : str2 : java

     - toUpperCase()
      : 문자열을 대문자로 변경

     - toLowerCase()
      : 문자열을 소문자로 변경
      < script type="text/javascript">
        var str1 = "Javascript Fighting"
        var str2 = str1.toUpperCase();
        var str3 = str1.toLowerCase();
      </ script>
      > 결과 : str2: JAVACRIPT FIGHTING
               str3: javascript fighting

728x90
Comments