1.익명함수
오브젝트 내에서 많은 함수를 선언 했지만 가끔 key에 대한 value로 함수를 넣을 때 익명이라는 사실을 잊는다. 이번엔 잊지말자.
const obj = {
// 익명함수=>이름이 없는 함수 메모
push: function (num) {
console.log("나는 obj 객체 안에 push라는 키값의 있는 함수야");
console.log(`${num}을 매개변수로 받았어!`);
},
};2.indexOf
데이터를 가져왔을 때 가끔 썼었던 기억이 있었다.indexOf는 해당하는 value가 없으면 -1을 변환시킨다. 있다면 해당하는 값의 index를 반환한다.
let arr = ["사과", "딸기", "포도"];
let return2 = arr.indexOf("딸기");
console.log(return2);
//있다면 인덱스값, 없다면 -1을 반환한다.3.find
검색할 때 쓴다. indexOf와는 다르게 찾으면 true를 반환시키고 함수를 종료한다.즉, 처음 true가 나온 후에 종료된다.
let return3 = arr.find((a) => {
// 배열의 값이 순서대로 들어온다
// i 매개변수에
// return 값이 true의 값이 반환되면 해당 아이템을 반환해준다.
return a === "딸기";
});참고로 findIndex 로도 index를 구할 수 있다.
let return5 = arr.findIndex((a) => { return a === "딸기"; }); // 해당배열을 반복시키면서 값을 찾고 그 값의 인덱스를 반환해준다. console.log(return5);콘솔엔 1이 찍힌다.
4.filter
사실 필터만 썼던것 같다... 가끔 중복된 데이터를 확인하기위해 find를 쓴 것 빼고는...
let arr2 = ["이사과", "김딸기", "이포도"];
let return6 = arr2.filter((a) => {
return a[0] === "이";
});
첫 글자가 1인 것, 즉 return 값이 참일때 그 값을 저장한다.
5.map
react에서 많이 썼던 함수이다. 배열을 움직이면서 요소 하나하나를 반환해준다. 각 요소에 공통적인 무언가를 주고 싶을 때 쓰자
let return7 = arr2.map((a) => {
console.log(a);
// 배열의 형태로 반환값들을 넣어 반환해준다.
return a[0] === "이";
});
filter에서는 참일때 그 value를 반환 했다면 map은 말 그대로 순수하게 비교를 해준다! 즉,
[true, false, true]
이러한 값이 출력된다.
6.split,join
문자열을 배열로, 배열을 문자열로 바꿔주는 혜자 함수다.
let asd=arr2.join(';;;')arr2라는 배열 요소에 ;;;를 각각넣어주세요 라는 뜻이다.
만약 공백을 넣는다면('') 한 글자(하나의 요소)씩 나뉘게 된다.
이사과;;;김딸기;;;이포도
이사과김딸기이포도
=>공백일 경우정말 정직하다. 중요한 것은 배열이 아니라 문자열로 반환됐다는 것이다!
뭐예요 내 배열 어디갔어요..... 돌려주세요
let str3=asd.split(';;;');split으로 나누기 원하는 부분을 정해줄 수 있다.마찬가지로 공백이면 한 글자씩 배열로 만들어준다.
['이사과', '김딸기', '이포도']
마찬가지로 공백을 주면 어떨까?
['이', '사', '과', ';', ';', ';', '김', '딸', '기', ';', ';', ';', '이', '포', '도']
한 요소씩 나뉘어진다...
역시 js다 정말 편리하다 ㅎㅎ
7.object와 template literal
오랜만에 노드에서
const url = require("url");
const queryString=require('querystring');
const { URL } = url;
const myUrl = new URL(
"https://velog.io/@ecoco97"
);url을 object형식으로 나누어 host,query등등을 확인하는 연습을 했다.
console.log(`myURL:${myUrl}`);내가 예상한 것은 아름자운 object였지만 현실은 달랐다.
..?
뭐지 왜 원본이 들어오지?
열심히 구글링(사실 chatGPT)을 해본 결과 template literal안에는 순수 object는 못 들어간다. 사실 당연한거다.. 메모리를 참조하는 값인데 그걸 toString()으로 바꿔버리면 정상적으로 안되는것이 맞다....
그럼 어케함?
console.log(`myURL:`,myUrl);myURL: URL {
href: 'https://velog.io/@ecoco97',
origin: 'https://velog.io',
protocol: 'https:',
username: '',
password: '',
host: 'velog.io',
hostname: 'velog.io',
port: '',
pathname: '/@ecoco97',
search: '',
searchParams: URLSearchParams {},
hash: ''
}
잘 뜬다! ㅎㅎ object를 다룰 때는 웬만해선 ,로 변수를 나눠주자...
