그린그린티라떼

console.log('Start'); setTimeout(function() { console.log('Timeout callback'); }, 0); console.log('End');​ console.log(1); setTimeout(() => console.log(2)); Promise.resolve().then(() => console.log(3)); Promise.resolve().then(() => setTimeout(() => console.log(4))); Promise.resolve().then(() => console.log(5)); setTimeout(() => console.log(6)); console.log(7); 이 코드의 출력을 맞춰보세요! (정답은 맨 아래) 지난 주 면접..

전역 변수의 문제점? ✔️ 암묵적 결합 모든 코드가 전역 변수를 참조하고 변경할 수 있게 된다. 변수의 유효 범위가 크기 때문에 코드의 가독성은 나빠지고 의도하지 않은 상태 변경이 발생할 수 있는 위험이 높아진다. ✔️ 긴 생명 주기 전역 변수는 생명 주기가 길다. 메모리 리소스가 오랜 기간 소비된다. 전역 변수의 상태를 변경할 수 있는 시간과 기회가 많다. ✔️ 스코프 체인 상에서 종점에 존재 전역 변수는 스코프 체인 상에서 종점에 존재한다. 전역 변수의 검색 속도가 가장 느리다. ✔️ 네임스페이스 오염 자바스크립트의 가장 큰 문제점 중 하나는 파일이 분리되어 있어도 하나의 전역 스코프를 공유한다는 것이다. 전역 변수의 사용을 줄이는 방법? ✔️ 즉시 실행 함수 함수 정의와 동시에 호출되는 즉시 실행 ..

JavaScript 함수에 원시값과 객체를 매개변수로 넣었을 때 어떻게 다른 지에 대해서 궁금증이 생겼다. 조금 더 확실하게 정리하고자 기록으로 남긴다. 원시값(primitive values)을 매개변수로 전달할 때 Boolean, Number, String, BigInt, Symbol, null, undefined은 JS의 원시값에 해당합니다. 함수에 원시값을 매개변수로 전달하면 그 값의 복사본이 함수 내부로 전달됩니다. 따라서 함수 내에서 해당 매개변수를 변경해도 원래의 값에는 영향을 주지 않습니다. function modifyValue(x) { x = x + 1; console.log('Inside function:', x); } let value = 5; modifyValue(value); // ..

github api를 사용해서 제 계정과 관련된 정보를 불러오는 fetch함수를 구현해봤습니다.☺️☺️ import fetch from 'cross-fetch'; const MY_GITHUB_URL = 'https://api.github.com/users'; // 사용자 이름을 받는 비동기 함수 getUsers(name) const getUsers = async (name) => { await fetch(`${MY_GITHUB_URL}/${name}`) .then((response) => response.json()) .then((result) => { console.log(result); }); }; getUsers('syoungee'); getUserInfo.mjs 로 파일명을 지정해주고 node g..

https://sustainable-dev.tistory.com/156 자바스크립트에서 불변성(Immutability)이란 사실 나는 불변성이라는 개념을 자바스크립트 언어 자체를 공부할 때 말고 리액트를 공부하면서 state를 변경할 때 처음 접했었다. 그냥 단순하게 '새로운 값을 할당하지 않으면 리렌더링이 안되 sustainable-dev.tistory.com 위와 같은 이유에서 JavaScript로 개발을 할 때 불변성을 지켜줘야한다. (데이터의 변화를 잘 캐치하기 위해서!!!!) immer를 사용하면 복잡하지 않게 기존에 불변성을 깨뜨리는 함수들도 불변성을 지키면서 코딩할 수 있다! yarn add immer https://codesandbox.io/s/pedantic-grass-ojocz?font..

const 선언은 블록 범위의 상수를 선언합니다. 상수의 값은 재할당할 수 없으며 다시 선언할 수도 없습니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 // 주의: 상수 선언에는 대소문자 모두 사용할 수 있지만, // 일반적인 관습은 모두 대문자를 사용하는 것입니다. // MY_FAV를 상수로 정의하고 그 값을 7로 함 const MY_FAV = 7; // 에러가 발생함 MY_FAV = 20; // 7 출력 console.log("my favorite number ..

onclick, onchange, onsubmit, onload, oninput, onfocus, onblur onBlur: select, text, textarea 항목이 실행된 후 사용자가 다른 곳으로 이동할 때 발생 onChange: 사용자가 select, text, textarea의 텍스트를 변경하면 이 이벤트가 발생 onClick: 이 이벤트는 사용자가 버튼, 이미지, 하이퍼 링크 등과 같은 객체를 클릭 할 때 발생 onFocus: HTML 양식에서 select, text 또는 text area 항목이 선택되면 이 이벤트가 발생 onSelect: 이 이벤트는 text area 또는 text 상자의 일부 text가 선택될 때 발생 onSubmit: HTML양식의 제출 버튼을 클릭하여 양식 데이터를..