2024-8-26 美团一面流转

Juns2024-08-272024-09-08

2024-8-26 美团一面流转

隔了一天写的，可能有些忘了
流转到其他部门了

问题

自我介绍
- 提到了 iframe 和微前端，展开说说 iframe 的问题、微前端沙箱、如何解决卡顿
- jsb 展开，怎么实现，如何处理版本降级
进程和线程
tcp 三次握手
了解哪些设计模式
vue 组件通信
浏览器存储
事件循环输出题目

setTimeout(function () {
  console.log(1)
}, 1000)
new Promise(function executor(resolve) {
  console.log(2)
  for (var i = 0; i < 10000; i++) {
    i == 9999 && resolve()
  }
  console.log(3)
}).then(function () {
  console.log(4)
})
console.log(5)

手写发布订阅模式

class PubSub {
	constructor() {
    this.sub={}
	}
	const on = (event, fn) => {
    if(!this.sub?.[event])return
    if(this.sub[event]){
      this.sub[event].push(fn)
    }else{
      this.sub[event] = [fn]
    }
	}

	const emit = (event, data) => {
    if(!this.sub?.[event])return
    for(let task of this.sub[event]){
      task(data)
    }
	}
	const unSub = (event, fn) => {
    if(!this.sub?.[event])return
    this.sub[event]=this.sub[event].filter(item => item!==fn)
	}
}

const pubsub = new PubSub()

pubsub.on('event', (data) => {

	console.log('event:' + JSON.stringify(data));

})

pubsub.emit('event', { a: 1 });

手写 node 数组转 dom 字符串

type DocNode = {

	type: 'link' | 'text' | 'image' | 'break' | 'division'

	children: DocNode[] | string

	properties: any

}

const map = {
  link: 'a',
  text: 'span',
  image: 'img'
  break: 'br',
  division: 'div'
}

function renderToHTML(nodes: DocNode[]): string {
  let res = ''

  for(const node of nodes){
    if(node.type === 'break'){
      res+='<br />'
      continue
    }
    let str = ''
    str+= '<'
    str+= map[node.type]
    // object
    if(node.properties){
      let tempStr = Object.entries(node.properties).map(([key,val])=>` ${key}="${val}"`).join('')
      str+= tempStr
    }
    str+= '>'
    if(typeof node.children === 'string')str+=node.children
    else str+=renderToHTML(node.children)
    str+=`<${map[node.type]} />`
    res += str
  }

  return res

	// return ''

}

// <span>1234</span><div><img src="" /><br /><a href="">link</a></div>