使用链表描述复杂结构

halo 米娜过年好，俺是 132，首先大家过年好哇！大家知道我写过一个叫 fre 的框架，在 fre 中最主要的特点就是使用链表去描述 vdom 树，这是很少见的

let commitment = null

// 构建单向环状链表
for (let i = 0; i < children.length; i++){
commitment.next = children[i]
commitment = children[i]
}
commitment.next = children[0]

// 循环遍历链表
let current = commitment.next
while (current) {
// do something
current = current.next
}

// 构建链表树
// https://github.com/yisar/fre/blob/master/src/reconciler.ts#L176
for (var i = 0, prev = null; i  0) {
prev.sibling = child
} else {
if (WIP.tag & OP.SVG) child.tag |= OP.SVG
WIP.child = child
}
prev = child
}

// 遍历链表树
let root = fiber
let node = fiber
while (true) {
// Do something with node
if (node.child) {
node = node.child
continue
}
if (node === root) return
while (!node.sibling) {
if (!node.return || node.return === root) return
node = node.return
}
node = node.sibling
}

 132
[        #      #  [   ]   ]
Element > Node > Node > Element > End > End

const {ELEMENT, ATTRIBUTE, TEXT} = Node

const div = new Node(ELEMENT)

const id = new Node(ATTRIBUTE)
tag.next = id
id.prev = div

const text = new Node(TEXT)
id.next = text
text.prev = id

const br = new Node(ELEMENT)
text.next = br
br.prev = text

br.end = new Node(br.End)
div.end = new Node(div.End)

const childNodes = element => {
const nodeList = []
let { next, end } = element
while (next !== end) {
if (next.type !== Node.ATTRIBUTE) {
nodeList.push(next)
if (next.type === Node.ELEMENT)
next = next.end
}
next = next.next
}
return nodeList
}