想成功就业Web前端工程师，想要高薪就业，不只要掌握Web技能，还需懂得面试技巧和面试时常见的面试题。酷仔今日整理了两道前端常见面试题及答案，希望对您Web前端学习或面试提供参考。

问题一：实现一个方法将data结构转换为tree结构。

let data = [
{"parent_id": null, "id": 'a', 'value': 'xxxx'},
{"parent_id": 'a', "id": 'c', 'value': 'xxxx'},
{"parent_id": 'd', "id": 'f', 'value': 'xxxx'},
{"parent_id": 'c', "id": 'e', 'value': 'xxxx'},
{"parent_id": 'b', "id": 'd', 'value': 'xxxx'},
{"parent_id": 'a', "id": 'b', 'value': 'xxxx'},
];
let tree = {
'a': {
value: 'xxx',
children: {
'b': {
value: 'xxx',
children: {
'd': {
value: 'xxx',
children: {
'f': {
value: 'xxx'
}
}
}
}
},
'c': {
value: 'xxx',
children: {
'e': {
value: 'xxx'
}
}
}
}
}
}；

解析：

function transformToTree(data) {
let result = {};
let newData;
data.sort((a, b) => a.id.codePointAt() - b.id.codePointAt());
newData = data.filter(item => !item.parent_id);
newData.forEach(item => {
result[item.id] = {
value: item.value
};
});
function loop(result) {
for (const key in result) {
let newData = data.filter(item => item.parent_id === key);
if (newData.length) {
newData.forEach(item => {
result[key].children = result[key].children || {};
result[key].children[item.id] = {
value: item.value
};
loop(result[key].children);
});
}
}
}
loop(result);
return result;
}

问题二：js垃圾回收方法

解析：标记清除（mark and sweep）

这是JavaScript最常见的垃圾回收方式，当变量进入执行环境的时候，比如函数中声明一个变量，垃圾回收器将其标记为“进入环境”，当变量离开环境的时候（函数执行结束）将其标记为“离开环境”。

垃圾回收器会在运行的时候给存储在内存中的所有变量加上标记，然后去掉环境中的变量以及被环境中变量所引用的变量（闭包），在这些完成之后仍存在标记的就是要删除的变量了，引用计数(reference counting)在低版本IE中经常会出现内存泄露，很多时候就是因为其采用引用计数方式进行垃圾回收。

引用计数的策略是跟踪记录每个值被使用的次数，当声明了一个 变量并将一个引用类型赋值给该变量的时候这个值的引用次数就加1，如果该变量的值变成了另外一个，则这个值的引用次数减1，当这个值的引用次数变为0的时 候，说明没有变量在使用，这个值没法被访问了，因此可以将其占用的空间回收，这样垃圾回收器会在运行的时候清理掉引用次数为0的值占用的空间。

在IE中虽然JavaScript对象通过标记清除的方式进行垃圾回收，但BOM与DOM对象却是通过引用计数回收垃圾的， 也就是说只要涉及BOM及DOM就会出现循环引用问题。

以上就是酷仔今天整理提供的Web前端开发面试题，希望为Web前端同学提供了有用的面试素材，以后酷仔每日均会提供Python及Web相关的习题。

特殊说明：以上资料由开课吧提供！