Promise.prototype.then()

const promise1 = new Promise((resolve, reject) => {
  resolve("Success!");
});

promise1.then((value) => {
  console.log(value);
  // Expected output: "Success!"
});

p.then(onFulfilled, onRejected);

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

// 이행한 프로미스를 받으면 'then' 블록도 바로 실행되지만,
// 핸들러는 아래 console.log에서와 같이 비동기적으로 실행됨
const resolvedProm = Promise.resolve(33);

let thenProm = resolvedProm.then((value) => {
  console.log(
    "이 부분은 호출 스택 이후에 실행됩니다. 전달받은 값이자 반환값은 " +
      value +
      "입니다.",
  );
  return value;
});
// thenProm의 값을 즉시 기록
console.log(thenProm);

// setTimeout으로 함수 실행을 호출 스택이 빌 때까지 미룰 수 있음
setTimeout(() => {
  console.log(thenProm);
});

// 로그 출력 결과 (순서대로):
// Promise {[[PromiseStatus]]: "pending", [[PromiseValue]]: undefined}
// "이 부분은 호출 스택 이후에 실행됩니다. 전달받은 값이자 반환값은 33입니다."
// Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: 33}

var p1 = new Promise(function (resolve, reject) {
  resolve("성공!");
  // 또는
  // reject("오류!");
});

p1.then(
  function (value) {
    console.log(value); // 성공!
  },
  function (reason) {
    console.log(reason); // 오류!
  },
);

Promise.resolve("foo")
  // 1. "foo"를 받고 "bar"를 추가한 다음 그 값으로 이행하여 다음 then에 넘겨줌
  .then(function (string) {
    return new Promise(function (resolve, reject) {
      setTimeout(function () {
        string += "bar";
        resolve(string);
      }, 1);
    });
  })
  // 2. "foobar"를 받고 그대로 다음 then에 넘겨준 뒤,
  // 나중에 콜백 함수에서 가공하고 콘솔에 출력
  .then(function (string) {
    setTimeout(function () {
      string += "baz";
      console.log(string);
    }, 1);
    return string;
  })
  // 3. 이 부분의 코드는 이전의 then 블록 안의 (가짜) 비동기 코드에서
  // 실제로 문자열을 가공하기 전에 실행됨
  .then(function (string) {
    console.log(
      "마지막 Then: 앗... 방금 then에서 프로미스 만들고 반환하는 걸 까먹어서 " +
        "출력 순서가 좀 이상할지도 몰라요",
    );

    // 'baz' 부분은 setTimeout 함수로 비동기적으로 실행되기 때문에
    // 이곳의 string에는 아직 'baz' 부분이 없음
    console.log(string);
  });

// 로그 출력 결과 (순서대로):
// 마지막 Then: 앗... 방금 then에서 프로미스 만들고 반환하는 걸 까먹어서 출력 순서가 좀 이상할지도 몰라요
// foobar
// foobarbaz

var p2 = new Promise(function (resolve, reject) {
  resolve(1);
});

p2.then(function (value) {
  console.log(value); // 1
  return value + 1;
}).then(function (value) {
  console.log(value + " - 동기적으로 짜도 돌아감");
});

p2.then(function (value) {
  console.log(value); // 1
});

Promise.resolve()
  .then(() => {
    // .then()에서 거부한 프로미스를 반환함
    throw new Error("으악!");
  })
  .then(
    () => {
      console.log("실행되지 않는 코드");
    },
    (error) => {
      console.error("onRejected 함수가 실행됨: " + error.message);
    },
  );

Promise.reject()
  .then(
    () => 99,
    () => 42,
  ) // onRejected에서는 42를 곧 이행할 프로미스로 감싸서 반환함
  .then((solution) => console.log(solution + "로 이행함")); // 42로 이행함

Promise.resolve()
  .then(() => {
    // .then()에서 거부한 프로미스를 반환함
    throw new Error("으악!");
  })
  .catch((error) => {
    console.error("onRejected 함수가 실행됨: " + error.message);
  })
  .then(() => {
    console.log("처음 then의 프로미스가 거부했지만 그래도 이 코드는 실행됨");
  });

function fetch_current_data() {
  // fetch() API는 프로미스를 반환합니다. 이 함수도
  // API가 비슷하지만, 이 함수의 프로미스는
  // 추가 작업을 거친 이후에 이행값을 반환합니다.
  return fetch("current-data.json").then((response) => {
    if (response.headers.get("content-type") != "application/json") {
      throw new TypeError();
    }
    var j = response.json();
    // j 가공하기
    return j; // fetch_current_data().then()을 통해
    // 이행값을 사용할 수 있음
  });
}

function resolveLater(resolve, reject) {
  setTimeout(function () {
    resolve(10);
  }, 1000);
}
function rejectLater(resolve, reject) {
  setTimeout(function () {
    reject(new Error("오류"));
  }, 1000);
}

var p1 = Promise.resolve("foo");
var p2 = p1.then(function () {
  // 1초 뒤에 10으로 이행할 프로미스 반환
  return new Promise(resolveLater);
});
p2.then(
  function (v) {
    console.log("이행", v); // "이행", 10
  },
  function (e) {
    // 실행되지 않음
    console.log("거부", e);
  },
);

var p3 = p1.then(function () {
  // 1초 뒤에 '오류'로 거부할 프로미스 반환
  return new Promise(rejectLater);
});
p3.then(
  function (v) {
    // 실행되지 않음
    console.log("이행", v);
  },
  function (e) {
    console.log("거부", e); // "거부", '오류'
  },
);

const nextTick = (() => {
  const noop = () => {}; // literally
  const nextTickPromise = () => Promise.resolve().then(noop);

  const rfab = Reflect.apply.bind; // (thisArg, fn, thisArg, [...args])
  const nextTick = (fn, ...args) => (
    fn !== undefined
      ? Promise.resolve(args).then(rfab(null, fn, null))
      : nextTickPromise(),
    undefined
  );
  nextTick.ntp = nextTickPromise;

  return nextTick;
})();