본문 바로가기

반응형

분류 전체보기

(399)
[react] 리액트 환경에서 <input type =range> 사용 시 Uncaught TypeError: Cannot read properties of null (reading 'value') 가 뜬다면 아래와 같이 range의 속성값을 useState 에 저장하여 , 버튼을 조작하려는 상황에서 const [rangeVal,setRangeVal] = useState('') return ( { console.log(e.currentTarget.value); setRangeVal((rangeVal) => {return rangeVal = e.currentTarget.value}); }}> ) 에러와 함께, 백지와 같은 페이지를 만나게 된다면 sortbyDate.tsx:22 Uncaught TypeError: Cannot read properties of null (reading 'value') 다음과 같이 click 이벤트를 실행할 함수를 외부에 정의하면 에러가 해결된다. onClick 의 콜백함수 내에서 ..
[javascript] 함수의 매개변수 디폴트(기본) 값은 바꿀 수 있다. 함수는 일반적으로 다음과 같은 형태를 가진다. function myFun(매개변수1, 매개변수2){ //코드 } 즉, 함수의 식별자인 myFun의 ( ) 내 인자로는 매개변수를 가질 수 있고, 할당된 매개변수는 함수 스코프 내부에서 선언 및 할당된 변수의 역할을 수행한다. 또한 함수의 매개변수에 아무런 값을 전달하지 않으면, 기본적으로 undefined 가 할당되기 때문에 어찌 보면 undefined가 함수 매개변수의 기본값이라고 할 수 있다. ㅁ 매개변수에 아무런 값을 전달하지 않은 경우 function myFun(a,b){ console.log(a,b) } //함수 호출 myFun() //출력결과) 이것을 통해서 a,b 에는 undefined가 할당된 것을 확인할 수 있다. undefined unde..
[javascript] (함수)스코프와 스코프 체인? 스코프(scope)가 뭐시여?? 자바스크립트는 기본적으로 변수를 어느 부분에 정의 하느냐에 따라서 변수가 접근이 가능한 지점을 결정한다. 전역에 변수를 선언하면, 그 변수는 어느 곳에서든 참조할 수 있지만, 만일 함수 내부나 for문과 같은 반복문, if문과 같은 조건문의 { } 내부에 변수를 선언하게 되면, 그 이외의 지역에서는 해당 변수를 참조하거나 접근할 수 없게 된다. 이렇듯, 자바스크립트에는 변수가 접근하거나 혹은 변수 자체에 접근할 수 있는 유효한 범위가 존재하며, 이를 유효 범위 혹은 스코프라고 한다. 이를 더 쉽게 말하면, '한계(리미트)' 라고 보면 될 것 같다. 전역 스코프와 지역 스코프 다음과 같이 접근하면 과연 i 는 출력이 될까? (참고로 함수를 둘러싼 { } 까지를 함수 스코프라..
[npm] axios 사용법 보호되어 있는 글입니다.
[javascript]Array.sort() 사용 시 숫자 정확하게 정렬하기(1,5,10,...) 2024/02/27 기준 | 오름차순과 내림차순 설명이 반대로 되어 있는 것을 보고 수정하였습니다. 숫자정렬 Array.sort() 함수는 인자값으로 비교함수를 받으며, 만일 비교함수를 인자로 입력하지 않으면 Array의 모든 요소를 문자로 변환하고, 유니코드 기준에 따라서 크기 순서대로 정렬하는 함수이다. 때문에, 비교함수를 넣지 않고 10의 자리로 넘어가는 경우 1,10,100,2 와 같은 형식으로 정렬된다. 따라서 문자열은 문자로, 숫자는 숫자 타입으로 정렬하기 위해서는 인자값으로 배열의 각 요소를 비교할 수 있는 비교함수를 정의하여 호출해줘야 한다. function numberSort(num1,num2){ // 선택적 비교 함수 return num1 – num2 // num1 – num2가 음수를..
[javascript] webpack dev server 오픈 시 이미 열린 포트가 있다면, webpack dev server 를 오픈하다가 다음 문제가 발생했다. 이는 오픈 하고자 하는 포트가 이미 열려 있어서 생긴 문제 였다. 사실 다음 절차를 안 거쳐도 그냥 포트 번호를 수정하면 되지만, 그래도 알아두면 좋을 것 같아서 정리해 둔다. 명령 프롬포트나 파워 쉘 등에 들어가서 다음과 같이 입력하면 된다. netstat -ano | findstr 포트번호 //입력 시 해당 포트번호가 열려 있는지 확인할 수 있다. taskkill /f /pid "젤 우측 번호" //입력 시 해당 포트를 닫는다. // 참고로 'pid 번호' 는 프로세스의 id 번호를 의미한다.(id 번호는 프로세스를 구분하기 위한 식별자이다.)
[css] 태그 가운데 정렬 하는 법 부모 태그의 자식 태그를 대상으로 가운데 정렬함을 가정 세로 여백을 0으로 설정하고, 가로 여백을 `auto`로 설정하면, 브라우저가 알아서 여백을 조절하여 중앙정렬을 해준다. 이 때 부모 태그의 가로 넓이를 작게 설정하고, 자식의 가로넓이를 그 부모태그의 100%으로 설정하면, 중앙정렬이 되는 동시에 브라우저 크기에 따라 태그의 크기를 조절할 수 있다. margin 속성 유형 /* 네 면 모두 적용 */ margin: 1em; margin: -3px; /* 세로방향 | 가로방향 */ margin: 5% auto; /* 위 | 가로방향 | 아래 */ margin: 1em auto 2em; /* 위 | 오른쪽 | 아래 | 왼쪽 */ margin: 2px 1em 0 auto; margin 에서 auto 속성..
[node.js] node.js 서버 환경에서 css 파일 적용하는 방법 노란색으로 표시된 파일들을 기준으로 index.html 파일에 css를 적용한다고 가정 //server로 쓰이는 js 파일로 와서 상단에 아래와 같이 작성 app.use('/public',express.static('public')); //ㄴ 앱(app)에서 사용한다(use) /public 경로에 있는 모든 파일을 정적(static) 파일로, // 정적 파일: 수정이 거의 없는 파일

반응형