본문 바로가기

FrontEnd/Javascript9

[JS] Javascript의 var, let, const의 차이 var, let, const는 모두 자바스크립트의 변수 선언방식이지만 각각 차이점들이 존재한다. [1] var 1 2 3 4 5 var userId = 'hahaha' console.log(userId); // --- hahaha var userId = 'hehehe' console.log(userId); // --- hehehe cs : var의 경우 여러번 선언이 가능하다. 이부분이 var사용에 있어 가장 큰 단점이라고 할 수 있다. 같은 변수명으로 여러번 변수선언이 가능하기 때문에 코드가 길어지고 복잡해질 수록 변수를 파악하기 힘들고 값이 수 없이 바뀔 수 있기 때문에 굉장히 불편하다. + var로 선언된 변수는 선언과 동시에 초기화가 된다. 호이스팅으로 인한 상황을 예로 들어 보자면 var는 선언.. 2021. 9. 15.
[JS] Javascript의 Promise Promise : promise는 자바스크립트의 내장객체로 Callback 지옥을 해결하기 위해 등장했다. promise는 비동기 작업을 수행하고 비동기 작업의 수행이 끝나면 성공/실패 여부에 따라 then 메서드 또는 catch 메서드를 호출하는 객체 (promise의 상태는 개발자들이 파악한다.) Promise의 상태(statement) - pending : Promise의 연산이 완료되지 않은 상태 - fulfilled : Promise의 연산이 성공적으로 완료된 상태 / resolve()가 호출된 상태 - rejectes : Promise의 연산이 실패한 상태 / reject()가 호출된 상태 Promise의 메소드(method) - resolve() : Promise의 상태를 fulfilled .. 2021. 1. 22.
[JS] Javascript의 비동기(asynchronous) 비동기(asynchronous) : 두가지 이상의 작업을 동시에 처리하는 것, : 자바스크립트에서 비동기로 처리하는 경우들 : eventListener, ajax, Timer(setTimeout) : 자바스크립트는 single thread로 동작하기 때문에 비동기 처리를 진행할 수 없다. 따라서 자바스크립트의 interpreter가 코드를 읽다가 비동기 처리가 필요한 함수를 만나면 해당 함수의 비동기 처리를 브라우저(web APIs)에게 넘긴다. 브라우저는 비동기 처리를 끝내고 나면 실행할 콜백함수를 Call Back queue에 저장한다. 만약 자바스크립트의 stack영역이 비어있다면 stack영역에 queue에 저장된 함수를 올린다. 이미 stack 영역에서 처리중인 작업이 있다면 해당 작업들이 모두.. 2021. 1. 22.
[JS] Javascript의 함수(Function) * Template literals : 문자열을 보다 편리하게 사용할 수 있도록 템플릿을 제공해준다. - 사용법 : `(백틱) 을 사용해 문자열을 감싸준다. ex. `str` 1) 여러줄의 문자열을 편리하게 사용하기 위해 사용한다, 템플릿 리터럴을 사용하지 않으면 라인피트를 사용해 줄바꿈 처리를 해주고 문자열 결합 연산자도 신경을 써야 하지만 template literals를 사용하면 그럴 필요가 없다. 2) ${}을 사용하기 let strVal = 'template literals'; console.log( "이전 : " + strVal + "라는 것이다."); console.log( `이후 : 이건 ${strVal} 라는 것이다.`); --> 더 깔끔하게 표현가능 ! Function : 자바스크립트에.. 2021. 1. 21.