1 哪些操作會引起內存泄漏，如何發現
一些常見的內存泄露代碼
// 意外的全局變量
functuon foo () { bar = 1} //函數里直接對未定義的變量賦值，導致變量存在頂部Window中，內存垃圾無法回收
//閉包變量被引用導致無法被回收
function fun2() {
var obj = { a: 2 }
return obj;
}
var a = fun2()
//被遺忘的定時器
function Test() {
this.obj= {};
this.index = 1;
this.timer = null;
var cache = []; // 內部變量，內存隱患...
this.timer = window.setInterval(() =>{
this.index += 1;
this.obj = {
val: '_timerxxxxxbbbbxx_' + this.index,
junk: [...cache]
};
cache.push(this.obj);
}, 1);
console.warn("create Test instance..");
}
test = new Test(); // JS對象開啟定時器不斷分配內存
...
參考文章：
https://juejin.im/post/5a8e7f6df265da4e832677ec
https://github.com/wengjq/Blog/issues/1
如何查看內存占用情況
web
googol控制臺 》 performance 面板 > 勾選 Memory
點擊左上角的錄制按鈕。
在頁面上進行各種操作，模擬用戶的使用情況。
如果內存占用基本平穩，接近水平，就說明不存在內存泄漏。反之，就是內存泄漏了。
node
console.log(process.memoryUsage()); //node
2 以下代碼輸出
typeof Vue
typeof React
typeof jQery
function github Vue
object github React
function github Jquery
ps：話說我寫了這么久Vue。還從來沒操作過typeof vue。。。。
3 下面代碼輸出
class F {
init () {
console.log（1）
}
}
var f = new F()
F.prototype.init = function () {
console.log(2)
}
f.init() //2
4 如何在數組頭部、尾部、中部增加/刪除
頭部：unshift / shift
中部：splice / concat
尾部： push / pop
參考：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array
5 手寫防抖/節流 實現
function throttleAndDebounce(fn, delay, isThrottle) {
let lastCallTime = 0, timer = null;
return (...args) => {
if (isThrottle) {
const now = Date.now()
if (now - lastCallTime < delay) return
lastCallTime = now
fn(...args)
} else {
if (timer) clearTimeout(timer)
timer = setTimeout( () => {
fn(...args)
}, delay)
}
}
}
6 filter/reduce 實現數組去重
var arr = [1,2,1]
arr.filter( (it, idx, arr) => {
return arr.indexOf(it) === idx
})
// reduce
var reducer = (arr, cur) => {
if ( arr.length === 0 || arr[arr.length - 1] !== cur) {
arr.push(cur)
}
return arr
}
arr.sort().reduce(reducer, [])
7 原生實現 上傳base64 圖片
<input id="file" type="file" />
var file = document.getElementById('file').files[0]
var reader = new FileReader()
reader.onload = function (e) {
$.post('/upload' , { "base64": e.target.result } , function () {})
}
reader.readAsDataURL(file)
8 寫成3種前端下載文件方式
參考： https://segmentfault.com/a/1190000016906180
ps：這也算！！？瀏覽器打開。。。內心一度崩潰，真的是為了面試而面試。。
9 手寫promise 實現
參考：
http://www.lxweimin.com/p/43de678e918a
10 vue實現數據綁定有什么缺陷？作者為什么改用proxy實現
參考：https://zhuanlan.zhihu.com/p/50547367
后記
有些問題 我沒給出答案，只給出一些參考鏈接，主要是才疏學淺，不能給出一個絕對完美的答案；或者答案的內容量可以再寫一篇深入專研的文章，大家有什么好的意見或者文章錯誤可以留言補充；歡迎技術交流
ps：一年沒面試了第一次做這種筆試題，我表示一個筆都好久沒握過的人瑟瑟發抖。。。建議大家不要裸辭。。這個夏天有點冷。。。
如果覺得本文對你有所幫助，就star一下吧～大傳送之術！ 我的博客Github
