1、堆

2、防抖节流

3、图片懒加载，

Intersection Observer API （最佳实现方案）

// onload是等所有的资源文件加载完毕以后再绑定事件 window.onload = function(){ // 获取图片列表，即img标签列表 var imgs = document.querySelectorAll('img');

// 获取到浏览器顶部的距离
function getTop(e){
	return e.offsetTop;
}

// 懒加载实现
function lazyload(imgs){
	// 可视区域高度
	var h = window.innerHeight;
	//滚动区域高度
	var s = document.documentElement.scrollTop || document.body.scrollTop;
	for(var i=0;i<imgs.length;i++){
		//图片距离顶部的距离大于可视区域和滚动区域之和时懒加载
		if ((h+s)>getTop(imgs[i])) {
			// 真实情况是页面开始有2秒空白，所以使用setTimeout定时2s
			(function(i){
				setTimeout(function(){
					// 不加立即执行函数i会等于9
					// 隐形加载图片或其他资源，
					//创建一个临时图片，这个图片在内存中不会到页面上去。实现隐形加载
					var temp = new Image();
					temp.src = imgs[i].getAttribute('data-src');//只会请求一次
					// onload判断图片加载完毕，真是图片加载完毕，再赋值给dom节点
					temp.onload = function(){
						// 获取自定义属性data-src，用真图片替换假图片
						imgs[i].src = imgs[i].getAttribute('data-src')
					}
				},2000)
			})(i)
		}
	}
}
lazyload(imgs);

// 滚屏函数
window.onscroll =function(){
	lazyload(imgs);
}

}

4、递归和迭代

递归代码简洁好理解但是重复调用自身函数会造成堆和队列溢出

1、迭代是重复函数内部某段代码

2、每一次迭代的结果作为下一次迭代的初始值

3、递归是重复调用函数自身

4、递归是将大问题拆分成一个个独立的不可分割的小问题，每个小问题具有相同的解决方法，通过循环解决小问题来解决大问题。