++ 코드 정리
문자열 관련 메소드
let str = " Happy day^ㅁ^";length - 문자열 길이 확인
length: 문자열의 길이를 반환(공백포함)
console.log("length : ", str.length);
//length : 15toUpperCase - 문자열을 모두 대문자로 바꿈
toUpperCase(): 문자열 전체를 대문자로 바꿈
console.log("toUpperCase: ", str.toUpperCase());
//toUpperCase: HAPPY DAY^ㅁ^toLowerCase - 문자열을 모두 소문자로 바꿈
toLowerCase(): 문자열 전체를 소문자로 바꿈
console.log("toLowerCase: ", str.toLowerCase());
//toLowerCase: happy day^ㅁ^indexOf - index 반환
indexOf(): 매개변수로 문자열을 받아서 몇번째 인덱스인지 숫자로 반환함
(중복 값이 있어도 맨 처음 발견한 값을 반환함)lastIndexOf(): 마지막 것을 반환함
++ 발견하지 못한 경우 -1을 반환함
console.log("index: ", str.indexOf("y"));
//index: 7
console.log("index: ", str.lastIndexOf("d"));
//index: 9++ charAt() : 인수로 전달한 index를 사용하여 index에 해당하는 위치의 문자를 반환
console.log("charAt(3):", str.charAt(3)); //H
console.log("charAt(17):", str.charAt(17)); //지정 index가 범위를 벗어난 경우 빈문자열 반환slice - 문자열 자르기
slice(startIdx,endIdx): startIdx~endIdx-1 까지 잘라내어 문자열로 반환함, 음수값을 전달할 수 있음
console.log("slice: ", str.slice(0, 4));
//slice: H
console.log("slice: ", str.slice());
//slice: Happy day^ㅁ^
console.log("slice: ", str.slice(-5));
//음수일 경우 뒤에서부터 잘라서 반환함
//slice: ay^ㅁ^- ++
subString():slice()와 똑같지만 음수값을 전달할 수 없음
split - 문자열 자른 후 배열 반환
split(): 첫번째 인수로 전달한 문자열 또는 정규표현식을 대상 문자열에서 검색해 문자열로 구분 후에 리스트(배열)로 반환함
인수가 없을 경우, 대상 문자열 전체를 단일 요소로 하는 배열을 반환함
console.log("split: ", str.split(""));
//split: (15) [' ', ' ', ' ', 'H', 'a', 'p', 'p', 'y', ' ',
//'d', 'a', 'y', '^', 'ㅁ', '^']
// 기준이 되는 값은 사라짐
console.log("split: ", str.split(" "));
//split: (5) ['', '', '', 'Happy', 'day^ㅁ^']
console.log("split: ", str.split("a"));
//split: (3) [' H', 'ppy d', 'y^ㅁ^']
replace - 문자열 바꾸기
.replace(문자열1, 문자열2): 문자열1을 문자열2로 첫번째로 검색된 문자열만 바꿈.replaceAll(): 모든 요소를 변경함
console.log("replace: ", str.replace("p", "a"));
//replace: Haapy day^ㅁ^
console.log("replaceAll: ", str.replaceAll("a", "k"));
//replaceAll: Hkppy dky^ㅁ^
repeat - 반복
repeat(): 전달한 숫자만큼 반복해 연결한 새로운 문자열을 반환함
console.log("repeat: ", str.repeat(2));
//repeat: Happy day^ㅁ^ Happy day^ㅁ^trim - 좌우 공백 제거
trim(): 좌우 공백을 제거함
console.log("trim 전: ", str);
//trim 전: Happy day^ㅁ^
console.log("trim 후: ", str.trim()); //회원가입할 때 많이씀
//trim 후: Happy day^ㅁ^배열관련 메소드
let days = ["M", "T", "W", "T", "F", "S", "S", "T"];push - 마지막 요소 추가
push(): 원본 배열의 마지막에 원하는 만큼 요소로 추가하고 추가된 이후의 리스트 길이를 반환함
let pushResult = days.push("z", "a");
console.log("push : ", days);
//push : (10) ['M', 'T', 'W', 'T', 'F', 'S', 'S', 'T', 'z', 'a']
console.log("pushResult : ", pushResult);
//pushResult : 10
... < 전개연산자
pop - 마지막 요소 삭제
pop(): 원본 배열의 마지막 요소를 제거하고 제거한 요소를 반환함
let popResult = days.pop();
console.log("pop:", days);
//pop: (9) ['M', 'T', 'W', 'T', 'F', 'S', 'S', 'T', 'z']
console.log("popResult: ", popResult); // pop 한 값(추출해서 리스트에서 삭제하지만 값으로 반환)
//popResult: apop 값 추출후 반환(리스트상에선 삭제)
unshift - 첫번째 요소 추가
unshift(): 원본 배열의 첫번째 위치에 원하는 만큼 요소로 추가하고 추가된 이후의 리스트 길이를 반환함
let unshiftResult = days.unshift("r", "e");
console.log("unshift : ", days);
//unshift : (11) ['r', 'e', 'M', 'T', 'W', 'T', 'F', 'S', 'S', 'T', 'z']
console.log("unshiftResult : ", unshiftResult);
//unshiftResult : 11unshift - 첫번째 요소 삭제
shift(): 배열에서 첫 요소를 제거하고 제거한 요소를 반환함
pop()과 동일
let shiftResult = days.shift();
console.log("shift : ", days);
//shift : (10) ['e', 'M', 'T', 'W', 'T', 'F', 'S', 'S', 'T', 'z']
console.log("shiftResult : ", shiftResult);
//shiftResult : rindexOf - index 반환
indexOf(): 원본 배열에서 전달된 요소를 검색하여 인덱스로 반환
indexOf(찾을 요소, 검색을 시작할 인덱스(안 보내도 되는 요소임))- 맨 처음 찾은 index값만 반환함
- 해당 요소가 없을 경우 -1 반환
console.log("indexOf T: ", days.indexOf("T"));
//indexOf T: 2
console.log("indexOf T2 : ", days.indexOf("T", 3));
//indexOf T2 : 4
console.log("indexOf T: ", days.lastIndexOf("T"));
//indexOf T : 8includes - 포함 유무
includes(): 요소를 찾고, 그에 대한 결과를 boolean 타입으로 반환
console.log("includes S:", days.includes("S"));
//includes S: true
console.log("includes G:", days.includes("G"));
//includes G: falsereverse - 반전 함수
reverse(): 배열 요소의 순서를 반대로 변경
console.log("reverse: ", days.reverse());
//reverse: (10) ['z', 'T', 'S', 'S', 'F', 'T', 'W', 'T', 'M', 'e']join - 배열 연결 후 문자열 반환
join(): 배열 모든 요소를 문자열로 변환 후, 인수로 전달 받은 값(구분자)로 연결한 문자열로 반환
console.log("join: ", days.join());
//join: z,T,S,S,F,T,W,T,M,e
console.log("join: ", days.join("&"));
//join: z&T&S&S&F&T&W&T&M&e
console.log("join: ", days.join(" "));
//join: z T S S F T W T M e
메소드 체이닝
각각의 메소드를 연결해서 사용하는 개념
반환 값이 있어야 체이닝이 가능함
let str2 = "Holiday";
console.log("str2:", str2);
let splitResult2 = str2.split("");
console.log("splitResult:", splitResult2);
let reverseResult2 = splitResult2.reverse();
console.log("reverseResult:", reverseResult2);
let joinResult2 = reverseResult2.join("");
console.log("joinResult:", joinResult2);
//메소드 체이닝
console.log("total: ", str2.split("").reverse().join(""));shallow copy : 번지수만 복사
deep copy : ... < 전개연산자를 사용하여 실제값을 복사해서 새로운 번지수를 만들어냄
배열에서의 대입은 주소값 대입이기에
https://hanamon.kr/javascript-shallow-copy-deep-copy/
https://velog.io/@nemo/shallow-deep-copy
배열에서의 for
기본 for문
let fruits = ["apple", "banana", "lemon", "melon", "grape"];
console.log(fruits);
// (5) ['apple', 'banana', 'lemon', 'melon', 'grape']
console.log("apple: ", fruits[0]); // 특정한 값을 가져올 때는 배열[인덱스]
//apple: apple
for (let i = 0; i < fruits.length; i++) {
console.log("i: ", i);
console.log("fruits[i]: ", fruits[i]);
}
// i: 0
// fruits[i]: apple
// i: 1
// fruits[i]: banana
// i: 2
// fruits[i]: lemon
// i: 3
// fruits[i]: melon
// i: 4
// fruits[i]: grapefor-of 문
for( 변수 of 배열 ) : 배열에 있는 요소를 하나씩 변수로 가지고 옴
for (let f of fruits) {
console.log("for-of:", f);
}
//for-of: apple
//for-of: banana
//for-of: lemon
//for-of: melon
//for-of: grape
forEach 문
배열.forEach((변수, 인덱스, 배열)=>{})
- 변수 : 배열에 들어있는 요소가 하나씩 들어옴
- 인덱스 : 변수가 하나씩 들어올 때 그 변수의 인덱스
- 배열 : 현재 내가 돌고 있는 배열을 가져옴
map과 forEach의 차이 : 반환값의 차이가 있음
() => { return 'a' } == () => 'a'
중괄호 없이 쓸 수 있는 경우는 무조건 return만 할 때
fruits.forEach((f, index, arr) => {
console.log("---------");
console.log("f:", f);
console.log("index:", index);
console.log("arr:", arr);
console.log("---------");
console.log(f);
});
벨로그 자동 비공개 처리 키워드가 있다는걸 첨으로 알게 됐다.. 글을 적으면 자꾸 비공개 처리돼서 검색해보니까 그렇다고 하던데 당최 모르겠어서 글을 계속 수정해봤더니 split 부분에서 비공개가 되길래 한문장 한문장 해봤는데 ㅎ ㄹㅣ스트(배열0~ 어ㅈ쩌고라서 비공개처리됐음 웃긴다지나ㅉ....
⋆｡˚☁｡⋆｡˚☾˚｡⋆