본문 바로가기

전체 글

(49)
알고리즘 문제 8 function isValid(s) { // 여기에 코드를 입력해주세요. const splitStr = s.split(''); let box = [] for(const value of splitStr) { if(value === '[' || value ==='{' || value === '(') { box.push(value); } else { let popValue = box.pop() if(value ===']') { if(popValue !== '[') { return false } else if (value === ')') { if(popValue !== '(') { return false } else if (value === '}') { if(popValue !== '{') { return fa..
React로 인스타그램 피드창 댓글 업로드 구현 리액트로 인스타그램의 피드창에서 댓글 업로드 하는 기능을 구현해봤다. 바닐라 자바스크립트에서는 querySelector로 Dom요소를 가지고와서 addeventListener로 동적인 이벤트를 할당해줬다. 리액트에서는 완전히 다르다. 기본적으로 리액트에서는 어떤값이 변할때마다 화면에 영향을 줄 수 있는 값들은 state라는 컨테이너에서 관리해주는게 중요하다!! 변경된 state값이나 동적인 이벤트를 실행하는 함수를 props로 넘겨줘서 작동시킨다. import React, { Component } from 'react'; import './Main.scss'; import MainRight from './MainRight'; import Feed from './Feed'; class Main extend..
알고리즘 문제 7 문제에 접근하는 방법은 다양하지만 Set자료형을 통해서 문제를 해결했다. Set자료형은 받은 값에서 중복된값들을 제거한 결과값을 반환해준다. function moreThanHalf(nums) { let answer; const setNums = new Set(nums) const numsObject = {} for(let value of setNums) { numsObject[value] = 0 } for(let i=0; i= nums.length/2) { answer = Number(key) } } return answer } s..
알고리즘 문제 6 로마 문자열을 받으면 숫자로 바꿔주는 문제이다. 일단 문자열에 따른 숫자를 대칭시켜주는걸 객체로 관리를 해줘야된다. 로마 문자열을 숫자로 읽는법은 왼쪽부터 차례대로 더해주는데 대신 조건은 앞에 있는 문자가 뒤에 있는 문자보다 크거나 같을때 더해주는거다. 만약 만약에 있는 문자가 뒤에 있는 문자보다 작다면 그 문자열의 값은 빼줘야 된다. function romanToNum(s) { const numberSymbol = { I: 1, V: 5, X: 10, L: 50, C: 100, D: 500, M: 1000, } const box = s.split(''); let num = 0; for (let i=0; i
TIL 14 React로 인스타그램 로그인 구현(setState, 삼항연산자) 이전에 바닐라 자바스크립트로 구현했던 인스타그램 로그인창을 구현했던걸 이번에는 리액트로 똑같이 구현하는걸 시도했다. 하면서 많은 시행착오들을 겪었는데 이를 통해서 리액트에 좀 더 가까워지게 된 좋은 경험이됐다. 1. 최상단 요소에 height 100% 주는법 리액트를 쓰지않고 그냥 웹페이지 최상단에 height 100%를 주고 시작할때 html, body에 height:100%을 주면 해결이 되지만 이는 리액트에서는 하나를 더 추가해야된다! 리액트는 단하나의 index.html 파일 하나로 이루어져있고 우리가 만드는 모든 내용들은 저 안에 속해 있다. 그래서 css파일에다가 body, html, #root{ height: 100% }을 줘야 최상단 요소에 비로소 적용이 된다! 2. setState로 st..
알고리즘 문제 5 배열에 들어가있는 문자열들에서 공통으로 시작되는 단어를 추출하는 문제이다. 처음에 내가 구현하려는 방법은 배열에 0번 인덱스에 들어가있는 단어들을 for..of문으로 작성을한 후 그 단어들이 같은 인덱스 순서에 존재하는지 단어 하나하나 다 검사하는 로직으로 풀려고 했다. for(let value of strs[0]) { for(let i=1, i { let prefix = strs[0]; if(strs.length === 0){ prefix = ""; } for(let i=1; i
알고리즘 문제 4 인자로 들어온 숫자가 뒤집었을때랑 같은지 판별하는 문제이다. 이 문제에서 가장 먼저 생각해야할 것은 음수가 들어왔을때 바로 false를 리턴해주는거다. 1. 풀이 1 양수일때는 숫자를 문자열로 타입을 변환한뒤 하나는 split으로 순서대로 나열 하나는 reverse()를 이용해서 뒤집어서 나열한다. 근데 바로 numArr === revNumArr을 비교해서 판별하면 더 쉬울텐데 그렇게 못하는 이유는 자바스크립트에서 배열을 비교하면 배열에 들어가있는 값들이 같은지 확인하는게 아니라 배열이 할당된 변수의 메모리 주소를 비교한다. 그래서 값을 확인하기위해서는 for문을 통해서 각자 인덱스에 접근해서 맞는지 비교해야된다. 반복문을 돌면서 바로 값이 다르면 false를 반환하고 함수를 끝내고 만약 둘의 배열값들이..
알고리즘 문제 3 중복된 알파벳이 없는 가장 긴 단어를 반환하는 문제다. 처음에는 예를 들어서 입력된 단어가 'abcdabc'이면 중복된 알파벳 없는 단어를 하나의 배열에 전부 다 담아서 그 값들 중에서 길이가 긴 값을 반환하려고 했다. 너무 비효율적이고 중간에 오류도 많이나서 포기했다. 모범 답안은 빈 배열에다가 문자열 요소를 하나씩 추가하다가 중복된 단어가 배열에 존재하면 중복된 단어 앞에서부터 배열을 slice를 한후 다시 추가하는 방식으로 풀이하는게 가장 깔끔하다는걸 검색해서 찾았다. const getLengthOfStr = str => { let sliceStr = []; let lastStr = 0; for (let i = 0; i