본문 바로가기

JavaScript85

JavaScript - 약수 구하기 약수는 어떤수를 나누면 나머지 없이 딱 떨어지는 수이다. 예를 들어 4 / 2 = 2 ... 0 이므로 2는 4의 약수이다. 4 / 3 = 1 ... 1 이므로 3은 4의 약수가 아니다. javaScript 에서 약수인지 확인하기 위해서는, number % index === 0 의 조건에 부합해야 한다. (나머지가 0 이여야 하는 약수이기 때문이다.) 아래의 약수의 갯수를 구하는 함수이다. function getDivisorCount (num){ let count = 0; // 갯수 구할 값 초기화 for(let j=0; j < num + 1; j++){ // num 숫자만큼 반복문을 돌려주자 if(num % j === 0) { console.log(j); // 이 j index 가 num 의 약수가 된.. 2022. 10. 22.
JavaScript - 두 배열 비교해서 특정 값 찾기(splice, filter, includes) all 는 [ 0 - 9 까지의 숫자배열 ] 이고, part는 그 중 [ 몇몇 숫자만 들어있는 배열 ] 이다. 원래는 all 의 모든 숫자들을 가지고 있어야 되는데, 몇몇 녀석들이 도망가서 part 만 남았다. 도망간 녀석들이 (차집합) 누군지 찾고자 한다. 즉, 두배열을 비교해서 특정값을 찾아보려고 한다. 나는 두가지 풀이방식으로 풀어보았다. 아래에 필요한 배열들을 보자. [ 5랑 9 ] 가 집나갔으니 얘네만으로 이루어진 배열을 구할 것이다. // 0 - 9 까지의 숫자중 5, 9 가 없다. // [5,9] let all = [1,2,3,4,5,6,7,8,9,0]; let part = [1,2,3,4,6,7,8,0]; 1. 2중 포문과 splice를 이용한다. 2중 포문으로 검사한 뒤, all 값과 =.. 2022. 10. 18.
JavaScript 알고리즘 (12) Naive Search 잊을만하면 계속 돌아오는 알고리즘 포스팅 ✌ 오늘 배워본 알고리즘은 pattern searching 알고리즘 중 하나인 Naive Search (문자열 검색 알고리즘) 이다. 패턴 검색 알고리즘은 문장에서 원하는 문자열을 찾는 알고리즘을 말한다. 전체문자열에서 문자 하나하나 비교해가면서 원하는 단어가 맞는지 확인하는 것이 핵심이다. Pattern Searching algorithm is string matching algorithm which is used to find a pattern or a substring in another string. function naiveSearch(long, short){ var count = 0; // 갯수 초기값 세팅 for(var i = 0; i < long.l.. 2022. 10. 10.
CSS - 모달 내 특정 div 영역에만 scroll 적용하기 모달 안의 리스트에만 부분적으로 scroll 을 적용하려고 한다. 대충 감잡고 overflow 속성을 이용하면 되겠다 싶었는데 정확히 어떤식으로 적용해야 되는지 기억이 안났다. 그래서 잊어버릴까봐 기록해본다 :) (다음에는 overflow 속성에 대해 자세히 공부해보아야겠다!) 부모에 block 속성을 넣어주고, 스크롤 되야하는 영역에는 overflow & height 를 넣어주면 되겠다. // display: block; 새발자 테스트 모달 // height: 50vh; overflow-y: auto; ...list items 닫기 2022. 9. 28.
JavaScript 알고리즘 (11) Binary Search 요즘 알고리즘 공부하는 맛을 알게 된 새발자🐣 처음에는 아무것도 모르고 듣기만 했는데, 2번 보고 3번 보니 이해가 가면서 재미가 있다. 오늘은 Searching Algorithm 의 두번째 방법인 Binary Search (2진 탐색) 을 공부해보았다. Linear search 가 1번부터 순서대로 검사하는 방식이었다면, Binary search 는 가운데에서 반으로 쪼개서 검사한다. (고구마 먹을 때 반으로 쪼개서 먹듯이) 핵심만 말하자면 배열을 반으로 쪼개서 둘중 하나를 계속 버리고 또 쪼개서 버리고 이런식으로 추려나간다. The algorithm is based on a well know domain divide and conquer technique. It repeatedly breaks dow.. 2022. 9. 25.
JavaScript 알고리즘(10) Linear Search Linear Search 는 값을 찾을 때 순서대로 하나하나씩 다 검사하는 searching algorithm 이다. Linear Search is defined as a sequential search algorithm that starts at one end and goes through each element of a list until the desired element is found, 우리가 흔히 알고 있는 for문을 사용하여 하나하나씩 검사하는 방법을 사용한다. 이게 가장 기본적인 방식이고 이 알고리즘을 기준으로 여러 알고리즘들을 비교할 수 있을 것 같다. function linearSearch(arr, value) { for(var i = 0; i < arr.length; i++){ if(.. 2022. 9. 12.
JavaScript 알고리즘(9) Recursive function 오늘 소개할 친구는 재귀함수이다. 알고리즘 공부하는 중 나온 친구이다. 근데 꽤 흥미로운 친구라서 소개 겸 공부겸 아무튼 참지못하고 포스팅을 올려본다. JavaScript 알고리즘(9) Recursive function 재귀함수는 자기자신 속에서 또 호출되는 함수를 의미한다. (마치 거울의 방에서 끝없이 내 자신이 보이는 느낌이랄까 ) 예시로 들 코드는 모든 숫자의 합과 곱을 구하는 공식이다. 맨처음 코드를 공부하면서 배웠던 함수이며, 실무에서도 은근히 많이 사용하는 추억이 담긴 함수인데, 이것을 재귀함수로 구현하며 밀려오는 감동이란 🤩 ** 반드시 base case 를 만들어놓아야만 한다. 그래야 무한루프의 굴레에 빠지지 않는다. 모든 수의 합 // regular way function sumRange.. 2022. 9. 6.
CSS - input [type="range"] 투명하게 만들기 (feat. 브라우저 별 속성 -web-kit-appearance) 슬라이더 바를 만들기 위해 을 사용하였다. 그랬더니 요런 귀여운 슬라이더가 나왔다. 하지만 native 태그를 사용하게 되면 브라우저별 호환성이 좋지 않아 ui 가 깨진다. (특히 IE10 에서는 아예 호환x) 그래서 input 을 투명하게 만들어 기능만 동작하게 하고 + 그 위에 예쁜 슬라이더 ui 를 올려서 꼭두각시 노릇을 하게 만드려고 한다. CSS - input [type="range"] 투명하게 만들기 (feat. 브라우저 별 속성 -web-kit-appearance) HTML setValue(e.target.valueAsNumber)} /> CSS input[type:range] { // 인풋창 투명하게 만들기 appearance: none; /* 공통 */ // 인풋창 포커스 시 아웃라인 제.. 2022. 9. 5.
CSS - white-space 란 문자열 안에 escape 문자들을 사용하다보니, white-space 속성을 함께 사용하게 되었다. 습관적으로 사용하는 것 말고 어떤 속성인지 자세히 알아보고 싶었다. 한번 익히고 나면 평생 내 것이 된다. 그럼 공부하러 가보자 CSS - white-space 란 텍스트에서 한 줄 혹은 한 칸을 띄울 때 공백이 생긴다. 이것을 white space 라고 한다. // 공식문서에서는 문자 사이의 vertical 혹은 horizontal 공간으로 정의 내리고 있다. Whitespace refers to characters which are used to provide horizontal or vertical space between other characters. css 의 white-space 는 이 공백을.. 2022. 8. 31.
반응형