JavaScript | 문자열

SURI·2021년 11월 10일

1. 문자열


1.1 Achievement Goals

  • 문자열의 속성과 메소드를 이용해 원하는 형태로 만들 수 있다.

    • 문자열의 length라는 속성을 활용해 길이를 확인할 수 있다. str.length
    • 문자열의 글자 하나하나에 접근할 수 있다. str[1]
    • 문자열을 합칠 수 있다. word1 + " " + word2
    • 문자열을 원하는 만큼만 선택할 수 있다. str.slice(0, 3) 또는 str.substring(0, 3)
    • 영문을 모두 대문자로 바꿀 수 있다. str.toUpperCase()
    • 영문을 모두 소문자로 바꿀 수 있다. str.toLowerCase()
    • 문자열 중 원하는 문자의 index를 찾을 수 있다 str.indexOf('a') 또는 str.lastIndexOf('a')
    • 문자열 중 원하는 문자가 포함되어 있는지 알 수 있다. str.includes('a')
  • Advanced Challanges

    • 띄어쓰기 (" ") 로 문자열을 구분하여 배열로 바꿀 수 있다. str.split(" ")
    • 위의 배열의 요소 사이에 띄어쓰기 (" ") 넣어 다시 문자열로 바꿀 수 있다. str.split(" ").join(" ")

1.2 문자열 기초

  • 문자열은 모든 글자의 나열이다.
  • 코드에서는 문자열을 구분하기 위해 작은 따옴표나 큰 따옴표를 사용한다.
  • 문자열 string과 문자 하나인 character의 구별도 염두해두자.

1.3 문자열 다루기

Accessing a character

  • str[index]
  • index로 접근할 수 있지만 쓸 수 없는 read-0nly이다.
var str = 'CodeStates';
console.log(str[0]); // 'C'
str[0] = 'G'; // 적용되지 않는다.

Concatenating strings

  • + 연산자를 써서 문자열을 연결할 수 있다.
  • string과 다른 타입을 + 연산자로 합치면, 강제적으로 string 타입으로 변환된다.
  • 참고로 str1.concat(str2, str3...) 메소드도 연결로 사용할 수 있다.
console.log('Code' + 7); // 'Code7'

Length property

  • 문자열의 길이를 넘버 타입으로 변환한다.
var str = 'CodeStates';
console.log(str.length); // 10

Method

  • str.indexOf(searchValue)
    • arguments : 찾고자 하는 문자열
    • return value : 처음으로 일치하는 index를 반환하고, 찾는 문자열이 없으면 -1을 반환한다. 나중에 현장에서도 사용하니 기억해두자.
    • lastIndexOf는 문자열 뒤에서 부터 찾는다.
    • str.includes(searchValue) 이건 true/false를 리턴한다.
'Blue Whale'.indexOf('Blue'); //0
'Blue Whale'.indexOf('blue'); //없으므로 -1 리턴
'canal'.lastIndexOf('a'); // 3 끝에 있는 a는 3번 index에 있다.
  • str.split(separator)
    • arguments : 분리 기준이 되는 문자열
    • return value : 분리된 문자열이 포함된 배열이다.
    • csv 형식 처리에 유용하다.
      • comma-separated value
      • 예제에서 \n 줄바꿈 문자를 분리 연산자로 사용하고 그 다음 쉼표를 사용했었다.
var str = 'hello nice to meet you';
console.log(str.split(' '));
// ['hello', 'nice', 'to', 'meet', 'you']
let csv = '블라블라';
let lines = csv.split('\n');
lines[0].split(',');
  • str.substring(start, end)
    • arguments : 시작과 끝 index를 넣는다.
    • return value : 시작과 끝 index 사이의 문자열을 넣는다. 단, 끝 index는 포함하지 않는다.
    • start/end 순서가 바뀌어도 상관 없다.
    • 음수가 입력되면 0으로 취급된다.
    • index 범위에서 벗어나면 끝 index로 취급된다.
    • str.slice(start, end)와 비슷하나 몇 가지 차이점은 있다. slice가 좀 더 광범위하게 사용될 수 있다.
var str = "hello suri";
console.log(str.substring(3, 0)); // 'hel'
  • str.toLowerCase()/str.toUpperCase()
    • IMMUTABLE
      • 원본이 변하지 않는다.
      • 모든 string method는 immutable이다
      • array method에서는 immutable/mutable 여부를 기억해야 한다.
    • arguments는 없다.
    • return value : 대, 소문자로 변환된 문자열이 나온다.
var str = 'hello'
str.toUpperCase(); // 'HELLO'
console.log(str) // 'hello' immutable이다.

Learn yourself

  • trim
  • 공백문자 : 탭문자\t Carriage return\r\n 리턴 문자\n
  • match, replace, 정규표현식

2.Checkpoint

2.1

  • 개발을 공부하면서 나의 코드를 정확한 용어로 설명할 수 있어야 한다. 그런 습관을 들여야 한다. 페어프로그래밍 때 기술 면접을 보듯이 훈련을 해야 한다.
  • =는 할당연산자이고 ===는 동치연산자다.

2.2

  • 쉼표를 사용해서 let 키워드를 한 번만 사용하고 여러 개의 변수를 선언할 수도 있고, 할당할 수도 있다.
  • 코드를 작성하는 다양한 방법이 있을 때는 코드 컨벤션에 따르면 된다. 하나의 방식으로 통일하여 사용해야 한다.

2.3

  • parseFLoat()라는 새로운 메소드가 나왔다. parseInt()에 대한 구글링도 추천했다.
  • 매개변수에 임의로 특정한 값을 할당하는 방식은 지양하라.
  • Number() 함수

2.5

  • bracket notation : 문자열의 n번째 문자를 조회하기 위해 대괄호를 사용한다. 배열과 객체에도 동일한 방식이 사용된다.

2.6

  • 함수 그 자체와 결과값은 서로 다르다는 것 이해하기
  • 함수의 매개변수와 함수 밖의 선언된 변수가 동일한 경우를 질문했는데 scope 개념을 알려주었다. 변수 효력의 범위라고 생각하면 될까?
let word = returnWordWithJoy; // 함수 자체를 할당하고 있는 것. word를 출력해보면 함수가 나오게 된다. word()로도 사용할 수 있냐는 질문도 흥미로움.

2.7

  • 조건문을 작성할 때는 순서가 중요하다. 교집합을 먼저 작성해줘야 한다.
  • 소괄호는 사칙연산에서 우선순위를 설정할 때 쓰이고, 중괄호는 block, 함수를 선언할 때, 조건문 작성할 때에 쓰인다.
  • 개발자는 모든 경우의 수, 엣지 케이스를 다 생각해서 작성을 해야 하는데 if만 사용하게 되면 고려하지 못한 상황들이 있을 가능성이 높기 때문에 else if 코드가 더 좋다. 결론은, 모든 경우의 수를 다 살피는 편이 좋다.

https://www.notion.so/FAQ-d9d6ee41b47447979c0741fb11f5d2d3

profile
Every step to become a better version of me 🚶‍♂️ 블로그 이사중

0개의 댓글