网易云音乐前端一面二面hr面

博主面的是网易云音乐部门，大概面了四十分钟。（感觉不按套路出牌T_T）

一面

项目里用到了react，为什么要选择react，react有哪些好处？

这个问题有想过，就balabala答了一些虚拟DOM、数据驱动、面向对象等等。
面试官又接着问，那怎么获取真正的dom？

答了ref，面试官又问具体怎么用，因为实际中没怎么用这个，很虚的答了某元素上赋ref属性等于一个字符串，再获取。

面试官又接着问后来出了一种更好的替代这个的办法，是什么？（emmmm）

这个答案我好像还是没找到。。。
数组移除第一个元素的方法有哪些？

说了slice(1)和shift()之后，面试官问slice和splice是不是记混了，然后问了slice, splice的区别是什么。。。我答了slice会创建一个新的数组，splice不会。。。（再百度一下）。
给两个构造函数A和B，如何实现A继承B？

这个提前准备过，就答得还算顺畅。
```
function A(...) {}  A.prototype...
function B(...) {}  B.prototype...
A.prototype = Object.create(B.prototype);
// 再在A的构造函数里new B(props);
```
面试官问为什么要用Object.create(B.prototype)？

答了因为如果这里用new B()的话，函数B的构造函数的参数就传了undefined，里面的一些函数可能会误执行，如果构造函数里面创建了一些对象的话，可能会造成内存泄漏。

面试官又接着问，如果不用Object.create()，怎么解决这个问题？

答了Object.create()的底层实现。
```
Object.create =  function (o) {
    var F = function () {};
    F.prototype = o;
    return new F();
};
```

for(var i = 0; i < lis.length; i++) {
  lis[i].addEventListener('click', function(e) {
    alert(i);
  }, false)
}

问能不能正常打印索引，，，

肯定不能，电话面试看不到代码，没想起可能的原因在var上（如果是笔试肯定答得出来，，，T_T），，，这个是i在click的时候，已经变成length了。

可以将var改成let，或者bind一下，或者内部搞一个闭包。

for(let i = 0; i < lis.length; i++) {
  lis[i].addEventListener('click', function(e) {
    alert(i);
  }, false)
}

for(var i = 0; i < lis.length; i++) {
  lis[i].addEventListener('click', function(i) {
    alert(i);
  }.bind(null, i), false)
}

for(var i = 0; i < lis.length; i++) {
  lis[i].addEventListener('click', (function(e) {
    alert(i);
  })(i), false)
}

这个问题最初问的是，一个ul，里面有很多li，绑定click事件，alert出索引，最开始答得是使用事件委托，在ul上绑定click事件。

如果已经有三个promise，A、B和C，想串行执行，该怎么写？

// promise
A.then(B).then(C).catch(...)
// async/await
(async ()=>{
 await a();
 await b();
 await c();
})()

面试官接着问，现在不是三个了，如果是一个数组该怎么办？

// promise
let prom = proms[0];
for(let i = 1; i < proms.length; i++) {
 prom = prom.then(proms[i]);
}
// async/await
(async ()=>{
 for(let i = 0; i < proms.length; i++) {
   await prom[i]();
 }
})()

面试官想了一下说，感觉promise的应该这样可以实现，让我下去自己试试，emmm

使元素消失的方法有哪些？

答了visibility：hidden，display：none，z-index: -1, opacity: 0。

面试官接着问，visibility：hidden和opacity: 0有什么区别？emmm，有点懵，没答出来。

百度答案如下：

1 opacity：0，该元素隐藏起来了，但不会改变页面布局，并且，如果该元素已经绑定一些事件，如click事件，那么点击该区域，也能触发点击事件的
2 visibility：hidden，该元素隐藏起来了，但不会改变页面布局，但是不会触发该元素已经绑定的事件
3 display：none，把元素隐藏起来，并且会改变页面布局，可以理解成在页面中把该元素删除掉。

两个嵌套的div，position都是absolute，子div设置top属性，那么这个top是相对于父元素的哪个位置定位的。

en，还以为都会问position有哪些属性，相对什么样的元素定位之类的问题，emmm，猜了一个，果然不对。

是margin的外边缘，打开检查点某个元素，可以看到对应的盒模型，通常我们可能只注意到了margin，padding这些，实际上，margin的外面还有一层position（top，left，right，bottom）。
如何学的前端？
看到我简历中有做学校前端培训负责人的经历，问了问有什么收获？
还有什么问题想问？

emmmm，本来觉得还可以，写完这篇，发现答出来的跟没答出来的比例好像。。。。，心虚的等等看有木有什么奇迹。

---分割线---

过了一天，接到了二面电话，约在下周一的中午。
写的比较晚了，面试的内容有些不记得了，尽量回忆。
感觉网易的面试官都比较与众不同，80%的http+3个js+1个react。。。

1. 常规的自我介绍，中间说了使用了react和跨域，面试管就问react有哪些好处，以及跨域的方式。
大概答了答虚拟DOM、diff算法、数据驱动之类的，跨域就是CORS的使用方式，JSONP的方式及缺点等等。
2.  关于http知道多少？
最开始有点懵，后来默默地说了状态码、请求方法、请求头，http和https，然后想着得留点给人家问，不然说完面试官再提问就GG了。。。就说大概这么多。

知道304吗，什么时候用304？
最开始只想的到基本的not modified，没特意去查过304的使用场景，抓了会儿头突然想到之前准备过一段缓存相关的请求头，好像有提到过200和304，试着答了下如果请求的资源文件本地已缓存，那么返回304，没有的话，返回200。
然后面试官表示正确，然后接着问具体有哪些请求头是跟缓存相关的，balabala按响应头和请求头依次说了一遍。
面试官接着问到，知道private和public吗？
表示没注意过。。。
cookie和session的区别
关于cookie了解的稍微多一些，session只知道是在服务端的，然后说了一些cookie和webstorage的区别的优缺点企图让面试官忘记session的不全面，事实证明没有成功。
接着问，cookie有哪些字段可以设置？
balabala答了一些基本的字段。
cookie有哪些编码方式？
(emmmm，怎么还在问http，T_T)
cookie的编码方式没了解过，表示只知道encodeComponent和encodeURIComponent，然后向面试官解释了下区别。
session具体是怎么存储数据的？
T_T，还以为面试官已经忘了session这茬了，表示不知道。
1. 说一下String的相关api？
2. 说一下array的相关api？
3. 知道数组的sort方法底层是什么排序方式吗？
  依稀记得是插排和快排，数组长度小于等于 22 的用插入排序 InsertionSort，比22大的数组则使用快速排序 QuickSort。
4. 最近在学什么？
  答了react，说看了底层原理比如diff算法。
5. 面试官果然问到，diff算法是什么？
  balabala答了逐层比较、key值作用之类的。
6. 差不多这么多问题，今天先这样吧。
  我答好，然后电话挂断。。。没有问我要问我有没有什么要问的，瑟瑟发抖。

--分割线--

过了一天，晚上接到了hr的电话，说是问什么时候有空，安排一下hr面，定了周四中午。

hr面

就是些你有什么缺点、优点、怎么学的前端、什么时候能来实习、有没有什么遇到的问题怎么解决的、未来的职业规划等等诸如此类，我问了下薪酬福利相关，最后hr问我有没有什么在流程中的，答了晚上有阿里一面（虽然感觉。。。），hr表示要跟其他人商量一下，安排一下初步的时间，希望我催一下阿里的进度。。。。。然后一周内给答复。

过了两三天，接到了hr的电话，谈了薪资福利相关的事情。

#内推##实习##面经##前端##网易#