[TIL] 내배캠4기-React-37일차

hare·2022년 12월 6일
0

내배캠-TIL

목록 보기
27/75

오전

  • 리액트 자습서 읽기
  • 알고리즘 문제풀이 12/6

오후

  • 리액트 입문강의 복습
  • 개인과제
    • 너무어려워잉..
  • 리액트 심화강의 3강
  • TIL

리액트 자습서

스터디하면서 읽은 리액트 자습서에서 따로 정리해보면 좋을 내용을 모아봤다. 리액트 1도 모른 상태로 시작했으니 개념은 확실히 알고가자..💨

React는 사용자 인터페이스를 구축하기 위한 선언적이고 효율적이며 유연한 JavaScript 라이브러리입니다. “컴포넌트”라고 불리는 작고 고립된 코드의 파편을 이용하여 복잡한 UI를 구성하도록 돕습니다.

props 전달하기는 React 앱에서 부모에서 자식으로 정보가 어떻게 흘러가는지 알려줍니다.

무언가를 “기억하기”위해 component는 state를 사용합니다.

JavaScript 클래스에서 하위 클래스의 생성자를 정의할 때 항상 super를 호출해야합니다. 모든 React 컴포넌트 클래스는 생성자를 가질 때 super(props) 호출 구문부터 작성해야 합니다.

컴포넌트에서 setState를 호출하면 React는 자동으로 컴포넌트 내부의 자식 컴포넌트 역시 업데이트합니다.

프로그래머스 코테

2차원으로 만들기

문제 설명
정수 배열 num_list와 정수 n이 매개변수로 주어집니다. num_list를 다음 설명과 같이 2차원 배열로 바꿔 return하도록 solution 함수를 완성해주세요. num_list가 [1, 2, 3, 4, 5, 6, 7, 8] 로 길이가 8이고 n이 2이므로 num_list를 2 * 4 배열로 다음과 같이 변경합니다. 2차원으로 바꿀 때에는 num_list의 원소들을 앞에서부터 n개씩 나눠 2차원 배열로 변경합니다.

function solution(num_list, n) {
    var answer = [];
    const LEN = num_list.length / n; //나눠지는 배열 수
   
        for(let i = 0; i < LEN; i++){
            var arr = [];
            for(let j = 0; j < n; j++){
            	arr.push(num_list.shift()); //배열에 추가
            }
            answer.push(arr); 
        }
    return answer;
}

세상엔 정말 천재가 많다..
이렇게 간단하게 풀다니! 당장 splice 다시 찾아보러가~!

function solution(num_list, n) {
    var answer = [];

    while(num_list.length) {
        answer.push(num_list.splice(0,n));
    }

    return answer;
}

Array.prototype.splice()

splice() 메서드 : 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경합니다.
첫 번째 인자 : 변경 시작 인덱스
두 번째 인자 : 제거할 요소의 수

반환 값

  • 제거한 요소를 담은 배열. 하나의 요소만 제거한 경우 길이가 1인 배열을 반환합니다. 아무 값도 제거하지 않았으면 빈 배열을 반환합니다.

while문 안에 상수를 넣어도 되는구만..

profile
해뜰날

0개의 댓글