TIL 0808

오늘의 회고록

리액트 입문하기 전 자바스크립트 다시 복습하였다

var	let	const
재할당 O	재할당 O	재할당 X
함수 스코프	블록스코프	블록스코프

객체 매서드

• Object.keys() 객체의 키만을 추출하여 배열로 반환합니다.
• Object.values() 객체의 값만을 추출하여 배열로 반환합니다.
• Object.entries() 객체의 키와 값을 쌍으로 하는 배열을 반환합니다.
• Object.assign() 하나 이상의 출처 객체로부터 대상 객체로 속성을 복사할 때 사용합니다.

배열 매서드

• map 배열 내에 모든 요소를 돌면서 배열을 리턴한다
• filter 배열 내에 모든 요소를 돌면서 조건에 해당하는 배열을 리턴한다
• forEach 배열 내에 모든 요소를 돌면서 안에 내용을 실행한다
• sort 배열을 정렬한다
• reduce 배열의 시작값 총합을 구할 수 있다

분해 할당

function confirmReservation(user) {
        const {name, age} = person 
       // 분해 할당user.name user 필요 없이 바로 접근 가능
        
        return `${name} 고객님의 나이는 ${age} 입니다`
}

const person = {
	name: 'lim',
    age: 28,
}

confirmReservation(person)

Promise, Async , Await

Promise 비동기 실행때 실패 값과 성공 값을 정해서 출력 가능하다
return 값으로 promise를 반환하다

const myPromise = new Promise(resolve, reject){
	if(성공){
    	resolve('success')
    }else[
    	reject('error')
    }
}

myPromise.then(function(value) {
  // 성공(resolve)한 경우 수행
  console.log(value);  // 'Success!'
}).catch(function(error) {
  // 실패(reject)한 경우 수행
  console.error(error);  // 'Error!'
});

Async , Await 
async는 함수 앞에 사용하며 promise 함수를 리턴한다
await을 사용하면 해당 부분이 실행후에 뒤에 실행문이 실행된다

async function fetchData(){
	try{
    	const data = await fetch('https://api.example.com/data');
    	const json = await data.json();
  // await을 붙이지 않을경우 데이터를 받아 오기전에 실행되어 undefined가 정의된다
        console.log(json);
    }catch{
    	console.error("Data loading failed", error);
    }
}
fetchData();

이번 복습을 하면서 기존에 정확하게 알지 못했던 비동기 부분을 더 정확하게 알게 되었고 객체 배열에 접근하는 법을 더 정확하게 이해하고 알게 된 거 같아서 좋았다