-
Notifications
You must be signed in to change notification settings - Fork 0
/
面试题记录.html
87 lines (87 loc) · 10.3 KB
/
面试题记录.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<!DOCTYPE html><html lang="zh-Hans"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"><meta name="description" content="面试题记录"><meta name="keywords" content="React,前端,移动端,H5,JavaScript,React Hook,TypeScript"><meta name="author" content="ZK8080"><meta name="copyright" content="ZK8080"><title>面试题记录 | ZKAT</title><link rel="shortcut icon" href="/melody-favicon.ico"><link rel="stylesheet" href="/css/index.css?version=1.9.0"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome@latest/css/font-awesome.min.css?version=1.9.0"><meta name="format-detection" content="telephone=no"><meta http-equiv="x-dns-prefetch-control" content="on"><link rel="dns-prefetch" href="https://cdn.jsdelivr.net"><meta http-equiv="Cache-Control" content="no-transform"><meta http-equiv="Cache-Control" content="no-siteapp"><script src="https://v1.hitokoto.cn/?encode=js&charset=utf-8&select=.footer_custom_text" defer></script><script>var GLOBAL_CONFIG = {
root: '/',
algolia: undefined,
localSearch: {"path":"search.xml","languages":{"hits_empty":"找不到您查询的内容:${query}"}},
copy: {
success: '复制成功',
error: '复制错误',
noSupport: '浏览器不支持'
},
hexoVersion: '5.4.0'
} </script><meta name="generator" content="Hexo 5.4.0"></head><body><canvas class="fireworks"></canvas><i class="fa fa-arrow-right" id="toggle-sidebar" aria-hidden="true"></i><div id="sidebar" data-display="false"><div class="author-info"><div class="author-info__avatar text-center"><img src="/img/avatar.png"></div><div class="author-info__name text-center">ZK8080</div><div class="author-info__description text-center">前端小白的个人总结记录</div><div class="follow-button"><a target="_blank" rel="noopener" href="https://github.com/zk8080">Follow Me</a></div><hr><div class="author-info-articles"><a class="author-info-articles__archives article-meta" href="/archives"><span class="pull-left">文章</span><span class="pull-right">36</span></a><a class="author-info-articles__tags article-meta" href="/tags"><span class="pull-left">标签</span><span class="pull-right">15</span></a><a class="author-info-articles__categories article-meta" href="/categories"><span class="pull-left">分类</span><span class="pull-right">2</span></a></div></div></div><nav id="nav" style="background-image: url(https://raw.githubusercontent.com/zk8080/blog-picture/master/img/8FdEwlxP3oU.jpg)"><div id="page-header"><span class="pull-left"> <a id="site-name" href="/">ZKAT</a></span><i class="fa fa-bars toggle-menu pull-right" aria-hidden="true"></i><span class="pull-right menus"> <a class="site-page" href="/">主页</a><a class="site-page" href="/archives">归档</a><a class="site-page" href="/tags">标签</a><a class="site-page" href="/categories">分类</a></span><span class="pull-right"><a class="site-page social-icon search"><i class="fa fa-search"></i><span> 搜索</span></a></span></div><div id="site-info"><div id="site-title">ZKAT</div><div id="site-sub-title"></div><div id="site-social-icons"><a class="social-icon" href="https://github.com/zk8080" target="_blank" rel="noreferrer noopener nofollow"><i class="fa-github fa"></i></a></div></div></nav><div id="content-outer"><div class="layout" id="content-inner"><article id="page"><h1>面试题记录</h1><div class="article-container"><p>最近在找工作，所以来记录下自己面试过程中的问题。</p>
<h2 id="A轮人工智能公司"><a href="#A轮人工智能公司" class="headerlink" title="A轮人工智能公司"></a>A轮人工智能公司</h2><p>这个是昨天面试的一家公司，电话面试初试通过，在等待二面中。</p>
<h3 id="一面-电话面"><a href="#一面-电话面" class="headerlink" title="一面(电话面)"></a>一面(电话面)</h3><ul>
<li>说一下React Hooks中的<code>useCallback</code>和<code>useMemo</code>两个API<blockquote>
<p>这个我说了下是用来缓存和为什么要用这两个API去缓存的原因，可以参考官方文档<a target="_blank" rel="noopener" href="https://react.docschina.org/docs/hooks-reference.html#usecallback">Hooks API</a></p>
</blockquote>
</li>
</ul>
<ul>
<li>React setState之后发生了什么<blockquote>
<p>这个考察的范围很大，但是因为我对源码了解不多，所以只说了下setState之后生命周期更新的流程，和React协调的过程，也就是在render里面根据新的数据状态生成新的虚拟dom，然后利用diff算法对比上一次的虚拟dom，查找出需要更新的节点，来更新新的UI。这个大家可以去网上查阅一些资料。</p>
</blockquote>
</li>
</ul>
<ul>
<li>谈一下React合成事件<blockquote>
<p>这个了解的不多，只是知道React的事件都是注册在顶层的<code>document</code>节点上，利用事件冒泡的机制去触发绑定的事件。具体的大家可以参考这篇文章<a target="_blank" rel="noopener" href="https://mp.weixin.qq.com/s/8KrgoeLSuZ5-p-0cDZeb8A">一文吃透 React 事件机制原理</a></p>
</blockquote>
</li>
</ul>
<ul>
<li>使用es5实现继承的方式<blockquote>
<p>这个说了下原型继承，和组合继承，还有寄生式继承。不过讲的不是特别好，还需要再巩固下。</p>
</blockquote>
</li>
</ul>
<ul>
<li>http缓存-强缓存和协商缓存<blockquote>
<p>这个因为记得不是太清楚，说的时候没能说出具体使用的请求头和响应头的属性。大家可以参考下这篇文章<a target="_blank" rel="noopener" href="https://juejin.im/post/5b3c87386fb9a04f9a5cb037">面试精选之http缓存</a>，讲的很棒。</p>
</blockquote>
</li>
</ul>
<ul>
<li>webpack怎么抽取公共包<blockquote>
<p>这个使用DllPlugin抽取第三方库，可以在二次打包的时候极大的提升编译速度。具体的大家可以参考官方文档。</p>
</blockquote>
</li>
</ul>
<ul>
<li>webpack有哪几种hash值，具体怎么使用<blockquote>
<p>这里我只说出了hash、chunkhash、contenthash，和怎么使用的。但是三者的区别，我不太清楚。大家可以看下这篇文章<a target="_blank" rel="noopener" href="https://juejin.im/post/5d70aee4f265da03f12e7ab2">webpack中的hash、chunkhash、contenthash分别是什么</a></p>
</blockquote>
</li>
</ul>
<ul>
<li>webpack懒加载<blockquote>
<p>这个我说了下React.lazy和import()动态加载模块实现懒加载。具体的大家可以查阅下官网和资料。</p>
</blockquote>
</li>
</ul>
<p>一面就是这些内容，自己回答的一般吧。要补充的知识还有很多，需要继续努力，再巩固下基础和深入一下框架的原理。后序面试会再补充到这里，加油！</p>
</div></article><nav id="pagination"><div class="pagination"></div></nav><div id="vcomment"></div><script src="https://cdn1.lncld.net/static/js/3.0.4/av-min.js"></script><script src="https://cdn.jsdelivr.net/npm/valine/dist/Valine.min.js"></script><script>var notify = 'false' == 'true';
var verify = 'false' == 'true';
var record_ip = '' == 'true';
var GUEST_INFO = ['nick','mail','link'];
var guest_info = 'nick,mail,link'.split(',').filter(function(item){
return GUEST_INFO.indexOf(item) > -1
});
guest_info = guest_info.length == 0 ? GUEST_INFO :guest_info;
window.valine = new Valine({
el:'#vcomment',
notify:notify,
verify:verify,
recordIP:record_ip,
appId:'BVH0tb3qPtsBNYduMK1TH6np-gzGzoHsz',
appKey:'YmPc2e3KpDneFgDrTravJvWr',
placeholder:'Just go go',
avatar:'mm',
guest_info:guest_info,
pageSize:'10',
lang: 'zh-cn'
})</script></div></div><footer class="footer-bg" style="background-image: url(https://raw.githubusercontent.com/zk8080/blog-picture/master/img/8FdEwlxP3oU.jpg)"><div class="layout" id="footer"><div class="copyright">©2018 - 2022 By ZK8080</div><div class="framework-info"><span>驱动 - </span><a target="_blank" rel="noopener" href="http://hexo.io"><span>Hexo</span></a><span class="footer-separator">|</span><span>主题 - </span><a target="_blank" rel="noopener" href="https://github.com/Molunerfinn/hexo-theme-melody"><span>Melody</span></a></div><div class="footer_custom_text">hitokoto</div><div class="busuanzi"><script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script><span id="busuanzi_container_site_uv"><i class="fa fa-user"></i><span id="busuanzi_value_site_uv"></span><span></span></span><span class="footer-separator">|</span><span id="busuanzi_container_site_pv"><i class="fa fa-eye"></i><span id="busuanzi_value_site_pv"></span><span></span></span></div></div></footer><i class="fa fa-arrow-up" id="go-up" aria-hidden="true"></i><script src="https://cdn.jsdelivr.net/npm/animejs@latest/anime.min.js"></script><script src="https://cdn.jsdelivr.net/npm/jquery@latest/dist/jquery.min.js"></script><script src="https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@latest/dist/jquery.fancybox.min.js"></script><script src="https://cdn.jsdelivr.net/npm/velocity-animate@latest/velocity.min.js"></script><script src="https://cdn.jsdelivr.net/npm/velocity-ui-pack@latest/velocity.ui.min.js"></script><script src="/js/utils.js?version=1.9.0"></script><script src="/js/fancybox.js?version=1.9.0"></script><script src="/js/sidebar.js?version=1.9.0"></script><script src="/js/copy.js?version=1.9.0"></script><script src="/js/fireworks.js?version=1.9.0"></script><script src="/js/transition.js?version=1.9.0"></script><script src="/js/scroll.js?version=1.9.0"></script><script src="/js/head.js?version=1.9.0"></script><script src="/js/search/local-search.js"></script><script>if(/Android|webOS|iPhone|iPod|iPad|BlackBerry/i.test(navigator.userAgent)) {
$('#nav').addClass('is-mobile')
$('footer').addClass('is-mobile')
$('#top-container').addClass('is-mobile')
}</script><div class="search-dialog" id="local-search"><div class="search-dialog__title" id="local-search-title">本地搜索</div><div id="local-input-panel"><div id="local-search-input"><div class="local-search-box"><input class="local-search-box--input" placeholder="搜索文章"></div></div></div><hr><div id="local-search-results"><div id="local-hits"></div><div id="local-stats"><div class="local-search-stats__hr" id="hr"><span>由</span> <a target="_blank" rel="noopener" href="https://github.com/wzpan/hexo-generator-search" style="color:#49B1F5;">hexo-generator-search</a>
<span>提供支持</span></div></div></div><span class="search-close-button"><i class="fa fa-times"></i></span></div><div class="search-mask"></div></body></html>