前端工程师零基础到就业(视频代码齐)阶段二

238 阅读1分钟

前端工程师-01-02-阶段二:组件化与移动WebApp开发-第1篇

Promise-初识 Promise 1、学什么 Promise 的实例方法 Promise(视频资源vx(cmL46679910)) 的构造函数方法 Promise 的注意事项和应用 2、Promise 是什么 Promise 的基本用法 then()

<script>
 
  const move = (el, { x = 0, y = 0 } = {}, end = () => {}) => {
    el.style.transform = `translate3d(${x}px, ${y}px, 0)`;

    el.addEventListener(
      'transitionend',
      () => {
        end();
      },
      false
    );
  };(视频资源vx(cmL46679910))
  const boxEl = document.getElementById('box');

  const movePr(视频资源vx(cmL46679910))omise = (el, point) => {
    return new Promise(resolve => {
      move(el, point, () => {
        resolve();
      });
    });
  };

  document.addEventListener(
    'click',
    () => {
      movePromise(boxEl, { x: 150 })
        .then(() => {
          return movePromise(boxEl, { x: 0, y: 0 });
        })
        .then(() => {
          return movePromise(boxEl, { x: 150, y: 150 });
        })
        .then(() => {
          return movePromise(boxEl, { y: 150 });
        });
    },
    false
  );

</script>

Promise 的实例方法 catch()

 finally() Promise.resolve() Promise 的构造函数方法 Promise.reject() Promise.all()

Promise.race() Promise.allSettled() Promise 的注意事项(视频资源vx(cmL46679910)) Promise 的注意事项和应用 3、Promise 的注意事项和应用 resolve 或 reject 执行后的代码