1주일에 화, 목만 세션을 진행하기때문에 2일차라고 할 수 있다!
나홀로 JavaScript공부를 하고 있으니, 성취감도 없고 제대로 공부하고 있는지 감이 잡히지 않아서 좀 더 긴장감을 가지고!
방향을 제대로 잡고 공부하기 위해 신청하였다...!
기본적인 내용은 알고 있으니 중요한 내용 위주로 블로깅을 진행하고 싶다.
다시 정리하지 않으면 절대 머리속에 남질...않는다....😂
정규표현식 내용은 따로 블로깅할 예정이다. 이 정도 정리로 학습될 내용이 아니다...!
const str = 'Hello world';
console.log(str.substring(0, 3)); // 'Hel'
console.log(str.substring(3, 0)); // 'Hel'
console.log(str.substring(1, 4)); // 'ell'
console.log(str.substring(-1, 4)); // 'Hell'
console.log(str.substring(0, 20)); // 'Hello world'
공백을 자른다.
const hello = ' Hello world! ';
console.log(hello); // " Hello world! ";
console.log(hello.trim()); // "Hello world!";
자주 안쓰이다보니 머리에 잘 안 남는다...
\XXX 8진수 Latin-1 문자
\' 작은따옴표
\" 큰따옴표
\\ 역슬래시
\n 개행
\r 캐리지 리턴
\v 세로 탭
\t 탭
\b 백 스페이스
\f 폼 피드
\uXXXX 유니코드 코드포인트
\u{X} ... \u{XXXXXX} 유니코드 코드포인트
\xXX Latin-1 문자
문자열에 나타는 특정 문자 조합과 대응시키기 위해 사용되는 패턴
표현에는 두 가지 방식이 있다.
// 1. 리터럴
var re = /ab+c/;
// 2. 생성자 함수
var re = new RegExp("ab+c");
특수문자를 전부다 적기엔 양이 많고 몇가지만 적어본다!
.
: 모든 문자와 일치.[]
: 대괄호 사이에 존재하는 문자들 중 하나에 일치.[^]
: 대괄호 사이의 가장 첫 번째 문자로 ^가 있을 때, 그 문자 이후에 존재하는 문자들을 제외한 모든 문자와 일치.[a-z]
: 대괄호 사이 'a ~ z'사이의 모든 문자와 일치.^
: 대괄호 안에서는 부정을 뜻하지만, 밖에서는 문자열의 시작과 일치.$
: 문자열의 끝과 일치.^
의 반대.*
: 앞의 표현식이 0회 이상 연속으로 반복되는 부분과 대응.{0,}
와 같은 의미.+
: 앞의 표현식이 1회 이상 연속으로 반복되는 부분과 대응.{1,}
와 같은 의미.?
: 앞의 표현식이 0 또는 1회 등장하는 부분과 대응.{0,1}
와 같은 의미.\
: 특수 목적 문자를 문자 그대로 사용할 수 있도록 변환.\.
은.
문자 그대로를 뜻함.
패턴
\d
: 숫자와 일치.\w
: 영문자 및_
와 일치.\s
: 여러 가지 공백 문자와 일치.\D
: 숫자를 제외한 문자와 일치\W
: 영문자 및_
를 제외한 문자와 일치.\S
: 공백을 제외한 문자와 일치.{n}
: 앞에 존재하는 문자가 n번 반복되는 문자와 일치.{n, m}
: 앞에 존재하는 문자가 n번 이상 m번 이하 반복되는 문자와 일치.{n,}
: 앞에 존재하는 문자가 n번 이상 반복되는 문자와 일치.
어떤 패턴에 일치하는 일부 또는 모든 부분이 교체된 새로운 문자열을 반환한다.
// /gi : global + 대소문자구분x
var p = 'the lazy dog.';
var regex = /dog/gi;
console.log(p.replace(regex, 'ferret')); // "the lazy ferret."
console.log(p.replace('dog', 'monkey')); // "the lazy monkey."
문자열이 정규식과 매치되는 부분을 검색한다.
// A~E의 모든 문자와 a~e의 모든 문자가 배열의 각 원소를 구성하는 형태로 반환
var str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
var regexp = /[A-E]/gi;
var matches_array = str.match(regexp);
console.log(matches_array);
// ['A', 'B', 'C', 'D', 'E', 'a', 'b', 'c', 'd', 'e']
문자 그대로 길이를 뜻한다.
const alphabet = ['a','b','c','d','e'];
console.log(alphabet.length); // 5
배열인지 아닌지 확인한다. 알고리즘 문제에 자주 사용하였다...!
예를 들면...배열이 아니면 -1을 리턴하세요...
이런 문제가 많았다...
Array.isArray([]); // true
Array.isArray([1]); // true
Array.isArray(); // false
element마다 함수를 반복 실행한다.
parameter로 (현재요소, 현재 인덱스, 배열 자체) 를 받는다.
반복문을 좀 더 멋있게 사용할 때 사용하고 있...다...😅
['1','2','word','값'].forEach((val, index) => {
console.log(`val: ${val}, index: ${index}`);
})
// val: 1, index: 0
// val: 2, index: 1
// val: word, index: 2
// val: 값, index: 3
기존 배열과 동일한 길이를 갖고, 형태가 다른 새로운 배열을 만들 때 사용한다.
parameter로 (현재요소, 현재 인덱스, 배열 자체) 를 받는다.
너무너무...너무 자주 사용한다...!!!
let double = [1,2,3,4,5].map(val => val * 2);
console.log(double);
기존 배열에서 조건에 따라 특정 요소를 걸러낼 때 사용한다.
parameter는 이전 메소드와 같다.
let evenNumber = [1,2,3,4,5,6,7,8,9,10].filter(val => val % 2 === 0);
console.log(evenNumber);
index의 범위만큼 element를 추출
이전 메소드들과 다르게 immutable이라서 기존 값을 변경하지 않는다.
빈 값을 넣으면 복사가 된다.(매우 유용!)
const arr = ['가','나','다','라'];
console.log(arr.slice()); // [ '가', '나', '다', '라' ]
console.log(arr.slice(0,3)); // [ '가', '나', '다' ]
console.log(arr.slice(-1)); // [ '라' ]
console.log(arr.slice(10)); // []
배열의 내용을 추가/삭제할 때 사용한다.
parameter로 (시작 인덱스, 삭제할 개수, 추가할 요소) 를 받는다.
slice와 달리 mutable이라서 원본이 변경된다.
const user = ['dahuyn', 'sohee', 'naeun', 'yeil'];
user.splice(2, 0, 'sohee'); // [ 'dahuyn', 'sohee', 'sohee', 'naeun', 'yeil' ]
user.splice(2, 1); // [ 'dahuyn', 'sohee', 'naeun', 'yeil' ]
user.splice(1, 2); // [ 'dahuyn', 'yeil' ]
user.splice(0, 1, 'nayeon') // [ 'nayeon', 'yeil' ]
모든 element의 계산을 누적해 하나의 결과를 리턴한다.
parameter로 (누적값, 현재값, 인덱스, 원본 배열)을 받는다.
마지막에 초기값을 설정해도 되고, 생략도 가능하다.
const oddNumber = [1,3,5,7,9];
const sum = oddNumber.reduce((acc, i) => acc + i, 0);
console.log(sum); // 25
배열 요소를 합칠 때 유용하다.
const sentences = ['I', 'like', 'to', 'eat', 'hamburgers','!!'];
console.log(sentences.join(' '))
// I like to eat hamburgers !!
이 외의 메소드는 알고리즘에서 활용하면서 연습하려고 한다...!👨🏾💻
우와 대박