분류 전체보기

[JavaScript_study] 스코프(Scope)

* 스코프(Scope) 변수를 참조할 수 있는 유효한 범위 // 식별자(변수, 함수, 클래스 이름)가 유효한 범위 선언된 위치에 따라 유효 범위가 결정됨 { } 블럭 안의 변수는 블럭 안에서만 유효 scope가 존재하는 이유?? 1.이름 충돌 방지 2.메모리 절약 변수는 최대한 필요한 곳에서 정의해야 한다. 코드 블럭: { }, if() { }, for() { }, function() { } * 스코프(Scope)예시 코드 블럭 외부에서는 블럭 내부의 변수를 참조할 수 없다. 함수 외부에서는 함수 내부의 변수를 참조할 수 없다. 함수 외부에서는 함수의 매개변수를 참조할 수 없다. // 블럭 외부에서는 블럭 내부의 변수를 참조할 수 ❌ { const a = 'a'; } console.log(a); cons..

[JavaScript_study] fetch api

* fetch api 사용법 fetch() 함수는 첫번째 인자로 URL, 두번째 인자로 옵션 객체를 받고, Promise 타입의 객체를 반환합니다. 반환된 객체는, API 호출이 성공했을 경우에는 응답(response) 객체를 resolve하고, 실패했을 경우에는 예외(error) 객체를 reject합니다. fetch(url, options) .then((response) => console.log("response:", response)) .catch((error) => console.log("error:", error)); * fetch api 특징 브라우저 api중 하나이다. 비동기의 대표적인 api이다. 서버와 통신할 수 있는 api이다. .json()메서드는 이름은 .json이지만 실제로는 Ob..

[JavaScript_study] JSON: JavaScript Object Notation

* JSON (JSON: JavaScript Object Notation) 서버와 클라이언트(브라우저, 모바일) 간의 HTTP 통신을 위한 오브젝트 형태의 텍스트 포맷 오브젝트를 JSON으로 변환할 수 있고 JSON을 오브젝트로 변환할 수 있다. stringify(object): JSON // object를 JSON형태로 변경 직렬화 Serializing: 객체를 문자열로 변환 parse(JSON): object // JSON을 object로 변경 역직렬화 Deserializing: 문자열 데이터를 자바스크립트 객체로 변환 function은 JSON안에 포함 되지 않는다. 객체의 property만 포함된다. * JSON 예시 코드 const poodle = { name: 'latte', age: 20, ..

[JavaScript_study] async/await

* async/await async 와 await 는 절차적 언어에서 작성하는 코드와 같이 사용법도 간단하고 이해하기도 쉽다. function 키워드 앞에 async만 붙여주면 되고 함수 내부에서는비동기로 처리되는 부분 앞에 await만 붙여주면 된다. async가 붙은 함수는 프로미스를 반환하고, 프로미스가 아닌 것은 프로미스로 감싸 반환한다. await 키워드를 만나면 프로미스가 처리(settled)될 때까지 기다린다. 그리고 프라미스가 처리가 완료되어 resolve(값) 되면 값만 따로 추출해서 리턴한다. await는 promise.then보다 좀 더 세련되게 프라미스의 result 값을 얻을 수 있도록 해주는 문법이다. promise.then보다 가독성 좋고 쓰기도 쉽다. 그냥 값을 return해..

[JavaScript_study] Promise static method

[ Promise static method ] [ 참고 사이트 ] https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise/all * promise.all() 병렬적으로 한번에 모든 Promise들을 실행! error가 폼한된것까지 묶어서 Promise.all()을 할 경우 error가 발생하면서 출력이 되지 않는다. * promise.race() 주어진 Promise중에 제일 빨리 수행되는 값이 출력된다. * promise.allSettled() 성공하든 실패하든 그 결과를 배열로 묶어서 출력해준다. 배열 indexing를 이용하여 원하는 값을 선택하여서 출력해줄 수 있다. ex) fruits[0].stat..

[JavaScript_study] 프로미스(Promise)

* callback를 대체할 수 있는 Promise 무겁고, 오래걸리는 일이 있다면 우리코드 내부에서 조금 더 비동기적으로 처리할 수 있게 도와준다. 일이 끝나면 수행하줄게!! then(일이 끝난뒤 등록) // catch(에러발생) // finally(최종적으로 모든일이 끝났을때) Promise를 쓰게되면 resolve, reject라는 파라미터를 받아온다. 성공 : resolve, 실패 : reject // Promise를 쓰게되면 resolve, reject라는 파라미터를 받아온다. // 성공 : resolve, 실패 : reject // 함수에 대해 필요한 요소만 전달한다. function runInDelay(seconds) { return new Promise((resolve, reject) =>..