Javascript 6일차

배열의 method에 대해서 알아보는 시간을 가져보자.

배열의 method에는 정말 다양한 기능들이 있다. 글자를 자르거나 합치거나 아니면 특정부분만을 따로 빼내 만드는 등

여러 기능들을 가지고 있다.

 

앞으로 알아볼 것은 string method 중에서 많이 사용하고 있는 method에 대해서 알아볼 것이다.

 

 

 

1 . split() 함수

string.split(separator, limit)

1) split() 함수는 문자열을 'separator'로 잘라서 'limit' 크기 이하의 배열에 잘라진 문자열을 저장하여 리턴합니다.

2) 여기서 나오는 'separator'는 필수요소는 아니고 문자열을 자를 때 구분해주는 구분자입니다. 값이 입력되지 않으면 문자열 전체를 배열에 담아서 리턴합니다.

3) 'limit' 도 필수요소가 아니고 최대 분할 갯수를 나타냅니다.

 

아래를 통해서 예시를 보도록 하자

let str = '010-1234-1234'
        arr = str.split();
        console.log(arr) // ['010-1234-1234']
===========================================================
 let str = '010-1234-1234'
        arr = str.split('-');
        console.log(arr) // ['010', '1234', '1234']

이처럼 split('-')을 넣어줌으로써 '-'을 구분자를 해서 배열을 나뉘게 해줍니다.

 

 

 

 

 

2. repeat() 함수 

string.repeat(count)

 

1) 현재 문자열을 주어진 횟수만큼 반복해 붙혀서 새로운 문자열을 만들어준다.

2) count는 문자열을 반복할 횟수를 적는 곳이다. 0과 양의 무한대 사이의 정수가 들어간다.

let str2 = "**"
        let star = str2.repeat(3)
        console.log(star); // ******

 

 

3. replace() 함수 

string.replace(searchValue, newValue)

 

1) replace() 함수는 searchValue, newValue로부터 파마리터를 입력받고 문자열에서 searchValue를 찾아서 newValue로 치환합니다.

2) replace() 함수는 문자열에서 첫번째로 찾은 문자열만 치환해주고 그 뒤에 나온 문자열은 치환해주지 않는다.

let str = 'bus, train, airplane, bus';
        let replaced_str = str.replace('bus', 'auto-mobile');

        console.log(str)          //bus, train, airplane, bus
        console.log(replaced_str) //auto-mobile, trian, airplane, bus

이런식으로 replaced_str을 보면 첫번째인 bus만 auto-mobile로 치환해주고 맨 마지막에 있는 bus는 치환해주지 않은 것을 확인할 수 있다. 또한 replace함수는 대소문자를 구별하기 때문에 작성할 때 유의해서 적어야 한다. 

 

 

3) replace() 함수를 통해 모든 문자열과 대소문자를 구별하지 않기 위해선 ' g ' 와 ' i ' 를 쓰면 된다.

let str = 'Bus, train, airplane, Bus';
        let replaced_str = str.replace(/bus/gi, 'auto-mobile');

        console.log(str)          //bus, train, airplane, bus
        console.log(replaced_str) //auto-mobile, trian, airplane, bus

이처럼 뒤에도 바꿔주기 위해선 bus -> /bus/g 로 바꾸면 뒤에꺼도 같이 바뀐다.

대소문자 구분은 ' i '를 사용해주면 되기 때문에 같이 적용시킬려면 /bus/gi 이런식으로 하면 다 적용이 된다.

 

 

 

 

4. includes() 함수

string.includes(searchString, length)

 

1) includes() 함수를 사용함으로써 문자열 내에 찾고자 하는 다른 문자열이 있는지 확인할 수 있습니다.

2) 'searchString' 은 이 문자열에서 찾을 다른 문자열을 넣으면 되고 'length' 은 'searchString' 을 찾기 시작할 위치를 넣으면 된다. 기본값은 0이다.

3) 문자열을 찾아내면 'true' , 못 찾으면 'false' 이다.  

 let arr = "안녕하세요 반갑습니다"
        console.log(arr.includes('안')) // true
        console.log(arr.includes('안',1)) // false

 

 

5. indexOf() 함수

string.indexOf(searchValue, position)

 

1) 문자열(string)에서 특정 문자열(searchvalue)을 찾고, 검색된 문자열이 '첫번째'로 나타나는 위치 index를 리턴한다.

2) 'searchValue' 는 필수 입력값으로 내가 찾고자 하는 문자열을 넣는 곳이다. 'position' 은 기본값이 0으로 고정되어 있고 기존 문자열에서 'searchValue' 를 찾기 시작할 위치를 선정하는 공간이다.

3) 찾는 문자열이 없을 경우에는 -1을 리턴한다. 대소문자를 구분하니 유의하도록!

 

 let phone = [0,1,0,2,5,1,9,1,4,3,1]
       let get = phone.indexOf(5)
       console.log(get) // 4

       let get = phone.indexOf(6)
       console.log(get) // -1

위 예시를 보도록 하자  phone.indexOf(5) 를 통해 phone 배열에 있는 숫자 중 5를 찾고자 하는 것이다. 내가 찾고자 하는 5가 배열 안에 있으면 배열내의 순서의 값이 나온다 ---> 4 

 

하지만 다른 예시를 보도록 하자. 내가 찾고자 하는 숫자인 6이 phone 배열 안에 존재하지 않으면 값은 -1 로 리턴해서 나온다는 것을 확실히 알아야 한다.

 

 

 

6. substring() 함수

string.substring(indexStart, indexEnd)

 

1) indexStart와 indexEnd로 문자열에서 골라낼 부분의 처음과 끝을 지정해서 지정한만큼 잘라낸다

2) substring() 은 indexStart 부터 문자를 추출하지만 indexEnd 가 포함되지 않아도 괜찮습니다. 특징은 아래와 같습니다.

 

  2-1 )  만약 indexEnd 가 생략된 경우, substring() 문자열의 끝까지 모든 문자를 추출합니다.

  2-2 )  만약 indexStart 가 indexEnd와 같을 경우, substring() 빈 문자열을 반환합니다.

  2-3 )  만약 indexStart 가 indexEnd보다 큰 경우, substring() 메서드는 마치 두 개의 인자를 바꾼 듯 작동하게 됩니다. 아래 예제를 보세요.

let jc = "juchan"
       let jang = jc.substring(5)
       console.log(jang)   // 2-1)  n
       
       
 let jc = "juchan"
       let jang = jc.substring(1,1)
       console.log(jang)  // 2-2) ' ' 빈 공간이 뜸
       
       
 
 let jc = "juchan"
       let jang = jc.substring(3,0)
       console.log(jang) // 2-3) juc

 

 

7. substr() 함수

string.substr(start, length)

 

1) 'start'로 시작 위치를 정하고 'length'만큼 잘라낸 문자열의 길이를 반환하는 함수이다.

2) 'start' 는 추출하고자 하는 문자들의 시작위치이다. 만약 음수가 주어진다면, 문자열 총길이 + 'start'의 값으로 취급한다. 예를 들면 'start' 에 -3을 설정하면, 자동적으로 문자열 총길이가 -3 으로 설정된다.

3) 'length' 은 옶션값, 추출한 문자들의 총 숫자를 뜻한다.

 

4) 'start' 는 문자 인덱스입니다. 문자열에서 첫 번째 문자의 인덱스는 0이며, 마지막 문자의 인덱스는 문자열 전체 길이에서 1을 뺀 값입니다. substr()는 'start'에서 문자들을 추출을 시작하여 'length'만큼 문자들을 수집합니다.

 

만약 'start' 값이 양수이고 문자열 전체 길이보다 크거가 같을 경우, substr()은 빈 문자열을 반환합니다. 

 

만약 'start'가 음수이면, substr()은 문자열 끝에서 'start' 숫자만큼 뺀 곳에서 시작하게 됩니다. 만약 'start'가 음수이고 절대값이 문자열 전체보다 크다면, substr()은 문자열의 0 인덱스부터 시작하게 됩니다. 

 

만약 'length'가 0 혹은 음수이면, substr()은 빈 문자열을 반환합니다. 만약 'length'가 생략되면, substr()은 문자열의 끝까지 추출하여 반환합니다. 

 

let str = 'abcdefghij';

console.log('(1, 2): '   + str.substr(1, 2));   // '(1, 2): bc'
console.log('(-3, 2): '  + str.substr(-3, 2));  // '(-3, 2): hi'
console.log('(-3): '     + str.substr(-3));     // '(-3): hij'
console.log('(1): '      + str.substr(1));      // '(1): bcdefghij'
console.log('(-20, 2): ' + str.substr(-20, 2)); // '(-20, 2): ab'
console.log('(20, 2): '  + str.substr(20, 2));  // '(20, 2): '

 

 

 

8. concat() 함수

string.concat(string2, string3....stringN)

 

1) string 문자열에 파라미터로 입력받은  string2, string3.. 문자열을 모두 이어붙인 문자열을 리턴하는 함수이다.

2) string2는 필수 입력값이고 나머지는 선택 입력값이다.

 

 

9. valuOf() 함수

string.valueof()

 

1) string의 vlaueOf method는 String 객체의 원시 값을 문자열 데이터 타입으로 반환 합니다. 

let x = new String('Hello world');
console.log(x.valueOf()); // 'Hello world' 가 보여집니다.

 

이렇게 배열의 method에 대해서 간단하게 자주 쓰이는 것들 위주로 정리해봤다.

이것말고도 더 다양한 method가 존재하지만 우선적으로 자주 쓰이는 것들을 익숙하게 만들고 다른 method를 공부해보도록 하자.