*하루동안 새롭게 알게된 부분, 에러를 해결한 방법 등을 작성하는 개발일기입니다. 다른 사람에게도 설명해줄 수 있도록 제 머릿속에 넣기 위해 정리를 시작하게 되었습니다.
JavaScript 배열에서 max 값 찾기(spread operator)
JavaScript 배열에서 max 값을 찾기 위해서는 spread operator(전개 연산자)를 사용해야 한다.
배열 num의 max 값을 찾기 위해 아래 코드처럼 그냥 바로 Math.max(num) 하면 안된다는 것이다.
const num = [1, 3, 5, 7, 9];
console.log(Math.max(num));
// 결과: Nan
Math.max()는 입력된 숫자 중 가장 큰 수를 반환한다. 배열에서 가장 큰 값을 찾기 위해 배열을 Math.max의 매개변수로 바로 넣어버리면 배열을 숫자로 인식하지 않기 때문에 Nan을 반환하는 것이다.
즉, Math.max([1, 3, 5, 7, 9])의 형태가 아닌 Math.max(1, 3, 5, 7, 9) 형태로 들어가야 Max를 제대로 반환하게 된다.
[1, 3, 5, 7, 9]를 1, 3, 5, 7, 9로 바꾸어 줄 수 있는 것이 spread operator(...), 전개 연산자이다.
MDN에서는 spread operator를 다음과 같이 설명하고 있다.
> 전개 구문을 사용하면 배열이나 문자열과 같이 반복 가능한 문자를 0개 이상의 인수 (함수로 호출할 경우) 또는 요소 (배열 리터럴의 경우)로 확장하여, 0개 이상의 키-값의 쌍으로 객체로 확장시킬 수 있습니다.
즉, 배열을 요소로 바꾸어주는 것이라고 생각하면 된다.
그래서 배열에서 max 값을 찾고자 한다면, 아래처럼 배열 이름 앞에 spread operator를 넣어주면 된다.
const num = [1, 3, 5, 7, 9];
console.log(Math.max(...num));
// 결과: 9
배열이 특정 요소를 포함하고 있는지 판별(Array.includes())
특정 요소가 몇 번째 인덱스에 있는지 확인하고 싶을 때는 Array.indexOf(),
특정 요소를 배열이 포함하고 있는지 확인하고 싶을 때는 Array.includes()
for ... in, for ... of
for ... in은 객체 key 순환,
for ... of는 객체 value 순환
서버에서 로그인 인증하는 법
프론트에서 id와 password를 보내면, 백에서는 받아온 id를 먼저 찾고, 이 id가 가지고 있는 password와 받아온 password가 같은지 확인한다.
dispatch가 먼저일까, 서버와의 통신이 먼저일까
action을 dispatch하는 게 먼저일지 서버로 데이터를 보내는 게 먼저일지를 고민했다.
그런데 아래처럼, axios post한 결과가 succeed냐, failed냐에 따라 dispatch 해야하는 action이 달라진다면, 서버와 먼저 통신하고, action을 dispatch하는 게 맞을 것이다.
export function loginRequest(username, password) {
return (dispatch) => {
dispatch(login());
// API REQUEST
return axios.post('/api/account/signin', { username, password })
.then((response) => {
// SUCCEED
dispatch(loginSuccess(username));
}).catch((error) => {
// FAILED
dispatch(loginFailure());
});
};
}