Killer

// 第一题 Promise 相关
/**
实现一个函数 使当前运行的异步操作（promise 或者 async）停止等待若干秒 
请注意函数的容错和鲁棒性

测试例子如下： 
(async () => {
  console.log('hello')
  await sleep(2000) // 等待两秒
  console.log('world')
})()
*/

const sleep = ms => {
  // TODO: 写出你的实现
  return new Promise(resolve => setTimeout(resolve, ms))
}

// 判断两个dom元素是否在文档流上重叠
// 给出一个函数，入参为两个dom元素，返回值为它们是否重叠
function isOverlap(dom1, dom2) {
  // TODO: 写出你的实现
  let domA = dom1.getBoundingClientRect()
  let domB = dom2.getBoundingClientRect()

  let left = domA.right < domB.left
  let right = domA.left > domB.right
  let top = domA.top > domB.bottom
  let bottom = domA.bottom < domB.top

  return !(left && right && top && bottom)
}

// 第三题数组合并并去重
/**
 实现mergeObjectListByKey函数，合并两个数组中的对象元素，并且针对重复的对象做属性的合并
 
 要求：
 1. 合并两个重复，即去重（通过参数key中的属性名判断重复）
 2. 重复的对象在合并时：
   - 不同的字段全部保留。
   - 相同的字段，若值不同，则认为无法确定准确值，去除，值相同则保留
 3. 注重可读性，尽量用Object对象、Array对象的遍历方法实现，不强求
 */

/**
 oldList, newList 为要合并的对象数组
 key判断是否重复的属性名
 返回合并的数组
 */
function mergeObjectListByKey(oldList, newList, key) {
  // TODO: 写出你的实现
  if (!newList.length || !oldList.length) {
    return Object.assign(oldList, newList)
  }
 
    return newList.reduce((acc, cur) => {
    const target = acc.find(e => e[key] === cur[key])
    if (target) {
      Object.entries(target)
      // Object.assign(target, cur)
    } else {
      acc.push(cur)
    }

    return acc
  }, oldList)
}


// 测试数据
const nullArray = []
const repeat = [{ id: 1, name: '张三', age: 101 }]
const team = [
  { id: 1, name: '张三', age: 11 },
  { id: 2, name: 'mike', age: 22 },
  { id: 3, name: '小李', age: 44 },
  { id: 5, name: '李', age: 44, gender: 1 },
]
const newTeam = [
  { id: 2, name: 'mike', age: 99 },
  { id: 3, name: '小李', tel: 18899998888 },
  { id: 4, name: 'jay' },
  { id: 5, name: '李', age: 44, gender: 0, tel: 12312312312 },
]

// 输出验证，预期true
const mergedTeam = mergeObjectListByKey(team, newTeam, 'id').sort((a, b) => a.id - b.id)
const testCase = [
  { id: 1, name: '张三', age: 11 },
  { id: 2, name: 'mike' },
  { id: 3, name: '小李', age: 44, tel: 18899998888 },
  { id: 4, name: 'jay' },
  { id: 5, name: '李', age: 44, tel: 12312312312 },
]

console.log(JSON.stringify(mergedTeam) === JSON.stringify(testCase))

<script>
// 1. 让 button 在屏幕水平垂直居中, 写 center class
// 2. 实现一个倒计时组件，要求倒计时的时候，button 样式 disabed 态，鼠标不能再点击
export default {
  data() {
    return {
      count: 3,
      disabled: false
    }
  },
  
  computed: {
  },

  methods: {
    countDown() {
      setInterval(() => {
         this.count--
      }, 1000)
      this.disabled = true
    }
  },
}
</script>

<template>
  <div class='center'>
    <button @click='countDown' :class='{ disabled }'>
      Your Code Here
    </button>
    	
    {{count}}
  </div>
</template>

<style>
  .center {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .disabled {
    cursor: not-allowed;
  }
</style>