본문 바로가기

JavaScript85

JavaScript - 소수구하기 (에라토스테네스의 체) 소수는 자기 자신과 1 로만 나뉘어지는 수이다. 예를 들어 5 는 1 로만 나뉘어 질 수 있다. 자, 소수를 구하는 판별식을 정리해보았다. 이제 당신은 이걸 가지고 응용하기만 하면 된다 :) JavaScript 에서 소수인지 검사하기 위해서는, For 문으로 검사를 할 때, { number 이 0, 1 이면 탈락 → 1은 소수가 아님 number 가 2 이면 소수이다 → 2은 소수이다 number % index === 0 이라는 조건에 들거든 탈락 → 자기자신과 1로만 나뉘어져야 된다는 소수의 조건 성립이 X) } 방법 1) 반복문 함수 판별식 함수는 보기에 너무 간단하다. 하나하나씩 다 돌려서 소수에 부합하는 것을 찾아낸다. 시간복잡도는 O(N) 으로 무난하지만, 해당하지 않는 숫자까지 일일히 하나하나.. 2022. 12. 30.
JavaScript - e.preventDefault() 와 e.stopPropagation() 의 차이점 특정 이벤트를 막고 다른 동작을 실행해야 하는 상황이 있다. 아래와 같이 안의 를 클릭하면, onClick 이벤트가 실행되야 하지만 현실은 다르다. href 를 통해 링크로 이동한다. console.log('클릭'}/> 그 이유는 이벤트 버블링 때문이다. 자식 → 부모 순으로 이벤트가 실행이 된다. 자식(온클릭) 이벤트 후, 부모(링크 이동) 이벤트까지 순서대로 실행되는 것이다 이럴 때 우리는 e.preventDefault()와 e.stopPropagation() 를 사용해서 부모까지의 흐름을 끊어주어 해결하였다. 그 시점에서 정확히 그 둘의 차이가 무엇인지 궁금해졌다. 실제 버블링 이슈를 어떻게 해결했는지 궁금하시다면 ... ? (아래 포스팅 클릭 ↓↓↓) React(55) 겹친 영역에서 자식 이벤트만.. 2022. 12. 26.
JavaScript - 정규식 전화번호 입력시 하이픈(-) 추가하기 하이픈 (-) 없이 전화번호를 숫자만으로 입력했을때, 하이픈(-) 을 자동으로 추가해주는 정규식을 알아보자 아래와 같이 숫자로만 입력하면 → 하이픈이 붙어서 리턴된다. 정규식을 이용해보았다. const phone = 01012340000; phone .replace(/ /g, '') // 공백이 들어있다면 지워주고 .replace(/^(\d{2,3})(\d{3,4})(\d{4})$/, `$1-$2-$3`); // 숫자그룹을 나눠 사이에 하이픈(-)추가 // 결과 010-1234-0000 관련 개념 포스팅 정규식을 자세히 파보기 위해 관련 개념을 정리한 포스팅이다. JavaScript - 정규식 Regular expression updated 07/30/22 오늘은 정규식의 날이었다 정규식이 나를 애먹였지.. 2022. 12. 2.
JavaScript - 문자열인 숫자 여부 확인하기 타입은 String 인데 무늬만 숫자인 경우가 있다. '153' 이런 경우가 그렇다. 숫자인 척 위장한 스트링 녀석들의 값이 숫자인지 확인해주는 내장 메소드를 알아보자. (실제로 적용해본 코드 중심으로 하나씩 업데이트해나갈 예정) isNaN() console.log('aaa', isNaN('aaa' as any)); // true console.log('132', isNaN('13579' as any)); // false console.log('1,399', isNaN('1,399' as any)); // true ** BUT 여기서 '1,234' 세자리 콤마로 분리되는 숫자값이 들어가게 되면 isNaN('1,234' as any)는 string 으로 취급한다. 2022. 11. 26.
JavaScript - scrollIntoView() 이란 화면 바깥으로 삐져나가 스크롤해야만 볼수있는 메뉴 탭이 있다. 살짝 화면을 삐져나간 메뉴를 클릭하면, 메뉴탭은 삐져나간 그자리 그대로 있고, 내용만 바뀐다. 뭔가 이상하지 않은가? 보통은 메뉴을 누르면 자동으로 스르륵 화면 중간쯤 알아서 스크롤되는 동작에 익숙하지 않은가? 그 기능을 위해 javaScript 내장메서드인 scrollIntoView() 를 알아보자 JavaScript - scrollIntoView() 이란 이 메소드는 scrollIntoView()가 호출된 엘레멘트를 유저가 볼수있는 부분으로 상위 컨테이너를 스크롤 한다 The Element interface's scrollIntoView() method scrolls the element's ancestor containers such t.. 2022. 11. 8.
JavaScript - 객체에서 undefined 값만 골라 제거하기 오늘은 객체의 값을 동적으로 넣어주고 있었다. 동적으로 넣다보니 값이 없을 때는 undefined 가 되었다. api의 body 에 쓸때없는 property 를 보내주고 싶지 않아 여러 방법을 고민하다가 undifned 값인 properties 만 쏙쏙 골라 제거시키는 함수를 스택오버플로우에서 참고해서 정리해보았다 JavaScript - 객체에서 undefined 값을 제거하기 여기에 쓸때없는 값이 들어간 객체가 있다. 보기만 해도 지저분해서 참을수 없다. 객체 값이 undefined 인 것만 골라서 멀리 쫓아버리자 const obj = { a: undefined; b: undfined; c: '유일한 값', d: [] e: { e1: undefined, e2: undfined, }, } undefine.. 2022. 11. 4.
JavaScript - 최소공배수 구하기 최소공배수를 구하기 위해 대표적인 두가지 방법이 있다. 쉽게 구하기위해서는 최대공약수를 먼저 구해야 한다. 먼저, 최대공약수를 구해보자. 아래 포스팅 참고 ↓ ↓ ↓ JavaScript - 최대공약수 구하기 (유클리드 호제법) 예전에 수학시간에 최대공약수 / 최소공배수 구하는 것은 누워서 껌먹기 였다. 학원에서 가르쳐준 대로 계산하면 답이 나왔기 때문이다. 당연히 연필들고 공책에 푸는 소인수분해의 관점에서 devbirdfeet.tistory.com JavaScript - 최소공배수 구하기 여기서는 최대공약수를 먼저 구했다고 가정하겠다. - 최소공배수 두 수의 공통된 배수 중에서 가장 작은 수 5의 배수 5, 10, 15, 20, 25, 30, 35, 40 ... 6의 배수 6, 12, 18, 24, 30.. 2022. 11. 3.
JavaScript - 최대공약수 구하기 (유클리드 호제법) 예전에 수학시간에 최대공약수 / 최소공배수 구하는 것은 누워서 껌먹기 였다. 학원에서 가르쳐준 대로 계산하면 답이 나왔기 때문이다. 당연히 연필들고 공책에 푸는 소인수분해의 관점에서 접근하면 머리로 이해하기는 쉬운일이지만 혹시모를 거대한 수를 다룰 가능성이 있는 IT인의 관점에서는 알고리즘을 사용하여 푸는 편이 효율적이다. 그리하여 유클리드 호제법이라는 알고리즘과 최대공약수를 구하는 법을 알고자 한다. JavaScript - 최대공약수 구하기 (유클리드 호제법) - 최대공약수 두 수의 공통된 약수 중에서 가장 큰 수 4의 약수 1, 2, 4 16의 약수 1, 2, 4, 8, 16 → 4와 16의 최대공약수는 4이다 - 유클리드 호제법 유클리드(Euclid)에 의해 기원전 300년경에 발견된 가장 오래된 .. 2022. 11. 1.
JavaScript - 객체 안 배열에 반복문 사용하기 요즘 객체를 가공하는 일이 부쩍 늘었다. 처음 공부를 시작하던 때, 데이터 가공이 내 맘대로 안되서 답답해하던 기억이 떠올랐다. 그때에 비하면 감사하게도 잘 가고 있다고 생각한다. 하지만 아직 가야할 길이 멀고 공부할 것은 많다! 자 객체를 다루러 가보자! JavaScript - 객체 안 배열에 반복문 사용하기 아래와 같은 형식의 객체를 만났다. ( 객체 안에 배열들이 늘어져있는 ... ) 당신의 미션은 이 배열들을 동적으로 출력하는 것이다. (자, 당황하지 말자.) 일단 객체를 반복해서 하나하나의 키 값(배열) 을 알아내고, 배열을 돌려서 하나하나 아이템들을 뽑아내보자. const obj = { a: ['apple', 'alarm', 'air'], b: ['bear', 'bee'], c: ['car',.. 2022. 10. 23.
반응형