투투

오픈 소스 프로젝트에 참여하고자 특정 프로젝트의 코드를 분석해보면서 this가 많이 쓰여져있는 것을 확인했다. 하지만 this의 정확한 동작 방법과 의미를 이해하지 못하고 있다는 것을 깨달았다. 따라서 this가 무엇이고 특정 상황에 따라 어떻게 동작하는지 공부해보려고 한다. this의 필요성 먼저 this가 왜 필요한지 알 필요가 있다. 다음의 코드는 "모던 자바스크립트 Deep Dive"를 참고하였다. 원의 반지름을 통해 지름을 구하는 getDiameter라는 메서드가 circle 객체에 포함되어있다. 아래의 코드에서 객체 리터럴은 circle 변수에 할당되기 직전에 평가된다. 따라서 getDiameter가 호출되는 시점에는 객체 리터럴의 평가가 완료되어 circle에 생성된 객체가 할당된 상태일 것..

https://programmers.co.kr/learn/courses/30/lessons/42888 코딩테스트 연습 - 오픈채팅방 오픈채팅방 카카오톡 오픈채팅방에서는 친구가 아닌 사람들과 대화를 할 수 있는데, 본래 닉네임이 아닌 가상의 닉네임을 사용하여 채팅방에 들어갈 수 있다. 신입사원인 김크루는 카카오톡 오 programmers.co.kr 접근 어떤 한 사용자는 들어왔다 나갈 수 있고 다시 들어오면서 기존의 닉네임과 다르게 입장할 수도 있다. 또한 입장 후에 닉네임을 변경할 수도 있으며 사용자들은 중복된 닉네임을 사용할 수 있다. 따라서 주어지는 조건 중에 userId를 활용하였고 user라는 딕셔너리를 만들어 userId에 해당하는 닉네임을 저장해두었다가 활용하였다. 구현 - users라는 딕셔..

https://programmers.co.kr/learn/courses/30/lessons/17679 코딩테스트 연습 - [1차] 프렌즈4블록 프렌즈4블록 블라인드 공채를 통과한 신입 사원 라이언은 신규 게임 개발 업무를 맡게 되었다. 이번에 출시할 게임 제목은 "프렌즈4블록". 같은 모양의 카카오프렌즈 블록이 2×2 형태로 4개가 붙 programmers.co.kr 접근 문제에서 주어진 조건대로 구현하면 되는 문제이다. 따라서 아래와 같은 로직으로 구현하였다. - 2x2크기로 같은 것이 붙어있는지 확인한다. - 위의 조건에 부합하는게 있다면 해당 인덱스에 1로 표시한다. - 1로 표시한 것의 개수를 구하고 1로 표시된 것은 비어있다는 의미로 0으로 표시한다. - 위의 블록이 아래로 이동하도록 한다. ..

https://programmers.co.kr/learn/courses/30/lessons/17677 코딩테스트 연습 - [1차] 뉴스 클러스터링 뉴스 클러스터링 여러 언론사에서 쏟아지는 뉴스, 특히 속보성 뉴스를 보면 비슷비슷한 제목의 기사가 많아 정작 필요한 기사를 찾기가 어렵다. Daum 뉴스의 개발 업무를 맡게 된 신입사원 튜브 programmers.co.kr 접근 다중 교집합과 합집합을 어떻게 구현할지를 결정하면 다른 조건은 쉽게 처리할 수 있었다. 먼저 나의 풀이에서는 문자열을 두 글자씩 끊어서 새로운 리스트를 생성한 후에 리스트 A에 있는 문자가 B에 있으면 교집합 리스트에 넣고 해당 문자를 B에서 삭제한다.. 이 과정에서 해당 문자가 알파벳이라면 합집합 리스트에 넣는다. 위의 과정을 거친 ..

https://www.acmicpc.net/problem/15684 15684번: 사다리 조작 사다리 게임은 N개의 세로선과 M개의 가로선으로 이루어져 있다. 인접한 세로선 사이에는 가로선을 놓을 수 있는데, 각각의 세로선마다 가로선을 놓을 수 있는 위치의 개수는 H이고, 모든 세로선 www.acmicpc.net 접근 먼저 사다리를 어떻게 모델링할 것인지 정했다. 사다리를 2차원 리스트로 표현하였다. 사다리를 타고 내려오다가 1을 만났을 때 오른쪽으로 이동하도록 하고, 왼쪽에 1이 존재하면 왼쪽으로 이동하도록 하였다. 따라서 2차원 리스트에서 1은 현재 위치와 오른쪽이 이어져있다는 의미이다. 이제 이를 활용하여 1번부터 N번까지 사다리를 타고 내려왔을 때 모든 열이 처음과 같은 위치를 가리키고 있을 때 ..

자바스크립트의 Nullish Coalescing(null 병합 연산자 ??)를 알게된 후에 null과 undefined의 차이를 정확히 알지 못한다는 것을 깨달았고 이번 기회에 정확한 개념을 짚고넘어갈 필요가 있었다. 먼저 null 병합 연산자를 공부하면서 왜 null과 undefined의 차이를 알아야했는지 살펴보자. 아래의 코드는 어떠한 문자열을 입력받아 출력하는 함수인 printMessage를 작성한것이다. 이때 전달받은 인자가 null 또는 undefined일 때는 "Empty Message"를 출력하게된다. 하지만 아래의 코드는 함수형 프로그래밍 관점에서 작성했을 때 좋은 코드는 아니다. 왜냐하면 if문과 같은 제어문을 사용하여 message를 "어떻게"에 치중되어있기 때문이다. 이를 좀 더 직..

OWASP에서 가장 리스크가 큰 것은 SQL 인젝션 암호화 실무에서는 복호화 불가능한 SHA256을 많이 쓰임 시큐어 코딩은 개발된 소프트웨어의 소스 코드에서 보안 취약점을 제거하고 설계 및 구현 단계에서 보안 약점을 고려하여 시스템을 안전하게 유지할 수 있도록 코딩하는 것이다. 그렇다면 어떠한 보안 취약점을 고려하여 설계해야하는지 대표적인 취약점들과 방어할 수 있는 방법들을 알아보자. SQL 인젝션 OWASP(오픈소스 웹 어플리케이션 보안 프로젝트)에서는 웹에 대한 보안 취약점 10개를 발표했다. 그 중 가장 취약한 것은 인젝션에 관한 내용이다. 대표적으로 SQL 인젝션은 사용자가 입력한 데이터에 대해 검증 단계를 거치지않아 공격자가 데이터 입력 후에 DB 쿼리 로직을 변경하는 것이다. 이를 예방하기 ..

자바스크립트는 비동기 처리를 위해 콜백 함수를 활용한다. 하지만 콜백 함수를 계속해서 사용하면 콜백 헬로 인해 가독성이 떨어지고 에러를 처리하기도 어려워진다. ES6에서는 이를 해결하기 위해 Promise를 도입하였다. 이전에 동기와 비동기에 대해 공부를 하면서 Promise를 간략하게 알아봤는데 프로젝트를 하면서 Promise를 사용하게 되었고 확실히 개념을 잡고 정리를 해야할 필요성이 생겼다. 먼저 비동기가 무엇인지 알아보자. 자바스크립트 엔진은 하나의 태스크만 실행할 수 있는 싱글 스레드로 작동하기 때문에 한 번에 하나의 함수만 실행할 수 있다. 다음 코드를 보자. 싱글 스레드이기 때문에 apple 함수를 호출하면 apple 함수가 실행이 될 동안 banana 함수는 실행되지 않는다. "apple"..

프로젝트를 진행하면서 사용자 인증을 위해 JWT 토큰 기반의 인증을 하였다. 하지만 JWT 토큰 기반은 제한시간을 설정해둘 수 있는데 배포 전에 테스트할 때는 굉장히 오랜 시간으로 설정을 해두었다. 하지만 실제 배포했을 때는 적당한 시간을 고려하여 JWT 토큰을 변경해줘야 하는데 이렇게 되면 서비스를 이용하다가 갑자기 로그아웃이 되는 이슈가 발생하지 않을까?라는 생각을 하였다. 그리고 토큰 기반의 인증 이외에 어떠한 사용자 인증 방법이 있는지 알아봤고 세션 기반의 인증 방식도 있다는 것을 알 수 있었다. 이번에는 토큰 기반의 인증과 세션 기반의 인증의 차이점을 알아보고 각각의 인증 방식의 장점과 단점을 알아보기로 하였다. 먼저 인증 방법에 대해 알아보기 전에 HTTP의 특징을 간단하게 알면 좋을 것 같다..

https://programmers.co.kr/learn/courses/30/lessons/12916 코딩테스트 연습 - 문자열 내 p와 y의 개수 대문자와 소문자가 섞여있는 문자열 s가 주어집니다. s에 'p'의 개수와 'y'의 개수를 비교해 같으면 True, 다르면 False를 return 하는 solution를 완성하세요. 'p', 'y' 모두 하나도 없는 경우는 항상 True를 programmers.co.kr 접근 먼저 입력받은 문자열을 모두 소문자로 변환한다. 그리고 한 개의 문자와 문자열을 전달받아 문자열 내의 문자의 개수를 반환하는 함수를 만들었다. 이후 반환된 개수를 변수에 저장하고 두 개의 변수를 비교하여 같으면 true, 다르면 false를 반환한다. 구현 - 입력받은 문자열 s를 소문..