걷기반 수업
lice
const numbers =[1,2,3,4,5]
나머지만 남게 하는 ,
인자 주개 , 넘버 ,넘버 ,
뒷 넘버에서 -1 한다
slice(1,3 )
2,3
start 와 end 를 입력
인덱스 배열의 몇번쨰를 의미 하냐
3전 까지 짜르겠다
3번쨰인덱스 전까지 짜른다 .
짤라낸다
some
numbers.some()
함수가 들어감 .
numbers.some (function (n) {
conesole.log (n) ;
return n===2 ;
}
매개 변수 ,
주어진 조건을 하나라도 만족하는것이 있냐 라고 물어 보는 것이 some
존재 하냐 아니냐 . 만 물어볼떄 .
fcunstion (person){
fi(person.age>=30) {
return true;
}else {
return flase;
]
});
console.log (result) ;
리턴문 우측에는들어가야함
const resutl =people.some (function (person) {
return persone.age >30 ;
});
모든 사람이 30이상이니 ?
const result =people.every(function (person) {
return persone.age >= 30;
every. 는 논리 곱 연산자 다
some 과 every 는 똑같다
비동기 . !!!!!!!
const a=1 ;
const b=2 ;
console.log (a);
console.log (b);
동기적 처리 .
—————————
기상청 날.씨 데이터 가져와서 콘솔로그 찍는 함수 호출하기 () ;
배달의 민족리뷰데이터받아오기받아와서 콘솔로그찍는함수호출하기 ();
ㄱ;ㅣ상청이 데이터 가지고있음. 배민 ,
순서 보장 안됨 .
가장 먼저 주는 사람이. . 데이터 먼저 준다
firebase 에서 데이터 받아오는 것도 비동기 다.
외부로 부터 데이터를 받아 올때 .
—————————————————
promise
약속
규칙을 정할려고 .
비동기 처리를 할때 , promise 를 쓴다
이걸 믿고 니가. 코드를 짜 .
요청 중 성공 실패
pending, fulfiled rejected
프로미스 3. 가지상태
대기 중(Pending): 일이 아직 끝나지 않은 상태에요.
이행됨(Fulfilled): 일이 성공적으로 끝난 상태에요.
실패함(Rejected): 일이 실패한 상태에요.
코드에서 비동기 관련 처리를 한다
promise 객체를 이용하여 코딩을 한다
promise 를 사용 하는 방법
then , fetch 사용
async /await 사용
async 함수안에서만 사용
await 프로미스가 해결될때 까지 기다려줌
await 함수는 async 함수안에서만 쓸 수있다 .
에러 처리를 간단하게 하고 싶을 때: try와 catch 블록을 사용해서 async 함수 안에서 발생하는 오류를 쉽게 처리할 수 있어요.
함수를 호출 할 떄 , await
fetch , 알들을 품고 있는 외부로 부터 데이터를 가지고 와서 품고있는
데이터를 외부에 요청 ,
fetch 쓰는 방법
tecth () 괄호 열고닫으면됨
fetch(“”)
fetch 프로미스를 반환 하는 함수기 때문에 나중에 결과 값을 가져올수밖에 없다 .
이 요청을 기다려주는것이 필요하다 . 그것이 await 를 넣어준다 .
await 데이터를 가지고 올떄까지 기다린다 .
fetch. 를 기다려준다
await 가 비동이 앞에 붙으면 풀필을 , 펜딩이 아닐 떄까지 어웨이트가 멱살을 잡고 있는다 .
정보가 주고 받아야 하는데 요청만 해서 , 어웨이트를 쓴다 .
정보요총 어 ? wait
fetch 너 왜이트 기둘리 .
3초 후에 풀필드가 완성.
비동기 함수를 실행하는 함 수를 사용하는이유
외부로 부터 데이터를 가지고 올떄 사용 .
받아온것을 가지고 태그를 만들어야 해서 .
기다려줘 .. 요청을 …
fetch 앞에 await 만 붙혀주면된다
await 를 가지고 있는 함수는 async 를
어웨이트를 넣고 싶으면 함수 앞에 async 키워드를 넣어주어야한다
async function printtest () {
const result = await fetch (url )
console..log(result);
}
printtest() ;
———————
fetch 로 가져온것은
늘 .json 과 같이 써줘야한다.
정보를 주고 받을 떄는 json 이라는 형식으로 주고. 받는다 .
json.
ㄹ
fetch &.json 은 같이 쓰인다 .메모
json은 어떤것의 메소드 .
뭔가.json
result.json ()
.json 할 때도 await 해야한다
.json 은 프로미스를 반환 하기 때문에 await 가 필요하다
.json 도 비동기 라서 시간이 조금 걸린다
완료될떄까지 기달려줘야한다 .
.json 도 완성된 결과를 받으려면 기다려야하는구나
비동기적으로 동작하는구나 !
fetch , json 프로미스를 반환 하기 때문에 await 가 필요하다 .
그래야console.log 해서 답을 받을 수있다 .
————————————
/ 함수 만들기
async function printTest() {
//외부로부터 데이터 요청 fetch 사용, await 비동기 함수 앞에 붙여서 밑으로 죽어도 안내려가게 함.
const result = await fetch("https://jsonplaceholder.typicode.com/users");
// result는 promise 객체
// JSON이라는 형태로 가져와야함 fetch + .JSON
const users = await result.json(); // jSON도 promise를 반환하기 때문에 얘도 기다려줘야 함.비동기임
console.log(users);
}
// 함수 호출하기
printTest();
————————
결과물을 가지고 뿌리기 .
후속 처리 .
에러가 났을 떄 .
성공 할수도 있고 실패할수도있는 것을 가지고 사용
url 이 안.될 수도 있으니 제어권이 나한테 없다 .
외부사항에 따라서 , 될수도 있고 안될수도 있으니
오류 를 체크하는것이 필요하다
안전빵으로 ,
제어권이 나한테 없다 .
try
한번 시도해보자 이게 되는 지 안되는지 .
try {
시도하고 ~
}
}catch {(문제가 발생하면 잡아라 )
}
try -catch 블럭
try 안에서 문제가 생기면 catch 로 간다
aatch (error) {
if (error.에러의 종류가 ====“심각한오류 “
개발자한ㅌ ㅔ 알려주는 로직 () ;
console.log(error)
}
async, await . try , catch 까지 배움 .
오늘은 걷기반 마지막 , 하고 4시에 다시 보충 수업 하고
알고리즘 특강 까지 매우 바빳다 ..
드디어 firebase 데이터 가져오고
css 수정 하고 ,
나머지 영화 클릭 하면 다시 , 정보 받아오는 걸 , 해야된다
내일 도 일 끝나고 , 코딩 할 생각 이다 ..
그래도 firebase 기초 문서 보고
어찌저찌 잘 따라해서 ,
작성자 창에 입력 하면 firestore 로 입력이되는 것 까지 확인 했다 .
후 ..뿌듯 ..
뭔가 계속 에러가 나서
계속 골머리 앓았는데 그래도 ,
끝내서 뿌듯 하다 !
주말동안에 팀프로젝트 를 최대한 끝낼 생각이다
게속 commit 하고 푸쉬 해서 충돌을 적개 만 들 예정이다
080624 til css 반응형 (0) | 2024.08.06 |
---|---|
080524 til firebase 데이터 수정 ,삭제하기 (0) | 2024.08.05 |
080124 til (0) | 2024.08.02 |
073124 til (0) | 2024.07.31 |
240730Til (0) | 2024.07.30 |