霍春阳版

2023年08月30日

柏拉文

越努力，越幸运

一、实现

---

const patch = (n1, n2, container, anchor) => {
    if (n1 === n2) {
      return;
    }

    if (n1 && n1.type !== n2.type) {
      /**
       * @description: 如果新旧 vnode 类型不同, 直接将旧 vnode 卸载
       * 描述: 对于 type 不同的元素来说, 每个元素都有特有的属性, 不存在打补丁的意义。在 type 不同的情况下, 先将旧 vnode 卸载, 再将新 vnode 挂载到容器中
       */
      unmount(n1);
      n1 = null;
    }

    const { type, shapeFlag } = n2;

    switch (type) {
      case Text:
        processText(n1, n2, container, anchor);
        break;
      case Comment:
        processCommentNode(n1, n2, container, anchor);
        break;
      case Static:
        break;
      case Fragment:
        processFragment(n1, n2, container, anchor);
        break;
      default:
        if (shapeFlag & ShapeFlags.ELEMENT) {
          processElement(n1, n2, container, anchor);
        } else if (shapeFlag & ShapeFlags.COMPONENT) {
        } else if (shapeFlag & ShapeFlags.TELEPORT) {
        } else if (shapeFlag & ShapeFlags.SUSPENSE) {
        }
    }
};