JS高级学习历程-12
冒充继承
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <html> 3 <head> 4 <title>11-冒充继承</title> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 6 <meta name="description" content="" /> 7 <meta name="keywords" content="" /> 8 9 <script type="text/javascript"> 10 //冒充继承 11 function Cat(){ 12 this.weapon = "伶牙俐齿"; 13 this.climb = function(){ 14 console.log('在爬树'); 15 } 16 } 17 18 function Tiger(){ 19 //如果在这个地方把Cat构造函数的代码给执行一次 20 //这样Tiger的对象也会拥有Cat对应的成员 21 //window.Cat(); 22 Cat.call(this);//this就是north的指引,这样Cat函数内部的this就是north 23 this.color = "yellow and black"; 24 this.weight = 200; 25 } 26 27 var north = new Tiger; 28 console.log(north); 29 //该方式没有复制继承灵活,每实例化的对象都会用户全部的成员。 30 </script> 31 32 <style type="text/css"> 33 </style> 34 </head> 35 36 37 <body> 38 </body> 39 </html>
该方式没有复制继承灵活,每实例化的对象都会用户全部的成员。
【多态】
在php里边,工厂设计模式可以体现多态,
在java里边,许多同名的方法也可以体现多态。
在javascript里边可以通过this关键字体现多态。
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <html> 3 <head> 4 <title>12-this关键字体现多态</title> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 6 <meta name="description" content="" /> 7 <meta name="keywords" content="" /> 8 9 <script type="text/javascript"> 10 11 var name = "kitty"; 12 var age = 10; 13 14 function Cat(){ 15 console.log(this.name+"--"+this.age); 16 } 17 Cat();//kitty--10 18 19 var bosi = {name:'波斯猫',age:13,color:'black'}; 20 //给bosi对象增加成员方法,让其指向上边的Cat函数 21 bosi.express = Cat; 22 bosi.express();//波斯猫--13 23 24 function Wolf(){ 25 this.name = "sevenwolf"; 26 this.age = 19; 27 this.eye = "闪闪发光"; 28 } 29 var seven = new Wolf; 30 seven.say = Cat; 31 seven.say();//sevenwolf--19 32 33 var pig = {name:'花猪',age:1.5,hobby:'sleep'}; 34 Cat.call(pig);//花猪--1.5 35 36 </script> 37 38 <style type="text/css"> 39 </style> 40 </head> 41 42 43 <body> 44 </body> 45 </html>
通过this体现多态效果
【异常】
异常:Exception
try{
}catch(Exception e){
}finally{
}
异常:(有别于正常的状体)其不是具体错误,程序一开始开发没有任何问题,运行时间较长了,运行参数和运行的信息发生了变化,导致后边代码出现了错误。
1 异常类型
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <html> 3 <head> 4 <title>14-异常</title> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 6 <meta name="description" content="" /> 7 <meta name="keywords" content="" /> 8 9 <script type="text/javascript"> 10 11 var name = "tom"; 12 var age = 25; 13 14 try{ 15 //以下语句代码如果出现异常情况 16 //相关的错误信息会被catch捕捉 17 //可以通过catch里边的ex获得具体错误信息 18 console.log(name); 19 console.log(age); 20 21 console.log(addr); //使用一个未定义变量 ReferenceError 22 23 var student = new Array(-10); //RangeError Invalid array length 24 25 var num = new 20(); //TypeError number is not a function 26 27 var dog = new eval(); //TypeError function eval() { [native code] } is not a constructor 28 29 }catch(ex){ 30 //捕捉异常错误信息 31 console.log(ex); 32 } 33 34 console.log('every thing is ok'); 35 36 </script> 37 38 <style type="text/css"> 39 </style> 40 </head> 41 42 43 <body> 44 </body> 45 </html>
2 捕捉异常并抛出
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <html> 3 <head> 4 <title>15-异常</title> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 6 <meta name="description" content="" /> 7 <meta name="keywords" content="" /> 8 9 <script type="text/javascript"> 10 11 var name = "tom"; 12 var age = 25; 13 14 try{ 15 //以下语句代码如果出现异常情况 16 //相关的错误信息会被catch捕捉 17 //可以通过catch里边的ex获得具体错误信息 18 console.log(name); 19 console.log(age); 20 21 //console.log(addr); //使用一个未定义变量 ReferenceError 22 var student = new Array(-10); //RangeError Invalid array length 23 //var num = new 20(); //TypeError number is not a function 24 //var dog = new eval(); //TypeError function eval() { [native code] } is not a constructor 25 26 }catch(ex){ 27 //捕捉异常错误信息 28 //console.log(ex); 29 console.log(ex.message);//获得具体异常错误信息 30 //fileName 31 //lineNumber 32 //columnNumber 33 //for(var k in ex){ 34 // console.log(k+"--"+ex[k]); 35 //} 36 } 37 38 console.log('every thing is ok'); 39 40 </script> 41 42 <style type="text/css"> 43 </style> 44 </head> 45 46 47 <body> 48 </body> 49 </html>
3 自定义异常信息
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <html> 3 <head> 4 <title>16-异常</title> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 6 <meta name="description" content="" /> 7 <meta name="keywords" content="" /> 8 9 <script type="text/javascript"> 10 11 var name = "tom"; 12 var age = 25; 13 14 try{ 15 console.log(name); 16 console.log(age); 17 18 //自定义错误异常信息 19 if(typeof addr =='undefined'){ 20 throw {msg:'addr变量没有定义',linenumber:20,col:53,filename:'16.html'}; 21 } else { 22 console.log(addr); 23 } 24 25 }catch(ex){ 26 console.log(ex.msg);//获得具体异常错误信息 27 } 28 29 console.log('every thing is ok'); 30 31 </script> 32 33 <style type="text/css"> 34 </style> 35 </head> 36 37 38 <body> 39 </body> 40 </html>
4异常语句块
try{
}catch(ex){
可以把异常信息放入日志文件里边,供系统维护人员查看,定期对代码进行优化,避免重复出现异常
}finally{
}
在异常里边有两种情况
① 只走try语句(没有异常),之后走后边的代码,边
② try走了一半发生异常,走catch,当catch执行完毕也需要走后边的代码
try-catch后边的代码都可以放到finally里,无论是否产生异常finally里边的代码都给执行
隐藏finally关键是否使用都可以。