날아라김지원
화살표 함수(arrow function)
Javascript 2022. 4. 6. 21:37

함수 선언문 : 어디서든 호출가능 자바스크립트 내부 알고리즘, 실행전 초기화 단계에서 호이스팅으로 올라가진다. 함수 위치가 올라가는게 아님! 여튼 쓸 수 있다. sayHello() function sayHello(){ console.log('hello') } 함수 표현식:코드에 도달하면 생성 그 위치 이후에만 사용가능 let sayHello = function(){ console.log('hello') } sayHello() 뭐가 더 좋고 나쁨은 없다. 하지만 신경쓰고 싶지 않으면 함수 선언문을 사용하면 더 자유롭고 편하게 코딩이 가능 화살표 함수 (arrow function) - 보다 간결하게 작성한다 let add = function(num1,num2){ return num1 + num2 } let ..

article thumbnail
이벤트루프(event loop)
Javascript 2022. 4. 6. 20:25

자바스크립트는 싱글 스레드 언어이다. 그래서 다른 언어들처럼 무조건 순차적으로 코드가 실행되지않는다. 위그림의 메모리힙에는 함수나, 선언한 변수가 들어간다. 콜스택은 실제로 실행하는 코드를 실행하는 공간이다. 1.console.log('첫번쨰실행') 2.setTimeout(() => {console.log("두 번째 메시지")}, 5000); 3.console.log('세번째실행') 이런식으로 실행하게되면 1 -> 5초뒤2번, ->3 순으로 실행되는게아니라 1 -> 3 -> 5초뒤2번 이렇게 실행되게 된다. 즉 먼저 실행이 완료된 순으로 실행되는것이 자바스크립트의 특성이다. 요약하면 코드의 실행순서만 볼때, 먼저 실행되는순서로 실행이 된다. 다만 위 그림에서도 알 수있듯이 비동기적인 코드들은 전부 콜백큐..

article thumbnail
스코프, 클로져(Closure)
Javascript 2022. 4. 6. 18:20

스코프, 클로져 스코프 변수이름,함수이름,클래스 이름과 같은 식별자가 선언된 위치에 따라 다른 코드에서 자신이 참조될 수 있을지 없는지 결정되는것을 스코프라고한다. 스코프체인 지역스코프에서, 전역 스코프로 현재 참조해야하는곳에 변수가 없으면 점점 외부함수, 전역으로 나가면서 찾아내는것을 스코프체인 이라고한다. 최종적으로 전역에도 없으면 레퍼런스 에러를 출력하다. 그리고 하위에서 상위로는 참조하지만 상위에서 하위로는 참조하지않는다. 스코프 레벨 1.블록레벨 ->if,for,함수.. 2.함수레벨 ->함수만 상위 스코프 함수가 호출되는 시점에결정 ->동적스코프 함수가 정의되는 시점에 결정 ->정적스코프(렉시컬스코프) 자바스크립트 함수는 만들어지면 내부슬롯에 상위 스코프 참조를 저장한다. 클로져 중첩함수가 외부..

setTimeout() 함수 쿡북
Javascript 2022. 4. 2. 11:26

setTimeout() setTimeout(function() { console.log('5초뒤출력!'); }, 5000); 이 코드만 가지고 잘 가져다 쓰도록하자 리액트에서는 useEffect에서도 유용하고 여기저기서 잘 쓰구 있다. 비동기 방식의 자바스크립트에서는 매우 자주 쓰이는 함수다 추가로 clearTimeout()도 알아두자 var settime = setTimeout(function() { }, 5000); clearTimeout(settime); 이와같이 혹시 모를 오류나, 남아있는 시간때문에 삭제하고 중지하기 위해서 사용한다. 그리고 보너스로 일정시간마다 반복하는함수 setInterval()함수도 있다. test = setInterval(function() { alert('일정시간마다 출..

article thumbnail
새로고침 메서드 location.reload()
Javascript 2022. 4. 2. 00:45

{ removeCookies("member_id"); removeCookies("accessToken"); removeCookies("refreshToken"); removeCookies("name"); removeCookies("age"); removeCookies("gender"); setRefreshToken(getCookie("refreshToken")); alert("로그아웃 하였습니다."); location.reload(); }} > 로그아웃 팀원이 구현한 로그아웃 버튼안에 로그아웃하면 alert상태만 띄워주고 특정페이지로 이동한다거나 해서 페이지 구성을 바꿔주지 않더라 예를들면 로그아웃은 되지만 로그아웃 버튼은 그대로 남아있고 화면 초기화가 되지않아 새로고침을 한번 해주면 되겠다 생각, lo..

article thumbnail
Object key와 value 사용하기
Javascript 2022. 4. 2. 00:28

key:value으로 이루어진 Object자료형에서 key와 value를 사용하는법 1.key사용하기 Object.keys(오브젝트변수명) 그리고 순서대로 사용하려면 Object.keys(오브젝트변수명)[0] Object.keys(오브젝트변수명)[1] .... 2.value사용하기 Object.values(오브젝트변수명) 그리고 순서대로 사용할며녀 Object.values(오브젝트변수명)[0] Object.values(오브젝트변수명)[1] .... 이와같이 사용해주면 된다. let obtest = { "94": "안성탕면", "201": "불닭볶음면", "73": "올리브짜파게티" } 오늘 이와같이 보내지는 API를 뽑아 key, value 두가지를 사용해야했는데 이때 참고한 방식이다. {Object.k..

includes() 메서드 (포함,특정요소포함)
Javascript 2022. 3. 29. 18:59

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/includes Array.prototype.includes() - JavaScript | MDN includes() 메서드는 배열이 특정 요소를 포함하고 있는지 판별합니다. developer.mozilla.org 특정 배열에 특정 요소가 포함하고 있는지 식별한다. const array1 = [1, 2, 3]; console.log(array1.includes(2)); // expected output: true const pets = ['cat', 'dog', 'bat']; console.log(pets.includes('cat')); // expecte..

article thumbnail
JSON(JavaScript Object Notation)
Javascript 2022. 2. 17. 10:05

이런식으로생긴 데이터!! 속성 - 값, 키 - 값 쌍으로 이루어진 데이터 오브젝트를 전달하기 위해 인간이 읽을 수 있는 텍스트를 사용하는 개방형 표준 포맷 비동기 브라우저 / 서버 통신 (AJAX)을 위해, XML(AJAX가 사용)을 대체하는 주요 데이터 포맷 JSON 메시지 단위는 배열이나 객체이다. 결론적으로 몽고db도 json이다!