js高级笔记-2

1-原型链

		概念：当从一个对象中读取属性或者方法的时候，如果对象自身没有这样的属性和方法时，就会从关联的prototype哪里寻找，如果prototype中没有，就会从prototype关联的prototype中寻找，直到prototype...prototype...为null的时候，从而形成了原型链(根本上来说就是继承的关系)

			function Product(title) {
				this.title = title;
			}
			var pro1 =new Product('口红');
			/* 构造函数是否存在于pro1的原型链中 */
			console.log(Product.prototype.isPrototypeOf(pro1));// true
			/* 对象的prototype属性是否存在于pro1的原型链中 */
			console.log(Object.prototype.isPrototypeOf(pro1)); // true
			/* 构造函数的prototype属性指向对象的prototype属性 */
			console.log(Product.prototype.__proto__==Object.prototype); // true
			/* pro1是否由product构造出来 */
			console.log(pro1.constructor==Product); // true
			/* 实例化对象指向product的prototype属性 */
			console.log(pro1.__proto__==Product.prototype); // true

2-原型链关系图

3-原型链关系

Object create(构造函数)

			var person = {
				name: 'zs'
			}
			/* 通过person创建了student */
			var student = Object.create(person);
			/* 通过student创建了teacher */
			var teacher = Object.create(student);
			/* 自己不能存在于自己的原型链中 */
			console.log(teacher.isPrototypeOf(teacher)); // false
			/* student是否存在于teacher的原型链中 */
			console.log(student.isPrototypeOf(teacher)); // ture
			/* 对象的prototype是否存在于student的原型链中 */
			console.log(Object.prototype.isPrototypeOf(student));// ture
			/* person是否存在于student的原型链中 */
			console.log(person.isPrototypeOf(student));// ture

4-get与set的

			var circle = {
				r: 20,
				// get 方法名 ------- 获取值
				get acr() {
					return Math.PI * this.r * this.r;
				},
				// set 方法名 ------- 设置值
				set acr(val) {
					this.r = val
				}
			}
			console.log(circle.acr);
			circle.acr = 40;
			console.log(circle.acr);

5-属性特征

Object.defineProperty（Fn,Fun,{
定义属性特征
value:XXX,
writeable:false(是否可以被修改)
enumerable:false,(是否可以被遍历)
configurable:false(是否可以被配置)
})

			var stu={
				name:'sz',
				age:18
			}
			stu.name='张三';
			/* 属性可以被遍历修改 */
			for (let i in stu) {
				console.log(i,stu[i]);
			}
			/* 定义属性特征，一般页数情况才使用 */
			Object.defineProperty(stu,'password',{
				/* 对应属性的值 */
				value:123,
				/* 是否可以被修改 */
				writeable:true,
				/* 是否可以被遍历 */
				enumerable:true,
				/* 是否可以被重新配置 */
				configurable:true
			})
			Object.defineProperty(stu,'password',{
				/* 对应属性的值 */
				value:456
			})
			console.log(stu.password);
			for (let i in stu) {
				console.log(i,stu[i]);
			}

6-变量提升

			/* 当一个变量声明以后，会把变量的声明提升到整个作用域的最前面，但是赋值留在本地 */
			console.log(a) // 输出结果为undefined
			var a=10;

			/* 如果一个变量没有声明，直接赋值，那他的作用域就是赋值以后的区域可以使用 */
			console.log(a) // 输出结果为a没有被定义
			a=10

			/* 如果是函数，会把整个函数提升到作用域的最前面 */
			add()
			function add(){
				console.log(111) // 输出结果为111
			}

			add()
			var add=function(){
				console.log(111) //输出结果为a未定义
			}

			/* 如果全局变量和局部变量同时生效，优先使用局部变量 */
			var a=10;
			function add(){
				console.log(a); // 输出结果为undefined
				var a=100;
			}
			add()

			/* 当函数调用完成以后局部变量和局部作用域会在函数执行完毕以后一同销毁 */
			function add(){
				var a=100;
			}
			add()
			console.log(a) // 输出结果为a没有被定义

			/* 如果一个变量没有被声明直接被赋值，那么他的作用域就是被赋值以后的区域 */
			function add(){
				a=100;
			}
			add()
			console.log(a) 

			/* js中作用域，只有声明的函数的作用域。是向上寻找距离他最近的函数的开始的{ */
			function fun(){
				var a = 100;
			}
			fun();
			console.log(a);

7-作用域与作用域链

作用域：在js中只有函数的作用域，在函数内部声明的变量，才被称为局部变量
全局变量和局部变量是相对来说的
作用域链：在某个作用域内使用变量的时候，首先从该作用域内寻找，如果没有则想上级寻找，这样的一种链式关系叫做作用域链，其实指的就是变量的就近原则

			function fun(){
				var a = 100; // 对于fun来说，a是局部变量
				function funs(){
					console.log(a);// 对于funs来说，a是全局变量
				}
				funs();
			}
			fun();

8-变量的扩展let和const

let：
块级作用域：{}向上寻找距离改变了最近的开始的‘{’，作用范围就是{}之间
不能在一个作用域内部重复声明
没有变量提升的概念
暂时性死区：在一个代码块内，如果有某个变量，会绑定该区域，不在受外界影响，let没有变量提升的概念
const:
用来声明赋值不可以改变的量，其余规则和let一样

			{
					let a = 10;
			}
			console.log(a); //只有大括号之前有效 所有显示未定义

			/* 以下代码报错：a不能重复声明 */
			let a = 10;
			let a = 100;

			/* 变量a无法提升到作用最前面 */
			console.log(a);
			let a = 10;

			/* 暂时性死区 */
			let a = 100;
			{
				console.log(a);
				let a = 10;
			}

			/* 报错：a重复声明 */
			let a = 100;
			{
					变量提升
					var a = 10;
			}

			/* 不能修改值 */
			 const a = 100;
			 a = 1000;
			 console.log(a);