2022.8.7 原型链综合案例开始。深浅拷贝。深拷贝的三种方式。抛异常，异常获取和debug

 利用构造函数和原型链制作一个模态框案例

//模态框构造函数
  function Model (title = '',messgae = '') {
	  //公共属性,提示框的头和内容
	  this.title = title
	  this.messgae = messgae
	  //盒子是公共的，创建,和添加一样的类
	  this.modexBox = document.createElement('div')
	  this.modexBox.className = 'modal'   //构造函数内一定要声明用this
	  this.modexBox.innerHTML = `  <div class="header">${this.title} <i>x</i></div> 
                                   <div class="body">${this.messgae}</div>`
  }
  //挂在原型，做公共方法
  Model.prototype.open = function () {
	 document.body.appendChild(this.modexBox)
	 //获取了X号调用关闭方法,必须用this只能用箭头函数追溯上一个this
	 this.modexBox.querySelector('i').addEventListener('click',() => {this.close()})
	 
  }
  //关闭方法
  Model.prototype.close = function () {
	   document.body.removeChild(this.modexBox)
  }
  //挂在原型身上
  document.querySelector('#delete').addEventListener('click',() => {
	 const m = new Model('温馨提示','没有权限删除')
	 //调用打开方法
	 m.open()
	 
  })
  document.querySelector('#login').addEventListener('click',() => {
	  const n = new Model('温馨提示','您已登录')
	  n.open()
  })

浅拷贝

			const obj = {
				uname : '我是',
				age : 18								
			}
			//浅拷贝语法
			const p = {...obj}
			console.log(p) //18
			p.age = 100
			console.log(p) //100

 深拷贝

let i = 1
			function fn () {
				console.log(`这是第${i}次`)
				if (i>=6){
					return
				}
				i++
				fn()
			}
			
			fn()

深拷贝利用递归函数

const obj = {
			name:'pink',
			age : 18,
			hobby : ['唱','跳']
		}
		const o ={}
		//拷贝函数，简单来想就是遍历
		function deepCopy (newobj,oldobj) {
			for (let k in oldobj ){
				//处理数组问题 ，一定要先判定Arr再判定Ob
				if (oldobj[k] instanceof Array){
					newobj[k] = []
					deepCopy(newobj[k],oldobj[k])
				} else if (oldobj[k] instanceof Object){
					newobj = {}
					oldobj[k] = newobj[k]
				}
				 
				 else {
					newobj[k] = oldobj[k]
				}
				
			}
		}
		deepCopy(o,obj)
		console.log(o)
		o.age = 20
		console.log(obj)

深拷贝需要函数递归，如果遇到数组再次调用递归，如果再遇到对象再次递归（先Arr再Obj）

    引用lodash库的深拷贝

<script src="./JS库/lodash.min.js"></script>
const obj = {
				name:'pink',
				age : 18,
				hobby : ['唱','跳']
			}
		 const o = _.cloneDeep(obj)
		 console.log(o) //18
		 obj.age = 300
		 console.log(obj) //300
//利用JSOn处理深拷贝
	const obj = {
				name:'pink',
				age : 18,
				hobby : ['唱','跳'],
				family : {
					baby : '小孩'
				}
			}
			//把对象转化为json字符串，再转回来
             const o = JSON.parse(JSON.stringify(obj))
			 console.log(o) //123  
			 o.family.baby = '123'
			 console.log(obj) //小孩

throw抛异常

function fn (x,y) {
				if (!x||!y) {
					throw new Error ('参数不能为空')
				}
				return x+y
			}
			
			console.log(fn())

   利用try cath finall 记住一定给获取对象变量名

  ;(function () {
    try {
	   const p =document.querySelector('p')
	   p.style.color = 'red'
   } catch(err) {
	   console.log(err.message)  //message属性为固定
	   throw new Error ('选择器错误')
	   return
   } finally {
	   alert('执行')
   }
})()

       debugger 为函数内的断点，打开直接跳转。原理和source相同,主做调使用