2022-12-08 목요일

·2022년 12월 8일
0

Today I Learned

목록 보기
29/114
post-thumbnail

📅 오늘 한 일


1. 배열 메소드 보충

2. 리액트 연습

3. 알고리즘 문제 풀이

✏️ 무엇을 배웠나


1. 배열 메소드 보충

배열을 다루는 상황이 꽤나 많아졌다. 배열 까먹은 게 많아서 다시 한 번 연습해봤다. 반복하면 전에는 보이지 않던 게 보이는 경우가 많은 것 같다. 아래는 연습으로 끄적인 코드.

let name = [
"드래곤볼",
"귀멸의 칼날",
"드레이크",
"도로헤도로",
"애플워치",
"주술회전",
];

let days = [
{ day: "mon", vacation: true },
{ day: "tue", vacation: true },
{ day: "wed", vacation: false },
{ day: "thu", vacation: true },
];

// for문을 이용해서 배열을 하나씩 꺼낼 때
for (let i = 0; i < name.length; i++) {
console.log(name[i]);
}

// forEach를 사용하면 for문으로 꺼내는 것보다 편함
name.forEach((item) => console.log(item, "1"));

// map은 반드시 배열을 반환함, 객체를 담은 배열에서 원하는 데이터만 뽑을 때 사용 많이 함
let data = name.map((item) => {
return "내가 좋아하는 것 : " + item; // 여기에 값을 어떻게 반환할지 코드로 만들어줄 수 있다
});
console.log(data);

// filter는 조건에 맞는 데이터만 배열로 반환하고 싶을 때
let data2 = name.filter((item) => {
return item === "귀멸의 칼날";
});
console.log(data2);

// array.splice
let data5 = ["1", "2", "3", "4", "5"];
data5.splice(0, 0, "추가1", "추가2", "추가3");
console.log(data5);

// array.slice
let data6 = data5.slice(0, 6);
console.log(data6);

2. 리액트 학습

  • 생활코딩 2022 프론트엔드 강의에서 리액트 상에서 CRUD가 어떻게 이루어지는지 조금 더 알게 됐다.
  • 노마드코더는 npm을 사용하고 있고 뭔가 지금이랑 잘 안 맞는 거 같아서 안 보기로 했다. (현재 yarn 쓰고 있음)
  • 처음에는 리액트 구조나 코드 생김새가 눈에 잘 안 들어왔는데, 서서히 느낌이 온다. 아직도 좀 복잡하긴 하지만 점차 선명해질 것이라고 생각한다.

🥵 무엇이 어려웠나


  • 심리적인 스트레스를 잘 다뤄야겠다.
  • 심리적으로 부담스러운 일이 있을 때 작은 조각으로 나눠서 하나씩 처리하는 게 답이라는 걸 잊지 말기.

🔎 더 알고 싶은 것 / 보완이 필요한 것


1. ES6 Syntax 정리

리액트 연습을 하다보니까 그냥 쓰고 있는 ES6 신택스들이 있다. 더 나은 이해를 위해서 리액트에서 자주 쓰게 되는 것들 위주로 정리해놔야겠다.


🏷️ 오늘의 코멘트

햄버거 먹고 싶다.

profile
⛰ 프론트엔드 개발 공부 블로그

0개의 댓글