본문 바로가기

Front end/JavaScript18

[JavaScript] 가비지 컬렉션 가비지컬렉션이란 더이상 다른 객체에 참조되지 않는 객체를 삭제하여 메모리 누수를 방지하는 메모리 관리방식이다. GC라고 불리며 메모리 관리를 직접 해야하는 C++과 다르게 가비지 컬렉터가 자동으로 메모리를 관리해준다. 2024. 11. 9.
[JavaScript] 얕은복사 vs 깊은복사 feat. 참조복사 참조복사객체의 참조 복사는 같은 메모리 주소를 복사한다. 즉, 원본 데이터를 참조복사한 다른 객체의 값이 바뀌게 된다면 원본에 문제가 생길 가능성이 매우 높다. let message = '문자 값은 프리미티브 데이터 타입으로 값이 복사됩니다.';let messenger = { name: 'kakao talk', manufacture: 'kakao',};let text = message;let conversationTool = messenger;// 비교 (복사 vs. 참조)console.log(message == text);console.log(message === text);console.log(messenger == conversationTool);console.log(messenger === c.. 2024. 11. 8.
[JavaScript] 구조분해 할당 구조 분해 할당구조분해 할당이란 배열 혹은 객체의 속성을 개별 변수에 담을 수 있도록 하는 표현식이다. 가끔 배열의 일부분만 필요한 경우가 있는데 이럴 때 여러 방법이 있지만 구조 분해 할당을 사용하면 매우 쉽게 값을 가져올 수 있다.  배열 분해변수를 좌항, 분해하고자 하는 배열을 우항에 놓고 분해한다. 이 때, 배열의 순서를 맞추어야 한다. const fruits = ['apple', 'banana', 'cherry'];// 배열 요소를 변수에 할당const [first, second, third] = fruits;console.log(first); // "apple"console.log(second); // "banana"console.log(third); // "cherry"기본값 지정cons.. 2024. 11. 7.
[JavaScript] for in과 for of for ...in 문for ...in 문은 열거가능한 모든 속성을 반복한다. 이 때 상속된 속성도 같이 접근하게 된다. 여기서 두 가지의 특징이 나타난다.첫 번째로는 상속된 속성에 접근 가능하다는 점과 두 번째로는 열거 가능한 속성을 반복한다는 점이다. 주로 객체의 속성에 접근할 때 사용한다.  상속된 속성에 접근 가능const javaScript = { creator: 'Brendan Eich', createAt: '1995.05', standardName: 'ECMAScript', currentVersion: 2024,};Object.prototype.nickName = 'tiger'; // 최상위 객체인 Object에 nickName이라는 프로퍼티 할당 위 코드에서 javaScript 객체의.. 2024. 11. 5.
포켓몬 MBTI Test 만들기 요즘 과제에 치이고 알바도 하느라 블로그를 안쓴지 오래된 것 같은데 나름 짬짬히 이것저것 만들긴 했다. 한 번에 포스팅하려니 막막해서 그중 하나인 mbti 테스트 먼저 포스팅 하려한다. + 아직 디자인은 완성되지 않았는데 포켓몬 세상을 컨셉으로 잡았다 ㅋ mbti 테스트의 기본 알고리즘은 E와 I, N과 S 등 4가지 클래스의 성향을 판단하기 위해 질문이 필요하다. 따라서 각 클래스의 질문은 홀수여야 하고, 어떤 성향이 더 큰지 비교하여 출력한다. 완성 사이트 starlit-frangollo-737871.netlify.app 이렇게 된다면 결과는 각각 2번씩 선택된 ESTP가 출력된다. 여기서 또 문제가 생겼는데 질문을 어떻게 해야할지 문제였다. 그런데 GPT한테 간단히 설명하고 질문지를 만들어달라고 요.. 2023. 5. 12.
Weather site 만들기 openweather API를 이용해 날씨 정보를 얻을 수 있는 웹사이트를 만들어 보았다. 사실 API를 사용하는 것에 익숙해지기 위해 시작한 프로젝트였지만 하다보니 쓸데없이 디자인에 꽂혀서 시간을 다 쓴것 같다.. ㅋㅋ 그래도 눈이 내리는 애니메이션과 같은 효과도 찾아볼 수 있었고, API의 사용 등 여러 웹을 풍부하게 만들어주는 방법을 익힌 것 같다. 아 그리고 이번에 만든 사이트를 netilfy에 업로드 했었는데 작년 10월에 만들었던 티스토리 클론 코딩 했던 걸 보게 되었다. 그땐 저 정도만 했어도 동네방네 자랑하고 다녔었는데 지금 보니 정말 내가 저걸 왜 자랑하고 다녔을까 하는 창피한 기분도 들고 나름 많이 성장한 것 같아 뿌듯함도 느낄 수 있었다.미리보기 weather API에서 받은 날씨 데.. 2023. 3. 19.