[TIL]20210903

웹

.fliter()

[1, 2, 3, 4].fliter(function);
이 코드는 1, 2, ,3, 4를 순서대로 function에 넣는다.
function에 따라 리턴되는 값이 참이면 숫자를 유지하고, 그렇지 않다면 리스트에서 제거해준다.

fetch()

fetch()는 네트워크를 통해 정보를 가져온다. fetch(https://www.~~~); 을 이용하면 된다.

.then()

이는 비동기 방식으로 작동된다는데 이 방식이 뭔지 몰라 찾아봤다.

https://private.tistory.com/24
동기는 말 그대로 동시에 일어난다는 뜻입니다. 요청과 그 결과가 동시에 일어난다는 약속인데요. 바로 요청을 하면 시간이 얼마가 걸리던지 요청한 자리에서 결과가 주어져야 합니다.
요청과 결과가 한 자리에서 동시에 일어남
A노드와 B노드 사이의 작업 처리 단위(transaction)를 동시에 맞추겠다.
비동기(Asynchronous : 동시에 일어나지 않는)

• 비동기는 동시에 일어나지 않는다를 의미합니다. 요청과 결과가 동시에 일어나지 않을거라는 약속입니다.
  요청한 그 자리에서 결과가 주어지지 않음
  노드 사이의 작업 처리 단위를 동시에 맞추지 않아도 된다.
  
  동기와 비동기는 상황에 따라서 각각의 장단점이 있습니다.
  
  동기방식은 설계가 매우 간단하고 직관적이지만 결과가 주어질 때까지 아무것도 못하고 대기해야 하는 단점이 있고,
  
  비동기방식은 동기보다 복잡하지만 결과가 주어지는데 시간이 걸리더라도 그 시간 동안 다른 작업을 할 수 있으므로 자원을 효율적으로 사용할 수 있는 장점이 있습니다.

fetch()를 통해 url의 정보를 가져오는데 얼마나 시간이 소요될지 알수 없으므로, 비동기 방식을 이용한다는 것이다.

p.then(onFulfilled, onRejected);

p.then(function(value) {
  // 이행
}, function(reason) {
  // 거부
});

화살표 함수를 이용해서 코드를 줄여나가도 된다.

오늘 제작한 것.
https://lounge-vanlia.netlify.app/