문자열 (string)

문자열이란?

일상생활에서 확인할 수 있는, 모든 글자의 나열입니다. 컴퓨터는 코드와 문자열을 구분하기 위해서 작은 따옴표(')나 큰 따옴표(")를 사용하여 문자열을 구분합니다.

 

문자열은 string입니다. 문자 하나는 character이며, char이라는 축약어로 부르기도 합니다. char가 포함된 메소드도 있습니다. ( 예: String.prototype.charAt() )

 

• str[index]

let str = 'DdalgiMeokgoshipda';
console.log(str[0]); // 'D'
console.log(str[4]); // 'g'
console.log(str[43434]); // undefined

 

• str[index]는 index로 접근은 가능하지만 새로 할당하지 않는 이상, 값을 바꿀 수는 없습니다 (read-only)

  

 

• + 연산자를 사용할 수 있습니다. string 타입과 다른 타입 사이에 + 연산자를 쓰면, string 형식으로 변환합니다 (toString)

  

  • str1.concat(str2, str3...); 메소드도 사용하여 더할 수 있습니다 -- 배열에서 배열을 합칠 때 자주 사용하는 메소드 입니다

 

• str.length 는 문자열의 전체 길이를 반환합니다
• .indexOf 는 어디열부터 시작인지 인덱스를 알려주는 메소드입니다

'bryanteo'.indexOf('teo'); // 5 가 나옵니다. 다섯번째 열부터 teo가 시작이기 때문입니다.

'bryanteo'.indexOf('cat'); // -1 이 나옵니다. cat이라는 문자가 없기 때문입니다.

• indexOf 메소드로 해당 문자열이 포함 되어있는지 아닌지를 찾을 수 있습니다
  
  

  if(str.indexOf('mozilla') === -1) {  /// 문자열을 포함하지 않을 때
  
  }
  
  if(str.indexOf('mozilla') !== -1){  /// 문자열을 포함하고 있을 때
  
  }

 

• 'strawberry'.lastIndexOf('r'); // 8 뒤에서 부터 'r'의 인덱스를 찾고 그 인덱스를 반환합니다
• str.includes(searchValue) -- 해당 문자열이 있는지 없는지 true, false를 반환합니다

 

• str.split(seperator) -- seperator에 따라 배열로 나눠서 반환하는 메소드입니다

  let str = 'Ddeokbokki meokgo sip da';
  console.log(str.split(' '));
  //['Ddeokbokki', 'meokgo', 'sip', 'da']
  ​

 

• str.substring(start, end) -- 시작과 끝 인덱스 구간의 문자열을 반환할 때 사용합니다

  let str = 'abcdefg';
  console.log(str.substring(0,3)); // 'abc' -- 3은 포함하지 않고, 012만 가져옵니다
  console.log(str.substring(3,0)); // 'abc'
  console.log(str.substring(1,4)); // 'bcd'
  console.log(str.substring(-1,4)); // 'abcd' 음수는 0으로 취급합니다
  console.log(str.substring(0,200)); // 'abcdefg' index 범위를 초과하면 마지막 인덱스까지 반환합니다​

 

• str.toLowerCase() / str.toUpperCase() -- 소문자와 대문자로 변환하는 메소드입니다. 새로 할당하지 않는 이상, 값을 바꿀 수는 없습니다 (read-only). 꼭 () 괄호를 넣어줘야 합니다

 

• str.slice() 는 문자를 잘라서 추출하는 메소드입니다

  let str = 'bryanteo';
  str.slice(0,5); // 'bryanteo'에서 'bryan'를 추출합니다. 
  // 0~부터 ~마지막에 쓰는 숫자 전까지 나옵니다.
  
  // 어느 문자열부터 쭉 추출하고 싶다면, 
  str.slice(5) // 이렇게만 해도 'teo'를 추출합니다.​

• str.trim() 메서드는 문자열 양 끝의 공백을 제거합니다. 새로 할당하지 않는 이상, 값을 바꿀 수는 없습니다 (read-only)

  const hello = '     Hello World!    ';
  console.log(hello.trim()); // 'Hello World!';​

 

• str.match()  메서드는 특정 텍스트 안에서 찾고자 하는 문자, 문자열, 정규식 등이 있는지 찾는 함수입니다. 이 메서드는 찾는 문자열을 반환합니다

let str = 'match function is interesting';

alert(str.match('match');
// 'match'라는 문자열이 있다면 alert창을 출력

if (str.match('match') === 'match'){
  console.log('매치라는 단어가 있군!!')
}

• str.replace() 메서드는 특정 문자를 다른 문자로 치환할 수 있습니다. 찾을 문자열과 변경할 문자열을 괄호안에 써주면 됩니다. str.replace("찾을 문자열", "변경할 문자열")

  let str = '가나다라마바사 가나다라';
  let result = str.replace('가', '나');
  
  console.log(result) // '나나다라마바사 가나다라​

   
  • 보시는 것처럼 맨 앞의 '가' 문자가 '나'로 변환되었습니다. 하지만 뒤의 '가'는 변환되지 않았습니다. replace()함수는 제일 먼저 일치하는 패턴만 변환 후 바꿀뿐 모든 텍스트를 바꾸지 않기 때문입니다
  • str의 모든 '가'를 '나'로 바꾸고 싶다면, 정규 표현식을 사용하면 됩니다. 정규 표현식을 사용하면 정해진 규칙을 사용해 모든 문자를 변환할 수도, 숫자만 변환하거나 맨 처음 또는 맨 뒤만 변환할 수도 있습니다

    let str = '가나다라마바사 가나다라';
    let result = str.replace(/가/gi,'나');
    
    console.log(result); // '나나다라마바사 나나다라'​

    여기서 꼭 알아야 할 점은 나누기(/)표시 안에 넣는 텍스트의 따옴표는 없어야 한다는 것입니다. gi는 다음을 의미합니다
    • g : 전체 모든 문자열을 변경 -- global
    • i : 영문 대소문자를 무시, 모두 일치하는 패턴 검색 -- ignore
    • 출처: https://webisfree.com/2014-01-09/[%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8]-replace()-%EB%AC%B8%EC%9E%90-%EB%B3%80%ED%99%98-%EC%B9%98%ED%99%98

정규 표현식(Regular Expression)

정규 표현식은 문자열에 나타는 특정 문자 조합과 대응시키기 위해 사용되는 패턴입니다. 자바스크립트에서, 정규 표현식 또한 객체입니다.  이 패턴들은 RegExp의 exec 메소드와 test 메소드  ,그리고 String의  match메소드 , replace메소드 , search메소드 ,  split 메소드와 함께 쓰입니다 .

정규 표현식을 줄여서 '정규식'이라고도 합니다.

-- 출처 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Regular_Expressions

정규 표현식 - JavaScript | MDN

 

Template literals 

템플릿 리터럴은 내장된 표현식을 허용하는 문자열 리터럴 입니다.

백틱 - 단일 문자열로 연결 시켜줍니다.

`-${i}`

alert( "the result is ${1 + 2}" ); // the result is ${1 + 2} (큰따옴표는 확장 기능을 지원하지 않습니다.)

var a= 5;
var b = 10;

console.log(`fifteen is ${a+b} and not ${2 * a + b}.`);

"fifteen is 15 and not 20."

 

${...} 안에 표현식을 넣고 문자열을 포함한 전체를 백틱으로 감싸면, 평가된 표현식이 문자열로 반환됩니다.

let name = "Mari";

// 표현식은 숫자 1입니다.
alert (`hello ${1}`}; // hello 1

// 표현식은 문자열 "name"입니다. *********
alert (`hello ${"name"}`); // hello name

// 표현식 안에 변수가 들어가 있기 때문에, 이 변수가 평가되어 전체 문자열이 반환됩니다.
alert (`hello ${name}`); // hello Mari

 

• 공백 문자: 탭 문자(\t), Carriage return(\r\n) 및 return 문자(\n)

I'd use the word 'return' to remember, the r comes before the n.

\n과 \r\n의 차이

무슨 말인지 아직 잘 모르겠지만, \n\r을 하는게 보기에도 좋고 출력값을 읽는데도 좋다고 합니다.

참고글 : https://m.blog.naver.com/PostView.naver?isHttpsRedirect=true&blogId=nkkh159&logNo=220837224425