에브리 저장소

최근 면접 스터디를 진행하며 받은 질문 중, 클로저를 사용할 때 주의해야 할 점에 대해 질문을 받았으나 선뜻 대답하지 못했습니다. 😢 이에 메모리 누수를 주의해야 한다.라는 피드백을 받고 알아보니 클로저인 내부 함수가 참조하는 외부 함수의 객체들을 더 이상 사용하지 않아도 가비지 콜렉터가 수집하지 못한다는 내용이 있었습니다. 키워드만 정리해놓고 잊고 있었는데, 다른 분께서 자바스크립트의 가비지 콜렉터 동작 방식에 대해 내용이 있으면 좋을 것 같다는 피드백을 주셨고, 이를 계기로 정리해서 공유합니다. 틀린 내용 지적 등의 피드백은 언제나 감사히 받겠습니다. 참고 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Memory_Management https:/..

문제 링크 https://leetcode.com/problems/longest-substring-without-repeating-characters/ 풀이 이 문제는 문자열에서 중복 없이 가장 긴 substring의 길이를 반환하는 문제이다. 내가 접근한 방식은 완전 탐색이다. 자신보다 뒤에 있는 문자열들을 순회하면서 중복이 발생하기 전까지의 길이를 찾아 저장해놓은 max length와 비교하는 로직을 작성했다. O(N^2)의 시간 복잡도를 가지기 때문에 상대적으로 너무 느리다. 다른 사람들의 풀이를 보았고, O(N)으로 푸는 코드를 찾았다. 이 코드는 각 문자열을 map이라는 객체에 저장하면서 value로 이 문자가 가장 마지막으로 나온 index를 저장한다. 이로 인해 한번 순회로 중복 없는 최대 길..

문제 링크 https://leetcode.com/problems/sum-of-two-integers/ 풀이 이 문제에서는 +, - 연산자를 사용하지 않고 두 인자의 합을 반환하는 함수를 만들어야 한다. 문제의 조건을 확인하고 비트 연산자를 써야겠다고 생각했으나, 어떤 연산자를 써야 할까 고민했다. 정확한 덧셈을 위해서 Carry와 이를 제외한 합을 알아야 한다. Carry를 알기 위해 사용할 수 있는 비트 연산자는 AND이다. 둘 다 1일 때만 1이므로 AND의 결과가 1이라면 Carry가 발생했음을 알 수 있다. Carry를 제외한 합은 XOR 연산자로 알 수 있다. 둘 중 하나만 1일 때 XOR의 결과가 1이기 때문이다. 실제로 컴퓨터가 덧셈을 AND, XOR 연산자를 통해서 한다고 한다. 덧셈을 실..

[JavaScript] 정규표현식 - 문자열에 한글 있는지 검사하기 타자연습 앱 구현을 연습하다가 현재 방식에서 한글을 지원하지 못해서 문자열에 한글이 있는 경우를 검사해야했습니다. 정규표현식을 사용하면 간단하므로 정규표현식을 사용하여 문자열 내부에 한글이 있는지 검사하는 방법을 알아보았습니다. RegExp Object자바스크립트의 RegExp라는 생성자는 특정 패턴에 맞는 텍스트를 위한 표현식을 만들어냅니다.생성자를 사용해도 되지만, 리터럴을 사용해도 무방합니다. 1234const re1 = new RegExp('\\w+');const re2 = /\w+/; //re1과 re2는 같습니다.cs test() 메서드RegExp 객체에 test() 내장 메서드가 있습니다. 사용법은 아래와 같습니다. 123c..

[JavaScript] ES6 Arrow function(화살표 함수)에 대해 알아보자!! 안녕하세요. 이번 포스팅은 ES6에서 새롭게 등장한 함수 작성 방식인 Arrow function. 화살표 함수에 대해 알아봅니다. Arrow function (화살표 함수) ES6에서 => 연산자를 사용하여 함수를 생성하는 Arrow function(화살표 함수)가 생겼습니다. Arrow function은 보다 간결하게 구문을 작성할 수 있는 익명 함수입니다. 사용법 //ES6 이전. setTimeout(function() { console.log("1"); }, 1000); //ES6 이후. setTimeout(() => { console.log("2"); }, 2000); 콜백함수의 단점 중 하나로 인자로 들어..

[JavaScript] ES6 템플릿 리터럴에 대해 알아보자!! 안녕하세요. 이번 포스팅은 ES6의 템플릿 리터럴과 활용법에 대해 알아봅니다. Template literals템플릿 리터럴은 내장된 표현식을 허용하는 문자열 리터럴입니다. 템플릿 리터럴은 표현식/문자열 삽입, 여러 줄 문자열, 문자열 형식화, 문자열 태깅 등 다양한 기능을 제공합니다. ES2015 사양명세서에선 template strings라고 불렸습니다. 템플릿 리터럴은 런타임 시점에 일반 자바스크립트 문자열로 처리/변환됩니다.프론트엔드에서는 HTML을 데이터와 결합해서 DOM을 다시 그려야 하는 일이 빈번하기 때문에, 템플릿을 좀 더 쉽게 편집하고 작성해야 할 필요가 있어서, 이러한 기능이 추가되었습니다.(자바스크립트 자체적으로 지원하기..

[JavaScript] ES6 블록 레벨 스코프에 대해 알아보자!! (feat.let, const) 안녕하세요. 이번 포스팅은 ES6에서 새롭게 등장한 자바스크립트 변수 선언 키워드인 let과 const 그리고 이들의 유효범위인 블록 스코프에 대해 알아봅니다. Block level scope (블록 단위 유효범위)블록 단위의 유효범위에 대해 알아보고 블록 단위의 유효범위를 갖는, ES6(ECMAScript2015)에서 새로 등장한 변수 선언 키워드인 let, const에 대해 알아보겠습니다.ES6 이전까진 자바스크립트에는 var라는 변수 키워드밖에 없었습니다. 그래서 현재는 var, let, const 이 세 가지를 변수 선언 키워드로 사용할 수 있습니다. 세 가지를 비교해보면서 블록 레벨 스코프에 대해..