오묘한

https://react.dev/learn/manipulating-the-dom-with-refs Manipulating the DOM with Refs – React The library for web and native user interfaces react.dev - 디자인 시스템에서 낮은 레벨의 컴포넌트들(버튼, 인풋 등등)은 그들의 DOM nodes를 이용하는 것이 흔하다. 그러나 높은 레벨의 컴포넌트(form, list, 페이지 section 등)은 그들의 DOM 노드를 노출하는 것을 피한다.(의도하지 않은 의존성을 피하기 위해서이다.) useImperativeHandle(): forwardRef을 이용해 자식 컴포넌트에 있는 요소에 ref을 주기 위해 사용함. 다음과 같이 사용한다. 더보기 ..

1장. 자바스크립트의 개요 1. 프로그래밍 언어란 컴퓨터 프로그램을 작성하기 위한, 즉 알고리즘을 설명하기 위한 언어이다. 2. 프로그래밍 언어는 컴파일 언어와 인터프리터 언어로 나뉜다. 3. 프로그래밍 언어는 방식에 따라 절차적 언어, 객체 지향 언어, 함수형 언어, 논리형 언어로 나뉜다. 자바스크립트는 객체 지향 언어이지만 함수형 언어의 특징도 가진다. 4. 자바스크립트는 인터프리터 언어이다. 실행 속도가 느릴 것 같지만 최근 웹브라우저 대부분에 실행시간에 자바스크립트 코드를 컴파일하는 JIT 컴파일러가 내장돼있어 실행 속도가 매우 빨라졌다. 이는 자바스크립틀르 활용한 고기능 웹 애플리케이션을 구현할 수 있게 된 중요한 요인 중 하나이다. 5. 자바스크립트는 C++나 Java처럼 클래스를 이용해 객체..

Two Pointer 알고리즘 연습용으로 선택한 문제! Set() 을 사용해 아래와 같이 간단하게 풀었다. function solution(gems) { let answer = []; let allSpecies = new Set(gems); // 모든 종류의 요소가 각각 1번만 담기는 set() let minArr = []; let minLength = gems.length; let s = 0; let e = 0; while (e end - start) { // 2) 최소구간이 증명되면 answer에 넣는다. ..

자바스크립트 프로토타입은 이해하기 매우 어려운 주제이다. 책을 읽었지만 그래도 이해하지 못했는데, 프로토타입을 철학의 맥락에서 살펴본 아래 자료를 읽고 이해를 한방에 했다! 정말 이해하기 쉽게 되어있고 문과라면 오히려 더 잘 이해할 수 있으니 꼭 읽어보시는 걸 추천! 자바스크립트는 왜 프로토타입을 선택했을까 프로토타입으로 검색하면 으레 나오는 서두처럼 저 또한 자바스크립트를 처음 접했을 때 가장 당황스러웠던 게 프로토타입이었습니다. medium.com 정리 - 프로토타입은 이미 존재하는 객체, 즉 생성된 객체를 통해 정의하는 방식이다. - 그래서 프로토타입 선언 시에 객체 선언의 과정이 포함되어 있는 것이다! - 프로토타입을 적용한 후, 적용시킨 객체가 해당 속성을 변경해도 프로토타입의 객체 속성은 변경..

https://leetcode.com/problems/longest-substring-without-repeating-characters/description/ LeetCode - The World's Leading Online Programming Learning Platform Level up your coding skills and quickly land a job. This is the best place to expand your knowledge and get prepared for your next interview. leetcode.com 더보기 이 문제는 가장 간단하게 내가 풀 수 있었던 방법이 이중 반복문을 돌리며 범위를 잡고, {문자:0} 형태의 object를 만들어 특정 문자가 등장..

https://leetcode.com/problems/add-two-numbers/editorial/ LeetCode - The World's Leading Online Programming Learning Platform Level up your coding skills and quickly land a job. This is the best place to expand your knowledge and get prepared for your next interview. leetcode.com 문제를 주어진 시간 내에 못 풀었다..ListNode() 라는 새로운 class의 형태를 도저히 문제에 어떻게 적용해야 할지 모르겠었다. 결국 그래서 해설을 봤는데, 우선 재귀로 푸는 방법이 하나가 있었다. 더보..

1. array의 Constructor :Array() 2. array의 Property: 1) Array[@@species] => 현재 이 기능은 사라질 준비 중. toReserved() 같은 최신 배열 메서드가 새 Array 기반 클래스 인스턴스를 반환한다. 기존 배열을 변경하지 않고, 새 배열 인스턴스를 반환하는 배열 메서드(filter(), map())에서 생성자로 작용해, 반환된 생성자는 원 배열과 관련 없는 새로운 배열 메서드의 반환 값을 구성하게끔 된다. 2) Array.prototype[@@unscopables] => 이 속성이 있음으로서 ECMAScript 2015에 도입된 Array 속성이 with 문 바인딩 목적으로 무시돼 2015 이전에 작성된 코드가 중단되지 않고 예상대로 계속 작..

LeetCode - The World's Leading Online Programming Learning Platform Level up your coding skills and quickly land a job. This is the best place to expand your knowledge and get prepared for your next interview. leetcode.com Two Sums: Given an array of integers nums and an integer target, return indices of the two numbers such that they add up to target. You may assume that each input would have e..

https://joshua1988.github.io/ts/guide/functions.html#this 함수 | 타입스크립트 핸드북 타입스크립트에서의 함수 웹 애플리케이션을 구현할 때 자주 사용되는 함수는 타입스크립트로 크게 다음 3가지 타입을 정의할 수 있습니다. 함수의 파라미터(매개변수) 타입 함수의 반환 타입 joshua1988.github.io 1. 기본타입 기본 타입은 크게 12가지가 있다. Boolean - 타입이 진위값인 경우 let isLoggedIn : boolean = false; Number - 타입이 숫자일 때 let num : number = 10; String - 타입이 문자일 때 let str : string = 'hi'; Object Array - 타입이 배열인 경우는 아래처..

1. The Basics Typescript는 함수, string, object 등 타입을 명확하게 정의해주어, 사용할 수 없는 메서드를 사용하는 일이 없도록 방지한다. (ex. function.toLowerCase();) javascript는 동적 타입 검사(타입 오류를 동작 수행 전에는 알 수 없고, 코드 실행해 호출해봐야 안다)만 제공한다. 그래서 어떤 동작 결과를 보일지 코드를 작성하는 동안 확인하기 위해 Typescript 사용하는 것이다. 정적 타입 검사 필요한 이유 1) JavaScript가 런타임 시 내보내는 오류는 ECMA Script 명세에 적힌 대응법 기반이다. 그런데 당연히 오류를 띄워야 할 상황에서 아래처럼 이상하게 작동할 때가 있다. 아예 정의되지 않은 속성을 불러오는데 오류가 ..