본문 바로가기

전체 글125

[LEARN-JS] Array method - 기존 배열 변경 유무에 따라 나누기 Array method를 사용할 때 기존 배열이 되는것과 새로운 배열이 반환되는 것(기존 배열 변경 X)이 왜 중요한가?기존 배열을 의도치 않게 변경되는 것을 방지하거나, 특정 작업을 수행할 때 의도적으로 배열을 수정하고자 할 수 있기 때문.  기존 배열 변경 O기존 배열이 변경되는 method들을 사용했을때 shallow copy를 해 다른 변수에 할당해 놓았다면 그 변수에 할당한 배열도 변경된다(같은 메모리 주소를 참조하고 있기 때문).만약, 독립된 복사된 배열을 원한다면 deep copy를 사용해야 한다. 1. fill2. pop 3. push4. reverse5. shift6. unshift7. splice8. sort9. copyWithin 기존 배열 변경 X새로운 배열이나 값을 반환하거나 원본.. 2024. 8. 12.
[ZIMZIM] tailwindCss w-full vs w-screen tailwindCss 에서는 w-full과 w-screen으로 화면을 가득 채울수 있다는 것은 동일한데 무엇이 다른지에 대해 조사해 보았다. w-full(width:100%)요소의 부모 요소의 너비를 100%로 설정함. 즉, 해당요소가 속한 컨테이너의 너비에 맞춰 요소의 너비가 조정된다.주로 내부 컨텐츠가 부모 요소의 너비에 맞추어져야 할 때 사용한다. w-screen(width: 100vw)요소의 너비를 뷰포트(viewport, 웹페이지를 보고 있는 사용자의 브라우저 창 크기를 의미함)의 너비에 맞추어 100%로 설정한다.요소가 화면 전체 너비에 맞춰져야 할 때 사용한다.  레이아웃을 잡을 때 가장 최상위에는 w-screen을 사용하여 전체 viewport를 잡은 뒤, 하위 영역에서는 w-full을 사.. 2024. 8. 6.
[LEARN-JS] Array javascript의 string method를 더 잘 알아보기 위해 직접 구현후 테스트코드를 짰다.이 기록은 구현 중 알게 된 것을 모아둔 것이다.https://github.com/rami0617/learn-js GitHub - rami0617/learn-js: To study javascript, I implement the methods myself by referring to the MDN documentation.To study javascript, I implement the methods myself by referring to the MDN documentation. - rami0617/learn-jsgithub.comcall method1. 'this'값을 명시적으로 설정하고 원하는 문맥.. 2024. 8. 6.
[ZIMZIM] CRA 없이 react 프로젝트 구성하기(feat. vite + react + typescript) CRA로 프로젝트를 구성하지 않고 하나하나 디펜던시들을 추가해 프로젝트를 구성하기로 했다. 먼저, 모듈 번들러로는 vite를 선택했다. 내가 만드려고 하는 프로젝트는 단순한 설정들만 필요하고, HMR(Hot Module Replacement,핫 모듈 교체)로 개발상황에서 변경사항을 빠르게 반영할 수 있다는 점이 vite를 선택한 이유이다. 프로젝트 폴더를 만든 후 npm init vite@latest라는 명령어를 터미널에 입력하면 framework와 variant를 선택할 수 있는데, 이때 React와 typescript를 선택하면 된다.현재 폴더에 만들고 싶다면 명령어(npm init vite@latest) 뒤에 . 을 붙이면 된다. npm install을 실행하여 package.json에 있는 패키지.. 2024. 8. 5.
[LEARN-JS] mdn 문서에 기여하기 🟡기여한 결과물 delete 연산자 - JavaScript | MDN**delete**는 객체의 속성을 제거합니다. 속성의 값이 객체이고 더 이상 그 객체에 대한 참조가 없다면, 해당 객체는 결국 자동으로 메모리에서 해제됩니다.developer.mozilla.org   mdn에 문서를 보며 string과 array의 method들을 구현하고 있던 중 우연치 않게 오타를 발견하게 되었다.이를 수정하기 위해서는 해당 mdn github에 이슈를 올리면 된다는 것을 알게되고 이슈를 올렸는데, 해당 이슈는 벌써 수정되었으니 다른것을 한번 번역해보지 않겠냐는 제안을 듣게 되었다. 자바스크립트를 처음 접하는 개발자라면, 자바스크립트로 개발을 하는 개발자라면 자주 들어가보는 mdn 페이지에 기여할 수 있게 된다는 .. 2024. 7. 29.
[LEARN-JS] String, Jest javascript의 string method를 더 잘 알아보기 위해 직접 구현후 테스트코드를 짰다.이 기록은 구현 중 알게 된 것을 모아둔 것이다.https://github.com/rami0617/learn-js GitHub - rami0617/learn-js: To study javascript, I implement the methods myself by referring to the MDN documentation.To study javascript, I implement the methods myself by referring to the MDN documentation. - rami0617/learn-jsgithub.com 1. concat method  1) concat을 사용하는것보다 할당.. 2024. 7. 23.