2021秋招面经

笔试把我乱杀

简历石沉大海

笔试把我乱杀

笔试把我乱杀

1. z-index是相对于谁的z轴？
2. HTTP是如何实现的
3. WeakMap和WeakSet 和 Map和Set的区别
4. Map和Set的作用
5. apply & bind的用法
6. let 暂时机制是如何实现的
7. promise的catch加在then前和then后的区别
8. 引用类型和基本类型的区别(存储方式)
9. 线程和进程
10. React diff算法
11. 前端路由是如何实现的

1. 各种排序的时间复杂度
2. 数据库中的索引是什么意思
3. TCP、UDP的区别
4. HTTP、HTTPS的区别

笔试把我乱杀

1. dom节点转换成json数据

dom节点转成json数据
页面上存在id=jsContainer的节点A，系统会随机在节点A中生成文档片段，请按照如下需求实现 dom2json 函数
1、dom2json需要分析整个节点A的dom结构，并将其结构转换为对应的json对象
2、需要获取dom结构的标签名称(tag)，所有属性(attributes)，子节点(children)
3、文档片段中的属性形式均为 name="value"，解析之后的格式为{name: value}, 属性值为String类型，不需要做解析
4、随机生成的文档片段中，只包含 nodeType 为1(element)和3(text)的节点，不需要考虑其他节点类型
5、纯文本也视为一个节点, json格式为 {tag: 'text', content: '文本内容'}，content为文本内容执行trim后的结果，如果该结果为空，则忽略当前节点
6、返回结果中的标签名称不区分大小写
7、如果节点不包含属性值或者子节点，其对应的结果中需要保留attributes以及children字段，例如 {tag: 'div', attributes: {}, children: []}
8、当前界面执行dom2json之后的结果为如下图所示
9、请不要手动修改html和css
10、不要使用第三方插件

    

        
1
        
2
    
    3
    4

function dom2json(id) {
    let root = document.getElementById(id)
    return analysisDom(root)
}

function analysisDom(d) {
    let obj 
    //nodeType为1 => 代表element
    if(d.nodeType == 1){
        obj = {}
        //获取d的标签名  (tagName为大写)
        obj.tag = d.localName
        obj.attributes ={}
        let atrlen = d.attributes.length
        // d.attributes为NameNodeMap类型 
        for(let i = 0 ; i< atrlen ; i++){
            // item(x)方法用来获取第x个属性
            const key = d.attributes.item(i).nodeName
            const value = d.getAttribute(key)
            obj.attributes[key] = value
        }
        obj.children = []
        if(d.childNodes.length !==0){
            d.childNodes.forEach(child => {
                if(analysisDom(child)){
                    obj.children.push(analysisDom(child))
                }
            })
        }
        
    }//nodeType为3 => 代表text
    else if(d.nodeType == 3){
        let content = d.textContent.trim()
        if(content){
            obj = {
                tag: 'text',
                content,
            }
        }
    }
    return obj
}

console.log(dom2json('jsContainer'))

2. 获取 url 参数
   限定语言：HTML/CSS/Javascript
   获取 url 中的参数
   • 指定参数名称，返回该参数的值 或者 空字符串
   • 不指定参数名称，返回全部的参数对象 或者 {}
   • 如果存在多个同名参数，则返回数组
   • 不支持URLSearchParams方法
     输入: http://www.nowcoder.com?key=1&key=2&key=3&test=4#hehe key
     输出: [1, 2, 3]

const url = 'http://www.nowcoder.com?key=1&key=2&key=3&test=4#hehe key'

function get_params(url,key) {
    const start = url.indexOf('?')
    const end = url.indexOf('#')
    const parma_arr = url.substring(start+1,end).split('&')
    const map = new Map
    for(const param_str of parma_arr){
        const params = param_str.split('=')
        if(map.has(params[0])){
            map.set(params[0],[...map.get(params[0]),params[1]])
        }else{
            map.set(params[0],[params[1]])
        }
       
    }
    console.log(map.get(key))
}

get_params(url,'key')

1. 实现TaskManager类

var taskManager = new TaskManager();
taskManager.add(function (next) {
    console.log('test a')
    setTimeout(function () {
        console.log('result a');
        next();
       // ...
    }, 333);
    // ...
});
taskManager.add(function (next) {
    console.log('test b');
    setTimeout(function () {
        console.log('result b');
        next();
        // ...
    }, 22);
    // ...
});

taskManager.run();

2. 森林的前序遍历

// type Forest = ForestNode[];
// type ForestNode = {
//     v: number, // value
//     c: Forest  // children
// };
// For example:
var forest1 = [{v: 9}, {v: 8}, {v: 7}];
var forest2 = [
    {v: 9, c: [
        {v: 99},
        {v: 98}
    ]},
    {v: 8},
    {v: 7}
];
var forest3 = [
    {v: 9, c: [
        {v: 99},
        {v: 98}
    ]},
    {v: 8},
    {v: 7, c: [
        {v: 79},
        {v: 78, c: [
            {v: 789},
            {v: 788}
        ]},
        {v: 77}
    ]}
];

function preOrderTraverse(forest) {
    // TODO
}
console.log(preOrderTraverse(forest1)); // [9, 8, 7]
console.log(preOrderTraverse(forest2)); // [9, 99, 98, 8, 7]
console.log(preOrderTraverse(forest3)); // [9, 99, 98, 8, 7, 79, 78, 789, 788, 77]