2019年百度前端工程师面试题(附答案)

关于 “2019年百度前端工程师面试题(附答案)” 的完整攻略，我会从以下几个方面进行讲解：

1. 答题技巧
2. 题目分类
3. 示例讲解

1. 答题技巧

首先，我们需要了解一些答题技巧，来帮助我们更好地回答面试题。

1. 首先，阅读题目时一定要仔细，理解清楚题目要求和限制。
2. 其次，如果遇到复杂的题目或者不理解的概念，不要惊慌，可以先思考一下如何简化问题，或者查看相关的资料。
3. 除了答题余力，时间管理也非常重要。在回答题目时，要注意控制好时间，把时间分配到每个题目中，避免时间不够。
4. 细节要注意，可以使用代码块、表格等排版方式来使回答更加规范明确。

2. 题目分类

在回答题目之前，先把题目分类，这样可以更好地有条理地回答问题。

1. HTML/CSS 相关
2. JavaScript 相关
3. 编程思维相关
4. 算法相关

3. 示例讲解

以下是两个题目的分别的完整回答示例：

1. 题目描述

实现一个拖动功能：

1. 可以拖动指定区域内的元素
2. 松开鼠标时，元素停留在释放位置

1. 解答

<!-- HTML 结构 -->
<div id="box"></div>

<script>
  // JavaScript
  var box = document.getElementById('box');

  // mouse events
  var x, y, ox, oy; // x，y 为鼠标点击位置，ox，oy 为 box 元素偏移量
  box.onmousedown = function(e) {
    var event = e || window.event;
    x = event.clientX;
    y = event.clientY;
    ox = parseInt(box.style.left);
    oy = parseInt(box.style.top);
    document.onmousemove = move;
    document.onmouseup = up;
  };

  function move(e) {
    var event = e || window.event;
    var mx = ox + event.clientX - x;
    var my = oy + event.clientY - y;
    box.style.left = mx + 'px';
    box.style.top = my + 'px';
  }

  function up() {
    document.onmousemove = null;
    document.onmouseup = null;
  }
</script>

<style>
  /* CSS 样式 */
  #box {
    position: absolute;
    width: 100px;
    height: 100px;
    border: 1px solid black;
    background-color: #ccc;
  }
</style>

以上是一个简单的拖拽功能实现，通过绑定鼠标事件，获取鼠标点击位置和 box 元素偏移量，通过计算当前鼠标位置和偏移量，设置元素的 left 和 top 属性来实现拖拽效果。

2. 题目描述

实现一个找出字符串中出现最多的字符和次数的方法，

例如输入： 'aabbcccddddd'，返回：

{
  char: 'd',
  count: 5
}

2. 解答

function findMostChar(s) {
  // 用一个 hash 表来存储每个字符出现的次数
  var hash = {};
  // 遍历字符串
  for (var i = 0; i < s.length; i++) {
    if (hash[s[i]]) {
      hash[s[i]]++;
    } else {
      hash[s[i]] = 1;
    }
  }
  // 遍历 hash 表中出现次数最多的字符
  var max = 0;
  var char = '';
  for (var key in hash) {
    if (hash[key] > max) {
      max = hash[key];
      char = key;
    }
  }
  // 返回出现最多的字符和次数
  return {
    char: char,
    count: max
  };
}

// 测试
console.log(findMostChar('aabbcccddddd')); // output: {char: "d", count: 5}

以上是一个简单的实现，通过遍历字符串，使用一个 hash 表存储各个字符出现的次数，最后在 hash 表中遍历出现次数最多的字符和出现的次数。