안녕하세요. 성조입니다. 예전에 강남에 있는 중소기업 면접 볼 때 인원이 3 자릿수를 넘었고, Java 직군을 지원했는데 JavaScript 관련해서 반복문을 다루는 문제가 나왔던 것이 생각나서 기본기를 다질 겸 겸사겸사 포스팅을 작성했습니다. 혹여나 올바르지 못한 지식을 전달하고 있다면 언제든지 댓글로 피드백 주시면 감사드리겠습니다. 반복문(LooP)이란? 프로그래밍에서 반복문(LooP)이란 동일하거나 유사한 작업을 여러 번 반복 실행할 때 사용하는 구문이다. 이는 코드의 재사용성을 높이고, 코드의 길이를 줄여 효율성을 향상한다. 하지만 부분별 한 중첩 반복문은 반복문 호출의 양이 많아질 때. 기하급수적으로 많아질 수 있으므로 주의하여 사용해야 한다. 사실 자바스크립트 역시 다른 프로그래밍 언어와 반복..
안녕하세요. 성조입니다. 자바스크립트를 사용하면 '...'라는 것을 생각보다 많이 사용하게 됩니다. 다양한 곳에서 사용되는 '...'를 이번 포스팅을 통해 조금 더 정리하고 흡수된 지식으로 만들고자 합니다. 혹여나 올바르지 못한 지식을 전달하고 있다면 언제든지 댓글로 피드백 주시면 감사드리겠습니다. Spread 연산자(문법)란? Spread 연산자로 사용되는 '...'는 배열이나 객체, 문자열과 같은 이터러블한 값을 개별 요소나 속성으로 분해하는 데 사용된다. 이것은 함수 호출 시 인자를 전달하거나 배열, 객체를 합체 또는 복제하는 용도로 사용하기 좋다. [배열 예시] let arr1 = [1, 2, 3]; let arr2 = [4, 5, 6]; let arr3 = [...arr1, ...arr2]; /..
안녕하세요. 성조입니다. 이번 포스팅은 호출 스택(Call Stack) 개념에 대해서 정리해 보려 합니다. 혹여나 잘못된 지식을 전달했다고 생각하시면 언제든지 댓글로 피드백 남겨주시면 감사드리겠습니다! 호출 스택(Call Stack)이란? 호출 스택은 MDN 홈페이지에 다음과 같이 나와있다. "호출 스택은 여러 함수들(functions)을 호출하는 스크립트에서 해당 위치를 추적하는 인터프리터(웹 브라우저의 자바스크립트 인터프리터 같은 것.)를 위한 메커니즘입니다." [본인 의견] 프로그램에서 함수의 호출 순서를 추적하는 데이터 구조이다. 호출 스택은 현재 어떤 함수가 실행되고 있는지, 그 함수 내부에서 그리고 다음에 어떤 함수가 존재하는지 판별하여 제어한다. 즉, 함수가 동작하면서 다음 함수가 있거나 없..
안녕하세요. 성조입니다. 이번 포스팅에서는 useEffect를 정리 후. 포스팅해 보려합니다. 저는 올바른 정보를 전달하기 위해 학습하고 정리하는 과정에서 많은 노력을 하고 있습니다. 혹여나 잘못된 지식 전달 사항이 있다면 언제든지 댓글로 의견 공유주시면 감사드리겠습니다. useEffect란? useEffect는 React에서 사이드 이펙트(Side Effect)를 관리하는데 사용되는 Hook이다. 즉, 생명 주기를 관리하는 것으로도 볼 수 있다. 사이드 이펙트(Side Effect)는 컴포넌트들이 애플리케이션에서 일어나는 다른 모든 외부와의 상호 작용하는 것을 의미한다. 예를 들어보면 backend 개발자가 구현해 놓은 API들을 호출하거나, 이벤트 리스너를 등록 및 해제, DOM 조작하는 것 등이 존..
안녕하세요. 성조입니다. 이번 포스팅은 React.js에서 자주 활용되는 useState에 대해서 다뤄보려 합니다. 부족한 지식 전달일 수 있습니다. 이 포스팅에 대해서는 언제든지 댓글로 피드백 또는 질문, 의견을 공유하면 좋을 것 같다고 생각됩니다. useState란? 결론 : useState는 함수형 또는 클래스형 컴포넌트의 상태를 관리하고, 변경할 수 있도록 도와주는 하나의 React Hook이다. useState는 React에서 제공하는 다양한 React Hooks 중에 하나로, 함수형 또는 클래스형의 컴포넌트에서 로컬의 데이터 상태를 관리할 수 있게 만들어 주는 기능이다. useState는 초기 입력될 상태 값을 인자로 받아서 상태 값과 해당 상태를 업데이트하는 함수를 쌍으로 반환하게 된다. 다..
안녕하세요. 성조입니다. 이번 포스팅은 JavaScript를 확장한 문법인 JSX에 대해서 정리하려 합니다. 올바른 지식 전달을 위해 노력하고 있으나, 혹여나 잘못된 지식 전달이 있다면 언제든지 댓글 남겨주시면 감사드리겠습니다! JSX(JavaScript XML)란? JSX는 JavaScript XML의 약자로, JavaScript의 확장 문법이다. JSX를 통해서 JavaScript 내부에 마치 HTML와 같은 코드를 작성할 수 있게 만들어주는 것이다. JSX의 경우. React에서 컴포넌트를 작성하는 주요 방식으로 활용되고 있으며, 이를 통해 UI 컴포넌트가 어떻게 생겼는지 한눈에 이해하기 쉬운 장점이 있다. JSX의 경우 선택 사항이다. JSX(JavaScript XML) 규칙 1. 모든 태그는 닫..
안녕하세요. 성조입니다. 이번 포스팅은 dependencies(종속성)와 devDependencies(개발 종속성)의 차이점에 대해서 정리해 보려합니다. 100% 완벽한 정답이 아닐 수 있으므로 학습 또는 참고용으로 봐주시면 감사드립니다. 또한 혹시나 잘못된 정보 전달이 있는 경우 언제든지 댓글 달아서 피드백 주시면 감사드리겠습니다. dependencies와 devDependencies는 프로젝트의 종속성을 관리하기 위해서 나눠진 카테고리이다. 위 카테고리는 javascript 및 node.js 프로젝트에서 package.json 파일을 통하여 관리되며, 관련된 사항은 다음과 같다. dependencies와 devDependencies의 차이점 결론 - dependencies는 프로젝트를 실행하는데 필요..
안녕하세요. 성조입니다. 이번 포스팅은 개발하다 보면 언제든 내장함수를 활용하게 되는데 자바스크립트 관련해서 자주 다룰 일이 생기다 보니 개인적으로 학습 후. 정리하는 포스팅을 작성하게 됐습니다. 표준 내장 객체에서 함수 속성을 정리하는 포스팅입니다. 혹여나 잘못된 지식 전달이 있다면 언제든지 댓글로 얘기 주시면 감사드리겠습니다. 표준 내장 객체란? 자바스크립트 언어 자체에 내장되어 있어 사용자가 별도로 설치하거나 가져오지 않아도 사용할 수 있는 객체를 의미한다. 이러한 표준 내장 객체들은 자바스크립트에서 기본적으로 제공되는 기능을 수행하며, 개발자들은 이러한 객체들을 활용하여 편리하게 웹 또는 애플리케이션을 개발하고 확장할 수 있다. eval() let x = 2; let y = 3; let code ..
