回顾

内容若有错，烦请指正，谢谢！

js变量

值类型与引用类型 : 基本类型和对象

常见引用类型

	const obj = {a:1}
	const arr = [1,2,3]
	const n = null; // 特殊引用类型,指针指向空地址
	function fun(){} // 特殊引用类型,但不用作存储数据,故没有深浅拷贝

类型转换

• 字符串拼接
• ==
• if语句和逻辑运算

const a = 100 + 10; // 110
const a = 100 + '10'; // '11010'
const a = true + '10'; // 'true110'
100 == '100' // true 双等号 会做 类型转换
0 == '' // true
false == '0' // true
null == undefinded // true

原型与原型链

class

class Student {
    constructor(name, age, male = "Male") {
        this.name = name; // this 指向最后一个调用它的对象
        this.age = age;
        this.male = male // male 如果不赋值 就是用默认值
    }
    sayHi() {
        console.log('myName :', this.name, 'myAge :', this.age, "Male :", this.male);
    }
}
let xialuo = new Student('xialuo', 100);
xialuo.sayHi(); // myName : xialuo myAge : 100 Male : 女

每个class都有 “显示原型” prototype
每个实例都有 “隐式原型” proto
每个实例的__proto__ 都指向 class的 prototype

基于原型的执行规则

当实例获取属性的时候
先在自身的属性中查找
如果找不到就去 隐式原型(proto) 中寻找
隐式原型__proto__ 与class 的显示原型prototype指向一样,最终去存放的堆中查找
若都找不到 则报错

原型链

使用 hasOwnPrototype 来判断 该对象是否自身含有某个属性(从原型链继承来的则为false)
instanceOf 的工作原理就是使用__proto__ 一层一层上溯,匹配成功即为true,失败即为 false

---

作用域与闭包

1. this不同场景的指向问题
2. 手写bind函数(call，bind，apply相关)
3. 闭包是什么,闭包在什么场合下使用、

this指向问题

在不使用bind，call，apply的情况下：谁调用则this指向谁（一般情况）。
在箭头函数中则取当前箭头函数上级的this；setTimeout与setInterval则指向window（可以使用闭包的写法来解决指向问题）；（特殊情况）
特例：在严格模式下：“use strict” window调用的时候则为undefinded，否则打印window

setTimeout与setInterVal的this指向问题
箭头函数的this指向问题

• bind

    可以接受n个参数，第一个参数是需要绑定到this的对象，后面的参数具体的被绑定函数的参数而定
  

function fn1(a,b,c,d){

}

闭包

自由变量:如果一个函数内部有其他函数,那么这些内部函数可以访问外部函数中声明的变量(这些变量就称为自由变量)。

闭包就是一个函数捕获 作用域内部的外部绑定，并以函数嵌套函数的形式,无限期延长外部自由变量的生命周期

闭包的三个特性:
1.函数嵌套函数
2.函数内部可以引用外部的参数和变量
3.参数和变量不会被垃圾回收机制回收

闭包的好处:
1.一个变量可以长期驻扎在内存中
2.避免全局变量的污染
3.私有成员的存在
缺点是常驻内存,会增大内存的使用量,使用不当很容易造成内存泄露.
关于闭包的变量: 变量向上查找是在函数被定义的地方,而不是函数使用的地方
存在某些迷惑的地方，可能更准确的应该是 需要调用变量的地方作为开始查找的起点！！！！

// demo1 函数作为返回值
	function createFn() {
	    let a = 100;
	    return function() {
	        console.log(a) // 在这里使用a, 因此从此处向上查找 -- 100
	    }
	}
	
	let a = 300;
	let fn = createFn(); // 这里定义的是fn,fn指向的是createFn的地址,而createFn 内部真正使用a的地方是在return中
	fn();
	
	
//demo2 函数作为参数被调用
	function createFn(fn) {
	    let a = 200
	    fn();
	}
	
	let a = 100;
	function fn() {
	    console.log(a); // 变量a在此处被调用,从此处开始向上查找 -- 100
	}
	createFn(fn);
	console.log('教程视频老师的说法是: 从函数定义的地方开始向外查找;但就像在demno1中,函数作为返回值,就容易混淆. 所以使用"在变量被调用的地方向上查找"会更易理解');

使用 闭包手写一个缓存函数:

	function createCache(){
		let cacheData = {}
		set(val,key){
			this.cacheData[key] = val;
		};
		get(key){
			return this.cacheData[key];
		}
	}

---

type of 能判断什么 ? js 类型
=== 与 == 具体何时使用? (强制类型转换考点)
window.onload 与DomContentLoaded的区别 (页面加载过程考点)
js创建10个a标签,点击标签弹出第n个序号( 实际是js作用域问题,for循环打印的数全是最后一次的值)
手写节流防抖(throttle debounce) – 性能优化体验考点
promise解决乐什么问题 – (异步考点,事件队列)

HTML:
h5新增和删除
块级元素: display为block 和 table的 : div h table p ul ol
行内元素 display:inline-block,inline: a span img button
CSS:

offsetWIdth : width + padding+border 没有 margin

1. BFC 是什么
2. 动画
3. clearfix

clearfix:after{
	content:"";
	display:block;
	height:0;
	clear:both;
}

4. flex 画色子

   主轴: main axis
   交叉轴: cross axis

5. line-height的百分比继承

.container{
	font-size:20px;
	lineheight:200%;
}
.item{
	font-size:16px;
}
// 此处item的行高应该是  20px *200% = 40px   
// 是先计算完父级元素的高度再继承,而不是使用16px * 200%

7. 网页视口尺寸
   window.screen.height //屏幕高度
   window.innerHeight // 网页视口高度
   document.body.clientHeight // body高度

8. 递归