분류 전체보기

LeetCode / Matrix / 2352번 / Equal Row and Column Pairs / JS

Equal Row and Column Pairs - LeetCode Can you solve this real interview question? Equal Row and Column Pairs - Given a 0-indexed n x n integer matrix grid, return the number of pairs (ri, cj) such that row ri and column cj are equal. A row and column pair is considered equal if they contain th leetcode.com 각 행과 각 열을 모두 나누어서 봤을 때, 행과 열을 이루는 값들이 같으면 카운트를 하나 더해서 최종 카운트를 반환하는..

LeetCode / Array / 228번 / Summary Ranges / JS

Summary Ranges - LeetCode Can you solve this real interview question? Summary Ranges - You are given a sorted unique integer array nums. A range [a,b] is the set of all integers from a to b (inclusive). Return the smallest sorted list of ranges that cover all the numbers in the arr leetcode.com 연속수를 이루는 모든 범위를 배열에 담아서 반환한다. /** * @param {number[]} nums * @return {string[]..

Keeping Components Pure

일부 JavaScript 함수는 순수하다. 순수 함수는 계산만 수행하고 그 이상은 수행하지 않는다. 컴포넌트를 순수함수로만 작성하면 코드가 커짐에 따라 당황스러운 버그와 예측할 수 없는 동작을 피할 수 있다. 순수: 공식으로써의 컴포넌트 순수함수는 다음과 같은 특성을 가진 함수이다. 자신의 일만 생각한다. 호출되기 전에 존재했던 객체나 변수는 변경하지 않는다. 동일한 입력, 동일한 출력. 동일한 입력이 주어지면 항상 동일한 출력을 반환해야 한다. 의도하지 않은 결과 React 렌더링 프로세스는 항상 순수해야한다. 컴포넌트는 JSX만 반환해야 하며 렌더링 전에 존재했던 객체나 변수를 변경하면 안된다. 다음은 이 규칙을 위반하는 컴포넌트이다. HTML 삽입 미리보기할 수 없는 소스 컴포넌트 밖에서 선언된 g..

Rendering Lists

JavaScript의 배열 메서드를 사용하여 데이터 배열을 조작할 수 있다. filter() 혹은 map()을 많이 사용한다. 배열 데이터 렌더링 아래와 같은 목록이 있다고 해보자. Creola Katherine Johnson: mathematician Mario José Molina-Pasquel Henríquez: chemist Mohammad Abdus Salam: physicist Percy Lavon Julian: chemist Subrahmanyan Chandrasekhar: astrophysicist 위와 같은 리스트의 형식으로 우리는 데이터를 다르게 하거나, 원하는 값만 뽑아낸다거나 하고싶을 수 있다. 또는 모든 리스트에 대해 어떠한 작업을 추가로 해서 렌더링 시키고 싶을 수 있다. 그럴때..

Conditional Rendering

React에서는 if문, &&, ? : 연산자와 같은 JavaScript 구문을 사용해서 JSX를 조건부로 렌더링할 수 있다. 조건부 JSX 반환 if문 if문을 사용하면 조건에 따라 다음과 같이 조건부 렌더링이 가능하다. if (isPacked) { return {name} ✔; } return {name}; 삼항 연산자 return ( {isPacked ? name + ' ✔' : name} ); 논리 AND 연산자(&&) return ( {name} {isPacked && '✔'} ); 해당 연산자에 대한 설명은 이미 전에 정리한 포스팅이 있으므로 아래 참고 바란다 (조건부 렌더링에 대한 설명 링크) JSX를 변수에 조건부로 할당 위에서는 if문을 통해서 바로 조건에 따라 JSX를 반환해주었지만, ..

LeetCode / Design / 155번 / Min Stack / JS

Min Stack - LeetCode Can you solve this real interview question? Min Stack - Design a stack that supports push, pop, top, and retrieving the minimum element in constant time. Implement the MinStack class: * MinStack() initializes the stack object. * void push(int val) pushes t leetcode.com stack의 메소드들을 구현하는데 추가로 getMin()을 구현한다. getMin()은 스택의 값중에서 가장 작은값을 반환한다. 그 외 기본 메소드는..