JS57 JS, 버블링, 캡쳐링 [ 버블링 ] 한 요소에 이벤트가 발생하면 이 요소에 할당된 핸들러가 동작하고 이어서 부모 요소의 핸들러가 동작하며 가장 최상단의 조상 요소를 만날때까지 이 과정이 반복되면서 요소 각각에 할당된 핸들러가 동작함 즉 이벤트 버블링은 HTML에서 이벤트가 발생했을 때, 해당 요소에서 이벤트가 처리된 후 상위 요소로 이벤트가 전파되는 현상을 의미 ▶ 예시 FORM DIV P 가장 안쪽의 p태크를 클릭하게 되면 에 할당된 onclick 핸들러가 동작 바깥의 에 할당된 핸들러가 동작 그 바깥의 에 할당된 핸들러가 동작 document 객체를 만날 때까지, 각 요소에 할당된 onclick 핸들러가 동작 p태그를 누르게 되면 p → div → form 순서로 3개의 얼럿 창이 뜨게 됨 ▶ 버블링의 이벤트 위임 이벤트.. 2023. 12. 6. JS, 클로저 클로저는 함수와 함수가 선언된 어휘적 환경(Lexical Environment)의 조합 즉 함수 안에 함수를 선언한 환경에서의 관계를 의미함 해당 함수안에 함수를 선언한 환경은 내부 함수에서 외부 함수로 지역변수를 접근할 수 있지만 외부 함수의 실행이 끝나고 외부 함수가 소멸된 이후에도 내부 함수가 외부 함수의 변수에 접근할 수 있는 것을 의미함 자바스크립트는 함수를 리턴하고 리턴되는 함수가 클로저를 형성하기 때문에 접근이 가능함 클로저는 반환된 내부함수가 자신이 선언되었을때의 환경(Lexical Environment)에서의 스코프를 기억하기 때문에 접근이 가능함 function outerFn() { let x = 10; return function innerFn(y) { // innerFn 함수는 클로.. 2023. 12. 4. JS, charAt() [ charAt( ) ] 문자열에서 지정된 위치에 존재하는 문자를 찾아서 반환하는 함수 인덱스의 순번은 0부터 시작되고 마지막 인덱스의 순번은 -1로 매겨지게 됨 인덱스 문자열의 길이를 벗어나게 되면 빈 문자열을 반환함 charAt() 함수는 인덱스(index)로 주어진 값에 해당하는 문자를 반환 ▶ 사용방법 문자열.charAt(index) ▶ 예시 let str = "HELLO WORLD".charAt(0);//'H' 만약 코테를 풀경우 문자열에서 바로 인덱스로 문자를 찾게 될경우 문자열 길이를 벗어나게 되면 undefined가 됨 이럴경우 charAt()을 사용하면 빈문자열로 반환하므로 유용 let str = '' str[0]//undefined str.charAt(0)//'' 2023. 11. 29. JS, 약수구하기 기존의 반복문으로 주어진 수의 절반을 대상으로 확인하기를 하니 코테 문제 시간초과가 뜸 더 효율적인 방법이 필요하여 방법을 찾아보고 정리 [ 제곱근 사용하기 ] 약수를 구하고자 하는 수를 n이라고 하면 1 ~ √n 범위로 n의 약수를 구함 n의 약수를 나누었을 때 값 또한 n의 약수 √n의 값이 정수로 떨어질 경우 약수와 나누었을때의 값으로 넣은 약수가 중복되므로 중복제거를 해야함 ▶ 약수 구하는 코드 조건문 사용 const getDivisors = (num) => { let result = []; for(let i = 1 ; i a - b);//오름차순 정리 return result; } Set 사용 const getDivisors = (num) => { let result = []; for(let i.. 2023. 11. 23. JS, 에라토스테네스의 체 소수찾기 문제를 할때 반복문으로 풀게되면 효율성 테스트에서 시간초과로 실패가 뜸 이런 경우 에라토스테네스의 체 방법을 사용하면 효율적으로 문제를 풀어 효율성 테스트를 통과할 수 있음 [ 에라토스테네스의 체 ] 1부터 제외하고 2부터 N까지 자신을 제외하고 순차적으로 자신의 배수들을 지워가면 결국에는 소수들만 남는다는 원리 n까지가 아닌 √n까지만 검색해도 결과는 같음 ▶ 에라토스테네스의 체 과정 2부터 N까지 모든 정수를 적음 아직 지우지 않은 수 중 가장 작은 수를 찾음(이것을 P라고 하고 이 수는 소수) P를 지우고 아직 지우지 않은 P의 배수를 크기 순서대로 지움 아직 모든 수를 지우지 않았다면 다시 2번 단계부터 반복 ▶ 에라토스테네스의 체 코드 function solution(n) { let a.. 2023. 11. 23. null 병합 연산자 ?? null 병합 연산자(??) null 병합 연산자(nullish coalescing operator)는 ?? 를 사용하는 문법 여러 피연산자 중 그 값이 확정되어 있는 변수를 찾을 수 있음 헷갈릴수 있는게 ||(OR)과 똑같은 행동을 한다고 생각할 수는 있는데 ||은 0을 fasly한 값으로 보기 때문에 null, undefined, 0을 fasly하게 봄 그래서 0이 할당될수 있는 경우 null 병합 연산자를 사용하는게 정확함 예시 a ?? b a가 null도 아니도 undefined도 아니면 a 그 외에는 b x = (a !== null && a !== undefined) ? a : b; a ?? b와 위 코드와 동일한 동작을 함 연산자 우선 순위 ??의 연산자 우선순위는 5로 꽤 낮음 따라서 ??는.. 2023. 11. 12. JS, 최대공약수 최소공약수 구하기 최대공약수를 구할때 기본적으로 반복문을 돌려서 최대공약수를 구할수 있으나 유클리드 호제법을 이용하여 구하면 쉽게 간단하게 구할 수 있음 유클리드 호제법 두 수의 최대공약수를 구하는 알고리즘 2개의 자연수 A, B에 대하여 A를 B로 나눈 나머지를 r이라고 한다면(단, A>B) A와 B의 최대공약수는 B와 r의 최대공약수와 같음 이 성질에 따라 B를 r로 나눈 나머지를 r'을 구하고 다시 r을 r'로 나눈 나머지를 구하는 과정을 반복하여 나머지가 0이 되었을때 나누는 수가 A와 B의 공약수 예시 유클리드 호제법으로 24, 15의 최대 공약수 구하기 24 % 15 = 9 15 % 9 = 6 9 % 6 = 3 6 % 3 = 0 구현 function gcd(a, b){ return (a % b) === 0 ? .. 2023. 11. 3. JS, use strict / undeclared [ use strict(엄격모드) ] ES5부터 지원하는 use strict는 암묵적인 "느슨한 모드(Sloppy Mode)"를 해제하고 명시적인 "엄격 모드(Strict Mode)"를 사용하는 방법 JS의 제한된 버전을 선택함으로써 런타임시 JS 코드에 대하여 향후 버전의 ECMAScript에서 사용될 수 있는 일부 구문을 제외하는 등보다 엄격한 parsing 및 error handling을 자발적으로 시행하도록 적용함으로써 일반적인 코딩 실수나 안전하지 않은 동작을 포착함 strict 모드에서는 일반적인 JS의 의미에 몇가지를 변경함 JS오류는 아니지만 함정이 될 어떤 일을 오류가 발생하도록 변경하여 제거 코드의 문제를 더 빨리 알리고 소스로 더 빨리 안내하므로 결과적으로 디버깅이 쉬워짐 JS 엔진의.. 2023. 10. 31. JS, 소수점 오류 소수점 오류 JS에서 소수점 숫자 연산을 하면 가끔 생각지도 못한 오류가 발생함 내가 원하는 답이 아닌 이상한 답이 나오는 것 0.1 + 0.2//0.30000000000000004 원인 사람은 계산을 할때 10진법으로 사용하지만 컴퓨터는 0,1만 사용하는 2진법을 사용함 그래서 계산을 할때 10진법을 2진법으로 바꾸는 변환과정이 필요한데 소주 중 일부는 이 과정에서 무한 소수가 되어버림 하지만 컴퓨터 메모리에 한계가 있어 무한 소수를 다 담지 못하고 중간에 잘라서 유한 소수로 저장해버리는 것 이 과정에서 미세한 오차가 발생함 해결방안 .toFixed() (0.1 + 0.2).toFixed(2)//'0.30' toFixed()는 입력받은 숫자를 매개변수만큼 자리수를 반올림해 String으로 반환해주는 함.. 2023. 10. 21. 이전 1 2 3 4 5 6 7 다음
