window.event.srcElement是指触发事件的对象
例子:
<button onClick="aa()">测试按钮</button>
<script language="JavaScript">
function aa(){
alert(window.event.srcElement.innerText) //显示的是"测试按钮"
}
</script>
工厂模式
代码如下
- function createcar(iColor,iDoors,iMpg) {
- var oTemCar = new Object;
- oTemperCar.color = iColor;
- oTemperCar.doors = iDoors;
- oTempCar.mpg = iMpg;
- oTempCar.showColor =function() {
- alert(this.color) ;
- };
- return oTempCar;
- }
调用此函数时,将创建新对象,并赋予它所有必要的属性。例如
- var oCar = creatCar(“red“,4,23);
在此方法中,每次调用函数createCar()都会创建新函数showColor ,事实上,每个对象都共享一个函数,可以用如下的例子来解决此问题:
- function showColor() {
- alert(this.color) ;
- };
- function createcar(iColor,iDoors,iMpg) {
- var oTemCar = new Object;
- oTemperCar.color = iColor;
- oTemperCar.doors = iDoors;
- oTempCar.mpg = iMpg;
- oTempCar.showColor = showColor;
- return oTempCar;
- }
用这种方法,在createCar内部,赋予对象一个指向已经存在的showColor()函数的指针,这样就解决了问题。
2构造函数方式
- function Car (iColor,iDoors,iMpg) {
- this.color = iColor;
- this.doors = iDoors;
- this.mpg = iMpg;
- this.showColor = function() {
- alert(this.color) ;
- }
- }
创建方法
- var car = new Car(“red“,4,23);
在构造函数内无创建对象,而是使用this关键字。使用new运算符调用构造函数时,在执行第一行代码时先创建一个对象,只有用this关键字才能 访问,然后赋予this属性,默认情况下是构造函数的返回值。和工厂模式一样,构造函数会重复生成函数,为每个函数都创建独立的函数版本。
3 原型模式
- function Car() {
- }
- Car.prototype.color = “red“;
- Car.prototype.doors = 4;
- Car.prototype.mpg = 23;
- Car.prototype.showColor = function() {
- alert(this.color);
- };
创建方法
- var oCar = new Car();
在次方法中,首先定义构造函数,其中无任何代码。接下来,通过给car的prototype属性添加属性去定义car的属性。从语义上讲,所有属性都属于一个对象,解决了前面两种方法存在的问题,但是这种方法的一个缺点是不能通过给构造函数传递参数初始化属性。
那么我们就结合前两个方法来看一下下一个方法:
4 混合构造函数/原型方法
顾名思义,即用构造函数定义对象的所有非函数属性哦那个,用原型方式定义对象的函数属性。
- function Car (iColor,iDoors,iMpg) {
- this.color = iColor;
- this.doors = iDoors;
- this.mpg = iMpg;
- }
- Car.prototype.showColor = funcion() {
- alert(this.color);
- }
创建方法
- var oCar= new Car(“red“,4,23);
次方式是最主要的方式,它忽悠其他方式的特性,却没有它们的副作用。
5动态原型方法
使用混合的构造函数/原型方式感觉不是那么的和谐,定义类时,大多数面向对象语言都对属性和方法进行了视觉上的封装。动态原型方法的基本思想和混合的构造函数/原型方式基本相同,唯一的区别是赋予对象方法的位置。
- function Car (iColor,iDoors,iMpg) {
- this.color = iColor;
- this.doors = iDoors;
- this.mpg = iMpg;
- }
- if(typeof Car._initializd == “undefined“){
- Car.prototype.showColor = funcion() {
- alert(this.color);
- }
- Car._intialized = true;
- }
- }
创建方法和上例相同。
基本的用法 把ClassA的一个实例赋值给ClassB ClassB就继承了ClassA的所有属性
function ClassA()
{
this.a='a';
}
function ClassB()
{
this.b='b';
}
ClassB.prototype = new ClassA();
var objB = new ClassB();
for ( var p in objB)document.write(p + " <br> " );
</ script >
从原型继承理论的角度去考虑 js的原型继承是引用原型 不是复制原型
所以 修改原型会导致所有B的实例的变化
function ClassA()
{
this.a='a';
}
function ClassB()
{
this.b='b';
}
ClassB.prototype = new ClassA();
var objB = new ClassB();
alert(objB.a);
ClassB.prototype.a = 'changed !! ';
alert(objB.a);
</ script >
然而 子类对象的写操作只访问子类对象中成员 它们之间不会互相影响
因此 写是写子类 读是读原型(如果子类中没有的话)
function ClassA()
{
this.a='a';
}
function ClassB()
{
this.b='b';
}
ClassB.prototype = new ClassA();
var objB1 = new ClassB();
var objB2 = new ClassB();
objB1.a = ' !!! ';
alert(objB1.a);
alert(objB2.a);
</ script >
每个子类对象都执有同一个原型的引用 所以子类对象中的原型成员实际是同一个
function ClassA()
{
this.a=function(){alert();};
}
function ClassB()
{
this.b=function(){alert();};
}
ClassB.prototype = new ClassA();
var objB1 = new ClassB();
var objB2 = new ClassB();
alert(objB1.a == objB2.a);
alert(objB1.b == objB2.b);
</ script >
构造子类时 原型的构造函数不会被执行
function ClassA()
{
alert("a");
this.a=function(){alert();};
}
function ClassB()
{
alert("b");
this.b=function(){alert();};
}
ClassB.prototype = new ClassA();
var objB1 = new ClassB();
var objB2 = new ClassB();
</ script >
接下来是致命的,在子类对象中访问原型的成员对象:
function ClassA()
{
this.a=[];
}
function ClassB()
{
this.b=function(){alert();};
}
ClassB.prototype = new ClassA();
var objB1 = new ClassB();
var objB2 = new ClassB();
objB1.a.push( 1 , 2 , 3 );
alert(objB2.a);
// 所有b的实例中的a成员全都变了!!
</ script >
所以 在prototype继承中 原型类中不能有成员对象! 所有成员必须是值类型数据(string也可以)
用prototype继承有执行效率高,不会浪费内存,为父类动态添置方法后子类中马上可见等的优点。
我就非常喜欢用prototype继承。
prototype继承是通过把子类的原型对象(prototype)设置成父类的一个实例来进行继承的。
只简单的这样设置继承的确如楼主所说,有不少缺点。总的来说有四个缺点:
缺点一:父类的构造函数不是像JAVA中那样在给子类进行实例化时执行的,而是在设置继承的时候执行的,并且只执行一次。这往往不是我们希望的,特别是父类的构造函数中有一些特殊操作的情况下。
缺点二:由于父类的构造函数不是在子类进行实例化时执行,在父类的构造函数中设置的成员变量到了子类中就成了所有实例对象公有的公共变量。由于JavaScript中继承只发生在“获取”属性的值时,对于属性的值是String,Number和Boolean这些数据本身不能被修改的类型时没有什么影响。但是Array和Object类型就会有问题。
缺点三:如果父类的构造函数需要参数,我们就没有办法了。
缺点四:子类原本的原型对象被替换了,子类本身的constructor属性就没有了。在类的实例取它的constructor属性时,取得的是从父类中继承的constructor属性,从而constructor的值是父类而不是子类。
我也曾经为了这四个缺点头疼过,于是对prototype继承进行改造。
我试了几种方法,下面是我觉得最好的一种。我把它写成Function对象的一个方法,这样用的时候方便。方法如下:
Function.prototype.Extends = function (parentClass)
{
var Bs = new Function();
Bs.prototype = parentClass.prototype;
this.prototype = new Bs();
this.prototype.Super = parentClass;
this.prototype.constructor = this;
}