面向对象编程(OOP)----BLUE大师JS课堂笔记(二)
一,把面向过程的程序改写成面向对象的程序
1.前提 所有的程序都在onload里面
2.改写 不能函数嵌套,可以全局变量
3.onload-------------------->构造函数
全局变量------------------->属性
函数----------------------->方法
需要用到面向对象比较多的是游戏公司
4.改错,重点是this
this啥时候出问题呢?1.定时器 但凡定时器中的this都是指的是window
2.事件
解决这个方法 var _this=this;
然后通过闭包传递this
二,JSON更适合只生成一个JSON对象的情况
命名空间:JSON里面套JSON
var obj = {a:5,b:12,c:function(){
alert(this.a);
},d:{e:function(){
alert(this.f);
},f:34}};
三,继承
在PHP中表现继承的方式如下:
1 class Person{ 2 function __construct($name,$sex) 3 { 4 $this->name=$name; 5 $this->sex=$sex; 6 } //定义类的属性 7 function showName() 8 { 9 echo $this->name; //定义类的showName方法 10 } 11 function showSex() 12 { 13 echo $this->sex; //定义类的showSex方法 14 } 15 } 16 17 class Worker extends Person{ 18 function __construct($name,$sex,$job) 19 { 20 parent::__construct($name,$sex); //调用Person构造 函数,继承Person 21 } 22 }
在这个过程中,分为两部,一,定义Person类的属性和方法 二,定义worker类,并调用Person类(继承)
JS中的继承与这个过程类似:先执行父级的构造函数,然后再添加子类的属性和方法
JS中的继承的写法:
1 function Person(name,sex) 2 { 3 this.name=name; 4 this.sex=sex; 5 } //定义构造函数 6 Person.prototype.showName=function() 7 { 8 alert(this.name); 9 }; //添加showName方法 10 Person.prototype.showSex=function() 11 { 12 alert(this.Sex); 13 }; //添加showSex方法 14 15 function Worker(name,sex,job) 16 { 17 Person.call(this,name,sex); //构造函数伪装,把Worker实例伪装成Person实例,来继承Person的属性 18 this.job=job; //单独定义自己的属性 19 } 20 21 Worker.prototype=Person.prototype; //把Person.prototype指针赋给Worker.prototype 22 23 Worker.prototype.showJob=function() 24 { 25 alert(this.job); 26 }; //定义自己的方法
call改变函数执行的this
在JS中全部对象都是引用,因此上面这段代码中的21行Worker.prototype=Person.prototype;是引用的一个对象,当
Worker.prototype.showJob=function() { alert(this.job); };
给Worker.prototype.showJob时就相当于Person.prototype也有showJob方法了,这样不好,把父级都给覆盖了,因此为了解决这个问题要想办法不要把对象引用要复制,通过下面这段代买就能很好地解决这个问题
for(var attr in Person.prototype) { Worker.prototype[attr]=Person.prototype[attr]; }
这样就相当于把Person.prototype复制了一份给Worker.prototype,这样给Worker.prototype加一个方法就不会影响到Person.prototype了。
而如果整站都需要作出改变,那只要修改父级就可以了,这样会很方便,不容易出错。
四,instanceof ...是...的实例
五,系统对象:1,本地对象(非静态对象):需要实例,需要new -----------Object,Function,Array,String,Boolean,Number,RegExp,Error
2.内置对象(静态对象): 不需要实例化,直接可以用,不需要new -------------global Math
3.宿主对象:BOM DOM