자바스크립트120 자바스크립트의 this 예전에 this를 간단히만 다뤘습니다. 그때는 포스트 성격상 this가 클래스, 프로토타입 개념부터 이용되기 때문에 간단하게 소개했었습니다. 하지만 자바스크립트의 다른언어의 this와 달리 특이하게 사용되고 있으며 자바스크립트의 굉장히 독특한 문법중 하나입니다. 그래서 다시 한 번 this를 알아보려고 합니다. 내용이 별거 없어보이지만 처음 접한다면 보이는 것보다 어렵고 복잡한 키워드이기 때문에 급하신 분들은 주먹구구식으로 하이라이팅된 부분만을 외우시면 됩니다. 물론 코딩에서 외우는 것은 당연히 비추천이기에 나중에 이해가 반드시 수반되어야합니다. 1. this의 단독 사용 우선 this를 따로 혼자서 호출한 경우입니다. 아무것도 없는 상태에서 this만을 호출하면 window를 가리킵니다. const x.. 2021. 11. 12. Boyer Moore 법 단순하게 처음부터 끝까지 일일히 검사하는 브루트 포스법은 간단하지만 비효율적이라는 단점을 가지고있습니다. 이런 단점을 보완하고자 고안된 방식이 Boyer Moore법이며, 이 방식이 많이 사용되고 있습니다. 1. Boyer Moore 법 Boyer Moore 법은 브루트 포스와는 다르게 키의 마지막 글자부터 처음 글자 순서로 검사를 진행합니다. 검사를 진행하다가 불일치하는 부분이있으면 그 부분만을 집중적으로 검사하고 그 칸수만큼 훌쩍 뛰어넘어 검사를 진행해서 검색 속도를 향상시키는 방법입니다. 다음 배열에서 'ABC'를 검색하려고 합니다. 우선 문자열에 키를 맞춘후 제일 마지막 요소 부터 검사를 시작합니다. 검사를 시작하는데 불일치하는 지점이 발견되었습니다. 그러면 불일치 지점에 대해 키를 이동시켜 비교.. 2021. 11. 12. [Javascript] Nullish coalescing 연산자 1. 널 병합 연산자 Nullish Coalescing Operator 널 병합 연산자는 ES6 이후로 추가된 새로운 연산자입니다. 번역된 이름으로만 보면 뭔가 굉장히 복잡하고 어려워 보이는 이름인데 실제로는 그렇지 않습니다. Nullish Coalescing Operator는 다음과 같이 ??로 작성합니다. 피연산자 ?? 피연산자 이렇게 작성했을때 ??왼쪽의 피연산자가 'null' 혹은 'undefined'라면 오른쪽의 피연산자를 반환하는 역할을 합니다. 그래서 아래와 같은 코드를 작성했을때 오른쪽의 문자열을 반환하게 됩니다. const nullish = null ?? 'Nullish Coalescing Operator'; console.log(nullish); 2. ||와의 차이 배우고 보니 예전에 .. 2021. 11. 12. 브루트-포스 법 선형 검색과 이진 검색 두가지 방식은 대게 숫자와 같은 요소들을 검색하는데 편리한 방식이었습니다. 하지만 문자열에 이 방식들을 대입하기엔 쉽지 않습니다. 그래서 문자열들을 검색할 수 있는 몇 가지 방법들을 소개하려고 합니다. 1. 브루트 포스 법 브루트 포스 법(Brute Force Method)는 마치 선형 검색처럼 모든 요소에 대해 일일히 비교하는 방식입니다. 한 문자열에서 'aba'라는 문자열을 찾으려고 한다면 다음과 같이 나타낼 수 있습니다. 우선 문자열의 인덱스 0과 키의 인덱스 0을 비교합니다. 이때 그 요소가 일치했다면 그 다음 인덱스와 키의 두번째 인덱스를 비교합니다. 비교한 결과가 일치했다면 3번째 인덱스를 다시 검사하겠지만 여기서는 불일치했기 때문에 키를 이동시켜 원 문자열 배열의 1번.. 2021. 11. 10. 이진 검색 선형 검색은 자료를 처음부터 끝까지 순회하며 검색하기 때문에 자료가 클수록 나쁜 효율을 보여줍니다. 그래서 이 단점을 보완하고자 등장한 방식이 이진 검색입니다. 1. 이진 검색 이진 검색(Binary Search)은 일반적으로 선형 검색보다 더 빠른 검색 속도를 보여주는 알고리즘입니다. 단 한가지 전제 조건이 있다면, 이진 검색은 정렬된 컬렉션에 대해서만 검색이 가능하다는 점 입니다. 그래서 정렬 방식에 따라 선형 검색보다 오래걸릴 수도 있습니다. 다음과 같은 배열에서 이진검색을 통해서 26을 검색해보겠습니다. 우선 배열 인덱스의 중앙에 있는 값을 검사합니다. 이 값이 우리가 찾는 키 값 26과 일치하는지 확인합니다. 만약 키 값보다 작다면 배열의 앞 부분을, 키 값보다 크다면 배열의 뒷 부분을 생각하지.. 2021. 11. 10. [React] 컴포넌트 생명주기 리액트의 컴포넌트는 생성부터 소멸까지 생명 주기(라이프 사이클)를 가지고 있습니다. 개발자는 이 생명주기 함수들을 이용해서 생성부터 사이의 원하는 시점에 동작을 삽입할 수 있습니다. 1. 컴포넌트 라이프 사이클 메소드 서론에서 간단히 소개했듯이 리액트의 모든 컴포넌트들은 생명 주기를 가지고 동작합니다. 단순히 만들고 실행!에서 끝나는 것이 아니라 만드는 순간부터 실행 종료 사이사이 모든 순간들을 메소드로 나누어 관리합니다. 이것들을 컴포넌트 라이프 사이클 메소드라고 합니다. 컴포넌트 라이프 사이클 메소드는 클래스형 컴포넌트에서만 직접 사용이 가능하지만 함수형 컴포넌트에서 Hooks 기능을 이용해서 사용할 수 있습니다. 이 포스트의 현재 목적은 라이프 사이클 메소드의 이해이므로 Hooks를 이용한 방식은 .. 2021. 11. 10. 이전 1 ··· 3 4 5 6 7 8 9 ··· 20 다음 300x250