Cho's study 웹공부정리

eslint.config 에 rule을 추가하던 도중 rules 속성의 타입이 어떻게 작동하는지 궁금하여 분석타입을 추적하다보면 /* Config.d.ts */type Severity = 0 | 1 | 2;type SeverityString = 'error' | 'off' | 'warn';type RuleLevel = Severity | SeverityString;type RuleLevelAndOptions = [RuleLevel, ...unknown[]];type RuleEntry = RuleLevel | RuleLevelAndOptions;type RulesRecord = Partial>; 이런식으로 rules 속성에 타입이 어떻게 정의되어 있는지 확인 할 수있다.먼저 Partial은 모든 속성을 옵..

'console' is not defined no-undef 에러해결eslint 에서 tseslint  설정 추가를 하던 도중 다음과 같은 에러가 발생하였다. 에러가 난 코드는 다음과 같다.test.tsclass Test { constructor() { console.debug('test'); }}new Test();문제 원인eslint 에서는 console 메서드를 사용하지 않는것을 권장 한다고 한다.공식문서 https://eslint.org/docs/latest/rules/no-console#rule-details해결방법eslint.config 설정 파일에 rules 에 다음과 같이 "no-console" : "off"를 추가하면 된다.경고만 뜨게 하고 싶다면 'warn'을 ..

export default { props: ['foo'], setup(props) { console.log(props.foo) } } props.foo 를 사용하기 위해서는 props 를 "명시적으로" 선언을 해야 한다. title => 정적으로 값이 전달된다. :title => 동적으로 값이 전달된다. export default { props: ['foo'], created() { // ❌ warning, props are readonly! this.foo = 'bar' } } props는 단방향 바인딩을 형성한다. 부모의 data 가 변경되면 자식 컴포넌트의 props.foo가 변경 되어야한다. 그이유는 자식컴포넌트가 부모 컴포넌트의 data 값을 변경하면 데이터 흐름을 이해하기 어려워지기 때문이다...

문제 : https://programmers.co.kr/learn/courses/30/lessons/42748 코딩테스트 연습 - K번째수 [1, 5, 2, 6, 3, 7, 4] [[2, 5, 3], [4, 4, 1], [1, 7, 3]] [5, 6, 3] programmers.co.kr 내가 푼 문제 풀이 : function solution(array, commands) { var answer = []; commands.forEach( el => { let result = array.slice(el[0]-1, el[1]).sort(function(a, b){ return a - b }) answer.push(result[el[2]-1]) }) return answer; } array.slice 메서드를..

문제 : https://programmers.co.kr/learn/courses/30/lessons/86051 코딩테스트 연습 - 없는 숫자 더하기 0부터 9까지의 숫자 중 일부가 들어있는 배열 numbers가 매개변수로 주어집니다. numbers에서 찾을 수 없는 0부터 9까지의 숫자를 모두 찾아 더한 수를 return 하도록 solution 함수를 완성해주세요. 제한 programmers.co.kr 내가 푼 정답 : function solution(numbers) { var result = []; for(let i=0;i pre + cur); } 0부터 10까지 for문으로 반복하여 해당 값을 배열에 넣은 뒤, .reduce 메서드를 사용하여 배열의 값에 합을 구한다. 다른 사람의 풀이 : funct..

문제 : https://programmers.co.kr/learn/courses/30/lessons/72410 내가 푼 정답 : function solution(new_id) { var answer = ''; //1단계 new_id의 모든 대문자를 대응되는 소문자로 치환합니다. //2단계 new_id에서 알파벳 소문자, 숫자, 빼기(-), 밑줄(_), 마침표(.)를 제외한 모든 문자를 제거합니다. //3단계 new_id에서 마침표(.)가 2번 이상 연속된 부분을 하나의 마침표(.)로 치환합니다. //4단계 new_id에서 마침표(.)가 처음이나 끝에 위치한다면 제거합니다. answer = new_id.toLowerCase() .replace(/[\^\[\]]|[^A-z0-9\.\_\-]/g,"") .re..

문제 : https://programmers.co.kr/learn/courses/30/lessons/81301 내가 푼 정답 : function solution(s) { var answer = 0; var engNumber = { zero : 0, one : 1, two : 2, three : 3, four : 4, five : 5, six : 6, seven : 7, eight : 8, nine : 9 } for(var eng in engNumber){ var re = new RegExp(eng ,"g"); s = s.replace(re,engNumber[eng]); } answer = parseInt(s); return answer; } 영단어를 숫자로 변환하게 위해 engNumber 객체를 생성하여..

BufferAttribute 메서드 에 넣는 배열의 꼭짓점 요소들의 좌표를 정리해보았다. 일단 이렇게 정리하여 참고용으로 쓰려고한다. 그리고 normal ( 법선) 의 좌표도 정리하려 했지만 잘 모르겠다. 아시는분 있으면 댓글좀..

if 를 이용한 DOM 요소 조작 함수 엘리먼트에 색상값을 확인한후 색상이 같은지 확인 한 후 그후, 다른색으로 변경할 것이다. const title = document.querySelector("#title"); const BASE_COLOR = "black"; const OTHER_COLOR = "#7f8c8d"; function handleClick() { const currentColor = title.style.color; if( currentColor === BASE_COLOR){ title.style.color = OTHER_COLOR; } else { title.style.color = BASE_COLOR; } } function init(){ title.style.color = BASE_..