天天看点

javascript 类

准备工作:

(一)js函数

Js函数基本的定义语法为:

function 函数名(arg1,arg2,……)

{}

和通常意义上的函数(方法)相似。可以有返回值。

例如:

<script>

function noReturnValue()

{    

function hasReturnValue()

{

    return 'ok';

function doClick()

    alert(noReturnValue());

    alert(hasReturnValue());

}

</script>

函数noReturnValue没有返回值,所以打印结果为:undefined

hasReturnValue返回ok字串。

(二)Function对象

ECMAScript有一类对象为:Function对象。它表示定义的任何函数(function)

var function_name = new Function(arg1, arg2, ..., argN, function_body)

示例:

function doClick2()

      var fun = new 

      Function("a1", "alert(a1);");

      fun('ok');

通过Function定义的函数对象,最后一个参数为函数体,前边的参数。两部分都以字符串类型存在。通过字符串的定义方式来定义较困难,但它指示函数是一种引用类型,函数是Function类型的一个实例,而函数名而是一个指向函数的变量。

(三)函数类型

可以通过typeof来得到js对象的类型。

示例一(类型):

function doClick3()

    var fun = new Function("a1", "alert(a1);");

    alert("Object:"+typeof (Object) + "\r\n"

    + "Date:" + typeof (Date) + "\r\n"

    + "Array:" + typeof (Array) + "\r\n"

    + "Function:" + typeof (Function) + "\r\n"

    + "new Function():" + typeof (new Function()) + "\r\n"

    + "function:" + typeof (fun) + "\r\n"

    + "new Date():" + typeof (new Date()) + "\r\n"

    + "new Array():" + typeof (new Array()) + "\r\n"

    + "new Object():" + typeof (new Object()) + "\r\n"

    );

对于对象来说它们的类型做为一种函数存在;创建完的对象除Function外,做为对象类型(object)存在。

示例二(构造方法):

function doClick4()

    alert(fun.constructor); 

    var obj = new Array();

    alert(obj.constructor); 

    var i = 0;

    alert(i.constructor);

    var num = new Number();

    alert(num.constructor);

打印的内容除第一个外都是以function 函数名(){}。那么这些对象都是通过function定义的函数对象。函数对象可以构造对象。

而函数对象的构造方法为:

function Function(){

[native code]

示例三(函数对象构造对象):

function doClick5()

    var no = new Number();

    alert("对象类型:" + typeof (no) + "\r\n构造方法:" + no.constructor); 

    alert("对象类型:" + typeof (hasReturnValue) + "\r\n构造方法:" + hasReturnValue.constructor);

    var conobj = hasReturnValue();

    alert("对象类型:" + typeof (conobj) + "\r\n构造方法:" + conobj.constructor); 

    var fun = new Function("a1", "");

    var mess1 = new fun('ok');

    alert(typeof (fun));

    alert(typeof (mess1));

    alert(mess1.constructor);

No是一个对象;hasReturnValue是一个函数对象;fun是一个函数对象。函数对象可以构造对象,所以可以有:

var conobj = hasReturnValue();

var mess1 = new fun('ok');

类定义

在java、c#中,类可以存放数据,其中最基本的类型有属性、方法、域。在js中创建(js)类有相似的功能,它的类强调的是一种复合类型。它允许通过变量名进行读取(例如js函数名可做为变量名使用)。而进行访问时,通过键对值方式进行。在C#中,访问属性其实也是这样的,例如,Customer类有公有的Name属性性,其中Name属性有读写两个属性器。假设Name属性为静态属性,则可以通过Customer.Name来访问,赋值或得到值。从大的方面讲,是一种以KV对方式进行访问。

(一)   以大括号方式定义

var customer = {};

var product = 

    name:'mp3',

    price:0

};

    alert(typeof (customer));

    alert(typeof (product));

    alert(typeof (Date));

定义了两个js类:customer和product。通过测试它们的类型(typeof),它们做为一种object类型存在。那么它们不可以通过new方式创建(函数对象可以创建对象,例如Date)。

(二)函数对象

函数对象可以创建对象,那么可以通过function来模拟类类型。

function user()

    this.username = '';

    userage = 0;

    alert(typeof (user));

    var user1 = new user();

    user1.username = "宋江";

    alert(user1.username);

这里定义了一个user类(函数)

在doClick事件(函数)中,可以得到user的类型为function,它可以用于创建对象,并可以访问。在user类中,有两个属性(也可以看做是域),其中username通过this关键字定义,userage是直接定义。创建完user对象后,即user1,可以访问username和userage

var user1 = new user();

user1.username = "宋江";

alert(user1.username);

示例二(为类添加函数):

    this.showMessage = function()

    {

        alert('user类的函数');

    }

    user1.showMessage();

对于类中的函数来说,有私有和公有访问性。通过var定义的为私有函数,通过this定义的为公有函数。

示例三(属性定义与函数定义):

在通过function定义类类型时,其中的属性(区别类中的函数)可以通过三种修饰符进行,如下:

function clsProperty()

    p1 = 1;

    var p2 = 2;

    this.p3 = 3;

    var cls = new clsProperty(); 

    alert(cls.p1);

    alert(cls.p2);

    alert(cls.p3); 

    cls.p1 = 1;

    cls.p2 = 2;

    cls.p3 = 3; 

    clsProperty.p1 = 1;

    clsProperty.p2 = 2;

    clsProperty.p3 = 3;    

    alert(clsProperty.p1);

    alert(clsProperty.p2);

    alert(clsProperty.p3);

三种修饰中在添加this关键字时,具有良好的访问支持,但无修饰或var修饰时,不可以进行操作。Var是用于定义局部变量的关键字。在定义属性时,可以把它理解为私有访问修饰符,而this则可以理解为公有访问修饰符。

function clsProperty1()

    p1 = function() { alert('p1'); };

    var p2 = function() { alert('p2'); };

    this.p3 = function() { alert('p3'); };

    var cls = new clsProperty1(); 

    cls.p1();

    cls.p2();

    cls.p3(); 

    clsProperty1.p1();

    clsProperty1.p2();

    clsProperty1.p3();

P1为无修饰符,p2为var修改符,p3为this修饰符。在doClick5中,cls.p3()和clsProperty1.p2()可以访问。所以,对于js类中的函数来讲:

Var修饰符类似C#中的静态方法(函数)修饰符;this类似实例方法(函数)修饰符。

所以对于js类中的属性来讲,也可以把var和this修饰符做为相似的比较:

Var修饰符用于私有属性修饰符;this类似公有属性修饰符。

(三)js类中的静态实现

user.age = 30;

user.showAge = function() { alert(user.age); } 

    user.showAge();

    user.age = 20;

通过在类外进行设置,可以用于静态访问。

(四)js类中的实例实现

在上一篇中,通过this关键字实现实例属性和实例方法(函数)。还有一种通过prototype关键字实现。

user.showAge = function() { alert(user.age); }

user.prototype.showMessage = function()

    alert('实例方法');

function doClick1()

    user1.showMessage();    

(五)构造方法

以上的例子中,创建类,构造方法都是无参数的。

下边是个带参数的:

function product(id, name, price)

    this.id = id;

    this.name = name;

    this.price = price;

在调用进,分为两种情况:

情况一:正好符合参数个数,正常调用;情况二:少参数,则从左到右匹配,没有匹配的为未定义;情况三:多参数,按正常匹配。

    this.getString = function()

        return("id:"+this.id+" name:"+this.name+" price:"+this.price);

    var pro1 = new product(1,'mp3',100);

    alert(pro1.getString()); 

    var pro2 = new product();

    alert(pro2.getString()); 

    var pro3 = new product(1);

    alert(pro3.getString()); 

    var pro4 = new product(1, 'mp3');

    alert(pro4.getString());

博客园大道至简

http://www.cnblogs.com/jams742003/

转载请注明:博客园