전체 글 35

[JS]강의록-객체지향 프로그래밍(생활코딩)

[JS]강의록-객체지향 프로그래밍(생활코딩) Status: JS 객체란? 서로 연관된 변수와 함수를 그룹핑하고 이름을 붙인 것 method 객체에 소속되어있는 함수를 메소드라고 칭함 constructor new를 붙여서 객체를 생성하는 생성자 함수constructor를 사용하면 좋은 점: 객체를 원하는대로 찍어내고 재생성할 수 있다. constructor가 하는 일 2가지 객체를 만든다 객체의 초기 상태(prototype)를 세팅한다 function Person(name, first, second, third){ this.name=name, this.first=first, this.second=second, this.third=third, this.sum=function(){ return this.fir..

Javascript 2022.02.05

[NextJS] Link 태그와 href의 관계

git에서 더 편하게 보기 https://github.com/uu29/TIL/blob/main/%5BNextJS%5D%20Link%20%E1%84%90%E1%85%A2%E1%84%80%E1%85%B3%E1%84%8B%E1%85%AA%20href%E1%84%8B%E1%85%B4%20%E1%84%80%E1%85%AA%E1%86%AB%E1%84%80%E1%85%A8.md GitHub - uu29/TIL Contribute to uu29/TIL development by creating an account on GitHub. github.com next.js에서 Link는 페이지 이동을 위해 꼭 써야 하는 컴포넌트다. 일반적으로 바닐라 자바스크립트에서는 태그로 쓰지만, next에서는 Link라는 컴포넌트를 제공..

NextJs 2021.12.28

(javascript 기초) Array.sort() 배열 순서 정렬 메소드

실무에서도 많이 쓰이지만, 특히 알고리즘에서 매우 빈번하게 등장하는 자바스크립트의 Array.prototype.sort에 대해 알아보자. sort 정렬하는 메소드 (1) array의 각 원소를 일시적으로 문자열로 치환하여 정렬한다. (2) 원본 배열을 변경한다. let arr = ['banana', 'earth', 'red', 'blue']; arr.sort(); console.log(arr); // ['banana', 'blue', 'earth', 'red'] arr = [1, 150, 39, 84, 6] arr.sort(); console.log(arr) // [1, 150, 39, 6, 84] -> 문자열로 취급하였기 때문 숫자 오름차순으로 정렬하고 싶다면? 크기를 비교하는 callback함수를 인..

Javascript 2021.12.26

[프로그래머스 코딩테스트] 완전탐색 > 모의고사 (level 1)

문제 보러 가기: https://programmers.co.kr/learn/courses/30/lessons/42840 코딩테스트 연습 - 모의고사 수포자는 수학을 포기한 사람의 준말입니다. 수포자 삼인방은 모의고사에 수학 문제를 전부 찍으려 합니다. 수포자는 1번 문제부터 마지막 문제까지 다음과 같이 찍습니다. 1번 수포자가 찍는 programmers.co.kr 나의 풀이: (1) 1, 2, 3번 학생의 답을 loop에 넣고 맞는지 틀린지 찾아서 점수를 매긴다. 페이지네이션 원리와 비슷하다. answers의 index을 각 학생의 점수의 길이로 나눈 나머지를 구한다. %을 사용 (2) scores라는 배열을 만들고 배열을 [n번 학생, n번 학생의 점수]로 만든다. (3) scores을 좌표정렬 해준다..

코딩테스트 2021.12.26

[Next.js + TypeScript] 설치부터 세팅까지

- git에서 더 편하게 보기: https://github.com/uu29/TIL/blob/main/%5BNext%20%2B%20TS%5D%20%E1%84%89%E1%85%A5%E1%86%AF%E1%84%8E%E1%85%B5%E1%84%87%E1%85%AE%E1%84%90%E1%85%A5%20%E1%84%89%E1%85%A6%E1%84%90%E1%85%B5%E1%86%BC%E1%84%81%E1%85%A1%E1%84%8C%E1%85%B5.md GitHub - uu29/TIL Contribute to uu29/TIL development by creating an account on GitHub. github.com 1. CNA 로 프로젝트 만들기 yarn create next-app {PROJECT-NAM..

NextJs 2021.11.28

[코딩테스트] 2018 카카오 블라인드 테스트 - [1차]비밀지도 (Javascript)

문제 보러 가기: https://programmers.co.kr/learn/courses/30/lessons/17681 코딩테스트 연습 - [1차] 비밀지도 비밀지도 네오는 평소 프로도가 비상금을 숨겨놓는 장소를 알려줄 비밀지도를 손에 넣었다. 그런데 이 비밀지도는 숫자로 암호화되어 있어 위치를 확인하기 위해서는 암호를 해독해야 한다. 다 programmers.co.kr 나의 풀이: https://programmers.co.kr/learn/courses/30/lessons/17681/solution_groups?language=javascript&type=my 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업..

코딩테스트 2021.11.27

[코딩테스트] 2019 카카오 개발자 겨울 인턴십 - 크레인 인형뽑기(Javascript)

문제 보러 가기: https://programmers.co.kr/learn/courses/30/lessons/64061 코딩테스트 연습 - 크레인 인형뽑기 게임 [[0,0,0,0,0],[0,0,1,0,3],[0,2,5,0,1],[4,2,4,4,2],[3,5,1,3,1]] [1,5,3,5,1,2,1,4] 4 programmers.co.kr 나의 풀이: https://programmers.co.kr/learn/courses/30/lessons/64061/solution_groups?language=javascript&type=my 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. program..

코딩테스트 2021.11.22

[코딩테스트] 2020 카카오 인턴십 - 키패드 누르기 (Javascript)

문제 링크: https://programmers.co.kr/learn/courses/30/lessons/67256 코딩테스트 연습 - 키패드 누르기 [1, 3, 4, 5, 8, 2, 1, 4, 5, 9, 5] "right" "LRLLLRLLRRL" [7, 0, 8, 2, 8, 3, 1, 5, 7, 6, 2] "left" "LRLLRRLLLRR" [1, 2, 3, 4, 5, 6, 7, 8, 9, 0] "right" "LLRLLRLLRL" programmers.co.kr 나의 풀이: https://programmers.co.kr/learn/courses/30/lessons/67256/solution_groups?language=javascript&type=my 프로그래머스 코드 중심의 개발자 채용. 스택 기..

코딩테스트 2021.11.21

[ReactJS] 메모제이션으로 리액트 성능을 올려보자

*깃헙에서 보기: https://github.com/uu29/TIL/blob/main/%5BReactJS%5D%20메모제이션으로%20리액트%20성능을%20올려보자.md 메모제이션(Memozation)이란? 기존 값을 기억해놨다가 특정 액션이 실행된 뒤의 값이 이전 값과 동일하면 이를 재활용하는 기법. Memoized된 내용을 재사용하여 렌더할 시, 가상 DOM에서 바뀐 부분을 확인하지 않아 성능이 향상됨. 메모제이션 전에 꼭 알아야 할 리액트 특징 리액트가 상태관리를 할 수 있는 이유는 가상 DOM을 만들어놓고 값이 바뀔 때 마다 컴포넌트를 새로 그리기 때문. 값을 비교하고 어디서 해당 값을 업데이트해줘야 하는지 찾지 않고 무조건 가상 DOM을 새로 그리기 때문에 상태관리가 쉬운 것이다. 하지만 이렇게 ..

리액트 2021.07.18

Mac OS 에서 crontab 사용 - 크롤러 크론탭으로 돌려보기

크론탭은 어떤 스크립트를 특정 기간 또는 시간 마다 가동시킬 때 사용하는 것으로 맥이나 리눅스에는 내장되어있다. 내 프로젝트에 크롤러가 있는데 나중에 크론탭으로 상태체크, 재실행 등을 해야할 것 같아서 오늘 테스트를 해보았다. [Mac OS에서 크론탭 실행하기] 1. crontab -e ​ 터미널을 키고(나는 zsh을 사용했다) crontab -e 명령어를 실행한다. 돌고 있는 크론탭이 없으면 vi/vim 편집기가 열리고 빈파일이 생성된다. 2. 크론탭 스크립트 실행: 크론탭의 주기는 {분} {시} {일} {월} {요일} 이다. 구글링하면 더 자세히 나온다. (1분 마다 실행시키고 싶으면) * * * * * {가상환경 경로} {실행시킬 파일 경로} >> {저장할 로그파일 경로} 2>&1 wq 로 저장 후..

개발일지 2021.01.12