开发者社区> 老朱教授> 正文

使用 Microsoft Ajax Library 创建自定义客户端脚本

简介:
+关注继续查看

MSDN地址:http://msdn.microsoft.com/zh-CN/library/bb386453.aspx

Microsoft Ajax Library是微软提供的一套基于客户端的Ajax js库,通过在页面中添加ScriptManager控件可以管理这些脚本和任何自定义的脚本。

本节所介绍的所有内容均依赖于该JS库,与服务器开发无关!

MS Ajax Library有一些功能:

  • 向js中添加了面向对象的功能,可以使用类、命名空间、继承等组织js代码。
  • 反射功能,在运行时检查客户脚本的结构和组件。
  • 枚举
  • 扩展了JS的基类型,缩短开发时间
  • 更好的调试和跟踪功能。

JS面向对象的用法

Type 类为 JavaScript 编程添加了命名空间、类和继承等面向对象的功能。任何使用 Type 类注册的 JavaScript 对象都会自动获得访问此功能的权限。

复制代码
//注册命名空间
Type.registerNamespace("Demo");

//为命名空间添加Person类,后面的方法为Person的构造函数
Demo.Person = function (firstName, lastName, emailAddress) {
    this._firstName = firstName;
    this._lastName = lastName;
    this._emailAddress = emailAddress;
}

//Person类的方法
Demo.Person.prototype = {
    getFirstName: function () {
        return this._firstName;
    },

    getLastName: function () {
        return this._lastName;
    },

    getEmailAddress: function () {
        return this._emailAddress;
    },
    setEmailAddress: function (emailAddress) {
        this._emailAddress = emailAddress;
    },

    getName: function () {
        return this._firstName + ' ' + this._lastName;
    },

    dispose: function () {
        alert('bye ' + this.getName());
    },

    sendMail: function () {
        var emailAddress = this.getEmailAddress();

        if (emailAddress.indexOf('@') < 0) {
            emailAddress = emailAddress + '@example.com';
        }
        alert('Sending mail to ' + emailAddress + ' ...');
    },

    toString: function () {
        return this.getName() + ' (' + this.getEmailAddress() + ')';
    }
}
//注册类Demo.Person
Demo.Person.registerClass('Demo.Person', null, Sys.IDisposable);

//定义Employee类
Demo.Employee = function (firstName, lastName, emailAddress, team, title) {
    Demo.Employee.initializeBase(this, [firstName, lastName, emailAddress]);

    this._team = team;
    this._title = title;
}
//Employee类的方法
Demo.Employee.prototype = {

    getTeam: function () {
        return this._team;
    },
    setTeam: function (team) {
        this._team = team;
    },

    getTitle: function () {
        return this._title;
    },
    setTitle: function (title) {
        this._title = title;
    },
    toString: function () {
        return Demo.Employee.callBaseMethod(this, 'toString') + '\r\n' + this.getTitle() + '\r\n' + this.getTeam();
    }
}
//注册Demo.Employee类,并指定其继承自Demo.Person类
Demo.Employee.registerClass('Demo.Employee', Demo.Person);
复制代码

调用的代码:

var person = new Demo.Person('Jack', 'Smith', 'jack@hotmail.com');
alert(person.getEmailAddress());

var employee = new Demo.Employee('Jack', 'Smith', 'jack@hotmail.com', 'Web Dev', '');
alert(employee.getTeam());

使用接口

//注册接口
Demo.Trees.IFruitTree.registerInterface('Demo.Trees.IFruitTree');
//使用接口
//类Demo.Trees.FruitTree继承了Demo.Trees.Tree,并实现了接口Demo.Trees.IFruitTree
Demo.Trees.FruitTree.registerClass('Demo.Trees.FruitTree', Demo.Trees.Tree, Demo.Trees.IFruitTree);

使用枚举

复制代码
//注册命名空间
Type.registerNamespace("Demo");
//定义枚举类型
Demo.Color = function () { };
Demo.Color.prototype =
{
    Red: 0xFF0000,
    Blue: 0x0000FF,
    Green: 0x00FF00,
    White: 0xFFFFFF
}
//注册枚举类型
Demo.Color.registerEnum("Demo.Color");

//用法
var color = Demo.Color.Red;
复制代码

反射的用法

反射是指在运行时检查程序的结构和组件的能力。实现反射的 API 是对 Type 类的扩展。通过这些方法,可以收集有关对象的信息,例如该对象继承自谁,它是否实现特定的接口,以及它是否是特定类的实例等。

复制代码
var g = new Demo.Trees.GreenApple();
var gt = Demo.Trees.GreenApple;
var a = new Array(
    Demo.Trees.Apple,
    Demo.Trees.Tree,
    Demo.Trees.Pine,
    Demo.Trees.IFruitTree,
    Sys.IContainer);

function OnButton1Click() {
    for (var i = 0; i < a.length; i++) {
        //是否为某一类型的实例
        if (a[i].isInstanceOfType(g)) { 
            alert(gt.getName() + " is a " + a[i].getName() + ".");
        }
        else alert(gt.getName() + " is not a " + a[i].getName() + ".");
    }
}

function OnButton2Click() {
    for (var i = 0; i < a.length; i++) {
        //是否继承自某一类型
        if (gt.inheritsFrom(a[i])) {
            alert(gt.getName() + " inherits from " + a[i].getName() + ".");
        }
        else alert(gt.getName() + " does not inherit from " + a[i].getName() + ".");
    }
}

function OnButton3Click() {
    for (var i = 0; i < a.length; i++) {
        //判断类型是否为接口
        if (Type.isInterface(a[i])) {
            //判断对象是否实现了接口
            if (gt.implementsInterface(a[i])) {
                alert(gt.getName() + " implements the " + a[i].getName() + " interface.");
            }
            else alert(gt.getName() + " does not implement the " + a[i].getName() + " interface.");
        }
        else alert(a[i].getName() + " is not an interface.");
    }
}


本文转自齐师傅博客园博客,原文链接:http://www.cnblogs.com/youring2/archive/2013/01/06/2847681.html,如需转载请自行联系原作者

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
Ajax --- 客户端与服务器端之间传递数据
Ajax --- 客户端与服务器端之间传递数据
38 0
第105天:Ajax 客户端与服务器基本知识
一、服务器 前言:通俗的讲,能够提供某种服务的机器(计算机)称为服务器 1、服务器类型 - 按服务类型可分为:文件服务器、数据库服务器、邮件服务器、Web服务器等 - 按操作系统可分为:Linux服务器、Windows服务器等 - 按应用软件可分为:Apache服务器、Nginx 服务器、IIS服务器、Tomcat服务器、 weblogic服务器、WebSphere服务器、boss服务器、 Node服务器等 2、 服务器软件     使计算机具备提供某种服务能力的应用软件,称为服务器软件, 通过安装相应的服务软件,然后进行配置后就可以使计算具备了提供某种服务的能力。
1176 0
+关注
文章
问答
文章排行榜
最热
最新
相关电子书
更多
WEB浏览器中即将发生的安全变化
立即下载
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载